微信小程序上传文件到阿里云OSS

封装在upload.js文件中

需要使用npm安装两个包,具体步骤:

1.npm init

2.npm install ...(安装js-base64与crypto-js)

3.菜单-工具-构建npm(本地设置要勾选使用npm模块)

const { Base64 } = require('js-base64')
const Crypto = require('crypto-js')
export const Host = '' //申请的阿里云OSS地址
const config = {
  AccessKeySecret: '', //提供的secret
  OSSAccessKeyId: '', //提供的id
  timeout: 30000 //上传文件时Policy的失效时间
}

const getPolicyBase64 = function () {
  let date = new Date()
  date.setHours(date.getHours() + config.timeout)
  let time = date.toISOString()
  const policyText = {
    "expiration": time, //设置该Policy的失效时间
    "conditions": [
      ["content-length-range", 0, 100 * 1024 * 1024] // 设置上传文件的大小限制,100mb
    ]
  }
  const policyBase64 = Base64.encode(JSON.stringify(policyText))
  return policyBase64
}

const getSignature = function (policyBase64) {
  const accesskey = config.AccessKeySecret
  return Crypto.enc.Base64.stringify(
    Crypto.HmacSHA1(policyBase64, accesskey)
  );
}

//params中包含两个参数
//filePath:文件的本地路径,使用wx原生api选择的文件的虚拟路径即可
//aliyunPath:文件在阿里云的路径,例如存在阿里云的file文件夹下,则为“file/文件名.扩展名”
export function uploadFile(params) {
  const policyBase64 = getPolicyBase64()
  const signature = getSignature(policyBase64)
  wx.uploadFile({
    url: Host,
    filePath: params.filePath,
    name: 'file',
    formData: {
      'key': params.aliyunPath,
      'policy': policyBase64,
      'OSSAccessKeyId': config.OSSAccessKeyId,
      'signature': signature
    },
    success(res) {
      //上传成功返回204
      if (res.statusCode == 204) {
        console.log(res)
      }
    },
    fail(err) {
      wx.showToast({
        title: err,
        icon: 'none'
      })
    }
  })
}

ps:wx.uploadFile貌似每次只能传一个文件,上传多个文件可以使用循环上传

import { uploadFile } from '/api.js'
const app = getApp()
//循环需要上传的文件列表
for (let i in this.data.uploadFileList) {
    uploadFile({
        aliyunPath: ,
        filePath:
    })
}
//若uploadFile是异步函数,可以使用定时器,每次上传成功将共享数据+1,当共享数据与文件列表的数量相同时,认为全部上传成功
let interval = setInterval(() => {
    //上传完成的数量等于文件列表的数量,执行后续提交到服务器
    if (app.globalData.uploadNum == this.data.uploadFileList.length) {
        this.submit()
        app.globalData.uploadNum = 0 //计数重置
        clearInterval(interval)
    }
}, 500)

 

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值