精华内容
下载资源
问答
  • 主要介绍了Java微信小程序oss图片上传的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
  • 微信小程序oss上传文件引用js 包括Signature及policy生成方法
  • src = "//oss地址视频" 解决方式:地址前加上https: 或者http: src = "https://oss地址视频
    src = "//oss地址视频"

    解决方式:地址前加上https: 或者http:

    src = "https://oss地址视频"

     

    展开全文
  • 此文件专门为微信小程序使用,使用教程https://blog.csdn.net/weixin_42594068/article/details/116521561 crypto模块的目的是为了提供通用的加密和哈希算法。用纯JavaScript代码实现这些功能不是不可能,但速度会...
  • 小程序OSS图片上传

    2018-05-21 15:36:00
    let foot1 = 'x-oss-process=image/resize,w_1080,h_1920,m_fill/watermark,type_d3F5LXplbmhlaQ,size_38,text_' const aliyunFileKey = post.dir + that.guid() + type; let showUrl = null; wx.uploadFile({ ...

    图片上传加水印问题,代码如下!

    chooseImage: function (e) {
        var that = this;
        wx.chooseImage({
          sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
          sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
          success: function (res) {
            // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
            console.log(res)
            let tempFilePaths = res.tempFilePaths;
            let imgFile = res.tempFiles;
            for (let i = 0; i < tempFilePaths.length;i++){
              let n = tempFilePaths[i].lastIndexOf('.');
              let type = tempFilePaths[i].substring(n);
              wx.request({
                url: 'https://www.********.com/api/plat/system/oss/signature?dir=wechatApp', //获取oss签名
                success: function (res) {
                  console.log('签名', res.data.data)
                  if (res.data.status == 'SUCCESS') {
                    let post = res.data.data;
                    let foot1 = 'x-oss-process=image/resize,w_1080,h_1920,m_fill/watermark,type_d3F5LXplbmhlaQ,size_38,text_'
                    const aliyunFileKey = post.dir + that.guid() + type;
                    let showUrl = null;
                    wx.uploadFile({
                      url: post.host, //上传到OSS
                      filePath: tempFilePaths[i],
                      name: 'file',
                      formData: {
                        'key': aliyunFileKey,
                        'OSSAccessKeyId': post.accessKeyId,
                        'policy': post.policy,
                        'signature': post.signature,
                        'success_action_status': '200'
                      },
                      success: function (res) {
                        console.log("阿里云", res.statusCode)
                        if (res.statusCode == 200){
                          wx.showToast({
                            title: '上传成功',
                            icon:'success',
                            duration:1200
                          })
                          if (that.data.encodeWord) {
                            showUrl = post.host + '/' + aliyunFileKey + '?' + foot1 + that.data.encodeWord + that.data.urlFoot1;
                          } else {
                            showUrl = post.host + '/' + aliyunFileKey
                          }
                          let s = [showUrl]
                          that.setData({
                            files: that.data.files.concat(s)
                          });
                        }else{
                          wx.showToast({
                            title: '上传失败!',
                            icon: 'none',
                            duration: 1200
                          })
                        }
                      }
                    })
                  }
                }
              })
            }
          }
        })
    

    wx.uploader中的name字段必须为file. 我这里是需要回显预览图片的时候需要图片有水印效果,才会去更改data中的files,这样也能做到批量上传的效果。

    转载于:https://www.cnblogs.com/hjj2ldq/p/9067495.html

    展开全文
  • 小程序js //启动上传等待中… wx.showToast({ title: ‘正在上传…’, icon: ‘loading’, mask: true, duration: 10000 }) //上传图片 wx.uploadFile({ url: '’,//上传的路径(Java后台路径) filePath: ...

    先将图片上传到服务器,再将服务器上的图片传入oss中
    小程序js

    
    		//启动上传等待中...
            wx.showToast({
              title: '正在上传...',
              icon: 'loading',
              mask: true,
              duration: 10000
            })
            //上传图片
            wx.uploadFile({
              url:  '***********',//上传的路径(Java后台路径)
              filePath: tempFilePaths[0],
              name: 'file',
              success: function (res) {
                console.log(res.data)//oss图片路径
                wx.showToast({
                  title: "上传成功",
                  icon: 'success',
                  duration: 1000
                })
              },
              fail: function ({ errMsg }) {
                wx.showToast({
                  title: "上传失败",
                  duration: 1000
                })
              },
            })
    

    Java后台

    
    @RequestMapping("/programImg")
    public @ResponseBody String programImg(@RequestParam(required = false) MultipartFile file,HttpServletRequest request) {
    		File targetFile=null;
            String str="";//返回存储路径
            String fileName=file.getOriginalFilename();//获取文件名加后缀
            if(fileName!=null&&fileName!=""){   
                String returnUrl =  ”*****“;//服务器存储路径
                String fileF = FilenameUtils.getExtension(file.getOriginalFilename());//文件后缀
                fileName=”*****************“;//新的文件名
                //先判断文件是否存在,获取文件夹路径
                File file1 =new File(returnUrl); 
                //如果文件夹不存在则创建    
                if(!file1 .exists()  && !file1 .isDirectory()){       
                    file1 .mkdir();  
                }     
                //将图片存入文件夹
                targetFile = new File(file1, fileName);
                try {              
                	//将上传的文件写到服务器上指定的文件。
                	file.transferTo(targetFile);  
                    String gifName = "******";//图片oss上传根目录
                    String url=gifName+"/"+fileName;
                    putObject(targetFile, gifName,fileName);
                    str=““;//oss图片路径
                } catch (Exception e) {
                    e.printStackTrace();                
                }            
            }
           return str;
    	}
    public static void putObject(File file,String fileName,String fileName){
    		OSSClient ossClient=null;
    		try {
    			//初始化oss
    			ossClient = ossIni();
    			//上传路径
    			String route=fileName+"/"+fileName;
    			//上传图片  img-program--Bucket名称
    			ossClient.putObject("img-program",route,file);
    		} catch (Exception e) {
    			if (ossClient!=null) {
    				ossClient.shutdown();
    			}
    			e.printStackTrace();
    		}
    		ossClient.shutdown();
    	}
    private static OSSClient ossIni(){
    		OSSClient  ossClient = null;
    		try {
    			ossClient = new OSSClient(ENDPOINT,KEY_ID,KEY_SECRET);
    			System.out.println("oss 初始化成功");
    		} catch (Exception e) {
    			e.printStackTrace();
    		}
    		return ossClient;
    }
    public static final String ENDPOINT="****************";
    public static final String KEY_ID="*****************";
    public static final String KEY_SECRET="****************";
    
    展开全文
  • 先将图片上传到服务器,再将服务器上的图片传入oss中//启动上传等待中...wx.showToast({title: '正在上传...',icon: 'loading',mask: true,duration: 10000})//上传图片wx.uploadFile({url: '***********',//上传的...

    先将图片上传到服务器,再将服务器上的图片传入oss中

    //启动上传等待中...

    wx.showToast({

    title: '正在上传...',icon: 'loading',mask: true,duration: 10000

    })

    //上传图片

    wx.uploadFile({

    url: '***********',//上传的路径(Java后台路径)

    filePath: tempFilePaths[0],name: 'file',success: function (res) {

    console.log(res.data)//oss图片路径

    wx.showToast({

    title: "上传成功",icon: 'success',duration: 1000

    })

    },fail: function ({ errMsg }) {

    wx.showToast({

    title: "上传失败",})

    Java后台

    @RequestMapping("/programImg")

    public @ResponseBody String programImg(@RequestParam(required = false) MultipartFile file,HttpServletRequest request) {

    File targetFile=null;

    String str="";//返回存储路径

    String fileName=file.getOriginalFilename();//获取文件名加后缀

    if(fileName!=null&&fileName!=""){

    String returnUrl = ”*****“;//服务器存储路径

    String fileF = FilenameUtils.getExtension(file.getOriginalFilename());//文件后缀

    fileName=”*****************“;//新的文件名

    //先判断文件是否存在,获取文件夹路径

    File file1 =new File(returnUrl);

    //如果文件夹不存在则创建

    if(!file1 .exists() && !file1 .isDirectory()){

    file1 .mkdir();

    }

    //将图片存入文件夹

    targetFile = new File(file1,fileName);

    try {

    //将上传的文件写到服务器上指定的文件。

    file.transferTo(targetFile);

    String gifName = "******";//图片oss上传根目录

    String url=gifName+"/"+fileName;

    putObject(targetFile,gifName,fileName);

    str=““;//oss图片路径

    } catch (Exception e) {

    e.printStackTrace();

    }

    }

    return str;

    }

    public static void putObject(File file,String fileName,String fileName){

    OSSClient ossClient=null;

    try {

    //初始化oss

    ossClient = ossIni();

    //上传路径

    String route=fileName+"/"+fileName;

    //上传图片 img-program--Bucket名称

    ossClient.putObject("img-program",route,file);

    } catch (Exception e) {

    if (ossClient!=null) {

    ossClient.shutdown();

    }

    e.printStackTrace();

    }

    ossClient.shutdown();

    }

    private static OSSClient ossIni(){

    OSSClient ossClient = null;

    try {

    ossClient = new OSSClient(ENDPOINT,KEY_ID,KEY_SECRET);

    System.out.println("oss 初始化成功");

    } catch (Exception e) {

    e.printStackTrace();

    }

    return ossClient;

    }

    public static final String ENDPOINT="****************";

    public static final String KEY_ID="*****************";

    public static final String KEY_SECRET="****************";

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

    总结

    如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

    本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。

    如您喜欢寻找一群志同道合、互帮互助的学习伙伴,可以点击下方链接加入:

    编程之家官方1群

    编程之家官方2群

    编程之家官方3群

    编程之家官方4群

    展开全文
  • 微信小程序阿里oss直传

    千次阅读 2019-06-29 22:26:03
    2、小程序配置上传域名白名单 3、后端接口签名 const { Base64 } = require('js-base64'); const crypto = require('crypto'); const accessid = "************";//oss keyId const accesskey = "*********...
  • 小程序图片上传阿里OSS使用方法步骤: 开通OSS服务 (此图片来源于网络,如有侵权,请联系删除! ) 创建Bucket   设定权限属性 设定为公共读:上传需要授权,下载无需   打开BUCKET跨域属性 (此图片来源于网络,如有...
  • 小程序二维码的接口返回的是二进制流,如果我们是想把小程序二维码图片存入OSS中,则不需要把二进制流转为图片保存再上传OSS,直接将获取的二进制流通过字符串上传的方式写入OSS的文件中。 微信小程序开发文档 ...
  • 主要为大家详细介绍了微信小程序上传文件到阿里OSS教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 小程序上传文档到OSS

    2019-04-24 13:39:22
    小程序上传文件到阿里云服务器,需注意的几点: 1.阿里云提供直传的方法有PutObject,和PostObject(参加地址:https://help.aliyun.com/document_detail/31988.html?spm=5176.doc31948.6.868.XU1RWy) 微信小程序...
  • 微信小程序上传图片到阿里云oss、主要注释都写在js文件里了,相信你们都看的懂哈、你的域名下的/cbb文件下的/当前年月日文件下的/图片.png
  • 由于小程序包大小的限制,起初考虑把文件放在服务器上,但是考虑后续会持续增加文件,就放在oss上了,如何获取文件呢,很简单 uni.request({ url: 'https://xxx.oss-cn-shanghai.aliyuncs.com/data/xx.json', ...
  • x-oss-process=image/resize,w_240 if (res.data.success) { that.setData({ realPic: res.data.result.pictureUrl, //小程序端展示 realId: res.data.result.id, photo: res.data.result.thumbPictureUrl }) wx....
  • 阿里云的oss上传,后台接收小程序图片上传,并返回到前端的类库
  • 小程序中使用oss上传

    2020-09-09 12:14:13
    oss是直接通过阿里云的上传方式,说说我之前的做法吧 第一步,封装接口 /* API-OSS文件管理($get是我这边封装好的请求方式) */ // 获取OSS签名 export const GET_OSS_SIGN = () => $get('/oss/signature') ...
  • springboot整合阿里云OSS做服务端签名让微信小程序文件直传OSS 1、需求: 想让小程序直接上传图片、文件到OSS存储,不需要经过我的服务器接收文件再转发到OSS存储。 好处 可以减轻自己服务器的压力,和不必要的...
  • 本项目使用 mpvue 框架开发小程序小程序或者h5项目可参考,大体都一样的逻辑。效果如下: 首先比较重要的一点,就是要请求后端接口获取 oss的签名,oss的签名是啥?可以参考 oss官方文档 ...
  • 这两天修改公司小程序的一些功能,发现上传图片至OSS失败,便一直寻找出现了什么问题,最后发现是policy过期,更改后发现相应的signature也要改,因为需要特定的处理才能生成signature,当时好一顿查资料,最后算出...
  • 微信小程序上传图片到阿里云oss 最近开发微信小程序要求上传图片到阿里云oss上,所以就顺手整理一下整个过程啦。 前提 开通oss服务和创建oss存储空间啦(这个就自己去解决吧)下面接入正题: 步骤一:配置 ...
  • 小程序中使用了oss的图片资源,结果显示403,服务器拒绝了我。 第一种方法:在URL前加了https://images.weserv.nl/?url= 确实可用了,就是太慢,这是一个外网,服务慢是可以理解的。 第二种方法:在阿里云服务器里...
  • Image_upload_aliyun 微信小程序上传图片到阿里云oss 我把主要注释都写在js文件里了,相信你们都看的懂哈!!!
  • 主要介绍了微信小程序环境下将文件上传到OSS的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 22,950
精华内容 9,180
关键字:

小程序oss