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

2,221 阅读1分钟

写在前面的话

这是一篇记录博客,因此没有过多的代码分析,只注重使用介绍。对恰好有此需求的朋友们可以下载代码使用。

源码地址

  • 请移步git下载源码

文件结构

文件结构

  • config.js为阿里云信息配置文件
  • uploadAliyun.js为主方法

快速使用

  • 在config文件配置阿里云
    let fileHost="http://frdscm.oss-cn-shenzhen.aliyuncs.com" // 阿里云路径
    let config = {
      uploadImageUrl: `${fileHost}`, //默认存在根目录,可根据需求改
      AccessKeySecret: 'h3RdiKm0ohUUN5tzRMoZ0nvqhxxxxx',
      OSSAccessKeyId: 'LTAIbH8hu0Uexxxx',
      timeout: 87600 //这个是上传文件时Policy的失效时间
    };
  • 导入上传方法
    const uploadImage = require('@src/untils/upload/uploadAliyun.js')
  • 使用
    uploadAioss = (filePath, key) => { // 上传阿里云
        return new Promise((reslove, reject) => {
            uploadImage(
                filePath, // 文件真实上传路径
                "",
                key, // 传给后台的路径 => 自己拼的路径 一般为时间+uuid+文件名等因人而异
                (res) => {
                    reslove(res)
                    console.log("上传成功", res)
                },
                (e) => {
                    reject(e)
                }
            )
        })
      }
      
    uuid = () => { // uuid生成方法
        return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
            const r = (Math.random() * 16) | 0,
                v = c === 'x' ? r : (r & 0x3) | 0x8;
            return v.toString(16);
        })
    }

注:文件真实上传路径移步小程序api wx.uploadFile

最后,有疑问的朋友可以多看阿里云文档,有兴趣的朋友可以看看代码实现方法。温馨提示,小程序不支持uuid插件,大家可以上网搜索,好多大牛都有解决方案。最后这是自己项目过程中的自我记录,希望能给有需要的朋友,提供一个快捷的方法。减少采坑时间。谢谢~