文件上传.md 5.7 KB

API文档:Swagger UI (kerryonvip.com)

阿里云OSS API上传文档:基于OSS API上传 (aliyun.com)

服务端加密方案:

1、前端上传文件 --> 服务端将文件上传至OSS; 2、后端存储OSS返回的文件地址; 3、当前端访问数据时,返回一条限时可访问的链接; 接口:/s/file/oss/upload-public-multipart-file 示例:

curl -X POST "https://dev-s-gateway-kip.kerryonvip.com/api/file/v1/s/file/oss/upload-public-multipart-file" -H "accept: */*" -H "Content-Type: multipart/form-data" -F "file=@juejin二维码.png;type=image/png"

Response body

{
  "url": "https://kip-public-dev.oss-cn-shanghai.aliyuncs.com/dd032c36294344eda0d7d3476cfee6f7_juejin二维码.png"
}

Response headers

 cache-control: no-cache, no-store, max-age=0, must-revalidate connection: keep-alive  content-type: application/json  date: Wed, 07 Dec 2022 03:38:45 GMT  expires: 0  pragma: no-cache  referrer-policy: no-referrer  strict-transport-security: max-age=15724800; includeSubDomains  transfer-encoding: chunked  x-content-type-options: nosniff  x-frame-options: DENY  x-request-id: c0fef2fd74e5c153962bb543b3399102 x-xss-protection: 1 ; mode=block

前端加密:

上传: 1、在前端先将文件转为base64数据; 2、将base64数据通过AES1加密; 3、最后将文件以 txt文本方式上传至OSS 4、保存OSS文件

下载: 当用户返回访问条件时,下载txt文件,先解密,然后再将base64渲染至前端页面;

微信小程序上传图片

上传图片的话就做上传头像的时候遇到了,就拿上传头像举个例子吧

得知道我们都用到什么api,而且提醒一下,这个需要后端配合,因为最后需要上传到服务器

先写一下wxml吧

<view class='box' bindtap='uploadHeadImg'>上传</view>
  • 其一,我们得先提示菜单:[从相册中选择,拍照]----wx.showActionSheet

    uploadHeadImg: function() {
        let a = this;
        wx.showActionSheet({
            itemList: [ "从相册中选择", "拍照" ],
            itemColor: "#f7982a",
            success: function(e) {
            //album:相册   //camera拍照
                e.cancel || (0 == e.tapIndex ? a.chooseWxImageShop("album") : 1 == e.tapIndex && a.chooseWxImageShop("camera"));
            }
        });
    },
    
  • 其二,选择照片或者拍照,返回临时路径----wx.chooseImage

    //a:选择的类型  //album:相册   //camera拍照
    chooseWxImageShop: function(a) {
        var e = this;
        wx.chooseImage({
            sizeType: [ "original", "compressed" ],
            sourceType: [ a ],//类型
            count:1,
            success: function(a) {
                if(a.tempFiles[0].size> 2097152){
                    wx.showModal({
                        title: "提示",
                        content: "选择的图片过大,请上传不超过2M的图片",
                        showCancel: !1,
                        success: function(a) {
                            a.confirm;
                        }
                    })
                }else{
                    //把图片上传到服务器
                    e.upload_file(a.tempFilePaths[0])
                }
            }
        });
    },
    
  • 其三,把图片上传到服务器----wx.uploadFile

    upload_file: function(e) {
    wx.showLoading({
        title: "上传中"
    });
    wx.uploadFile({
        url:url,
        filePath: e,//图片路径
        name: "user_avatar",
        formData: {
            token: a.globalData.token,
            user_avatar: "filePath"
        },
        header: {
            "Content-Type": "multipart/form-data"
        },
        success: function(a) {
            wx.hideLoading();
            wx.showToast({
                title: "上传成功",
                icon: "success",
                duration: 3000
            });
        },
        fail: function(a) {
            wx.hideLoading();
            wx.showToast({
                title: "上传失败",
                icon: "none",
                duration: 3000
            });
        }
    });
    },
    

上传成功

作者:肥的ChuaChua
链接:https://www.jianshu.com/p/bc1f1e660592
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

https://kip-public-dev.oss-cn-shanghai.aliyuncs.com https://kip-public-lt.oss-cn-shanghai.aliyuncs.com https://kip-public-qa.oss-cn-shanghai.aliyuncs.com https://kip-public.oss-cn-shanghai.aliyuncs.com https://ks-static-dev-1302271073.oss-cn-shanghai.aliyuncs.com

已配置: https://kip-private-dev.oss-cn-shanghai.aliyuncs.com

待删除: https://kip-public-prod.oss-cn-shanghai.aliyuncs.com https://kip-public-dev.oss-cn-shanghai.aliyuncs.com https://kip-public-qa.oss-cn-shanghai.aliyuncs.com https://kip-public.oss-cn-shanghai.aliyuncs.com

待配置: qa环境 https://kip-private-qa.oss-cn-shanghai.aliyuncs.com sl环境 https://kip-private.oss-cn-shanghai.aliyuncs.com prod环境 https://kip-private.oss-cn-shanghai.aliyuncs.com

最终版本: dev环境 kip-private-dev.oss-cn-shanghai.aliyuncs.com qa环境 kip-private-qa.oss-cn-shanghai.aliyuncs.com sl环境 kip-private.oss-cn-shanghai.aliyuncs.com prod环境 kip-private.oss-cn-shanghai.aliyuncs.com