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

下面是详细的“微信小程序上传文件到阿里OSS教程”，包含以下步骤：

1. 注册阿里云账号

如果还没有阿里云的账号，需要先注册一个账号，注册地址：https://account.aliyun.com/register/register.htm

2. 创建 OSS Bucket

登录阿里云控制台，进入对象存储 OSS 控制台，创建自己需要的 Bucket。具体操作可以参考：https://help.aliyun.com/document_detail/32008.html

3. 获取阿里云 OSS 的 Access Key 和 Secret Key

在阿里云控制台中找到自己的 Access Key 和 Secret Key。在“AccessKey 管理”的界面可以创建 Access Key，Secret Key 就是 Access Key 对应的密码。

4. 小程序端上传文件

在小程序端使用 wx.uploadFile 方法来上传文件到阿里云 OSS。示例代码如下：

wx.uploadFile({
  url: 'https://yourbucketname.oss-cn-beijing.aliyuncs.com', // Bucket 域名，注意要使用 HTTPS 协议
  filePath: tempFilePath,
  name: 'file',
  header: {
    'content-type': 'multipart/form-data',
  },
  formData: {
    'key': '上传路径', // 上传到 OSS 的路径，可自定义
    'policy': '上传策略',
    'OSSAccessKeyId': 'AccessKeyId', // 这里需要替换成自己的 AccessKeyId
    'success_action_status': '200', // 上传成功后的返回状态码，默认为 204
    'signature': '上传签名', // 上传签名，可在服务端生成
  },
  success(res) {
    console.log('上传成功', res)
  },
  fail(res) {
    console.error('上传失败', res)
  }
})

其中，tempFilePath 是待上传文件的临时路径，key 是上传到 OSS 的路径，policy 是上传策略，OSSAccessKeyId 是 AccessKeyId，signature 是上传签名，这些需要在服务端生成并传递给小程序。

5. 服务端生成上传策略和签名

上传策略和签名是由服务端生成的，需要使用阿里云的 OSS Node.js SDK。示例代码如下：

const OSS = require('ali-oss')

// 初始化 OSS 客户端
const client = new OSS({
  region: 'oss 地域',
  accessKeyId: 'AccessKeyId',
  accessKeySecret: 'AccessKeySecret',
  bucket: 'Bucket 名称',
})

// 生成上传策略和签名
const policy = client.generateUploadPolicy({
  expiration: new Date(Date.now() + 60 * 60 * 1000), // 过期时间 1 小时
  conditions: [
    ['content-length-range', 0, 1048576000] // 限制文件大小，这里是 1GB
  ]
})
const signature = client.signature(policy)

console.log('上传策略：', policy)
console.log('上传签名：', signature)

其中，region 需要替换成实际的 oss 地域，accessKeyId 和 accessKeySecret 分别对应阿里云控制台中的 Access Key 和 Secret Key，bucket 是创建的 OSS Bucket 名称。

示例

示例1：上传图片

wx.chooseImage({
  success(res) {
    const tempFilePath = res.tempFilePaths[0]
    wx.uploadFile({
      url: 'https://yourbucketname.oss-cn-beijing.aliyuncs.com',
      filePath: tempFilePath,
      name: 'file',
      header: {
        'content-type': 'multipart/form-data',
      },
      formData: {
        'key': `images/${Date.now()}_${Math.floor(Math.random()*1000)}.png`,
        'policy': '上传策略',
        'OSSAccessKeyId': 'AccessKeyId',
        'success_action_status': '200',
        'signature': '上传签名',
      },
      success(res) {
        console.log('上传成功', res)
      },
      fail(res) {
        console.error('上传失败', res)
      }
    })
  }
})

示例2：上传视频

wx.chooseVideo({
  sourceType: ['album', 'camera'],
  maxDuration: 60,
  success(res) {
    const tempFilePath = res.tempFilePath
    wx.uploadFile({
      url: 'https://yourbucketname.oss-cn-beijing.aliyuncs.com',
      filePath: tempFilePath,
      name: 'file',
      header: {
        'content-type': 'multipart/form-data',
      },
      formData: {
        'key': `videos/${Date.now()}_${Math.floor(Math.random()*1000)}.mp4`,
        'policy': '上传策略',
        'OSSAccessKeyId': 'AccessKeyId',
        'success_action_status': '200',
        'signature': '上传签名',
      },
      success(res) {
        console.log('上传成功', res)
      },
      fail(res) {
        console.error('上传失败', res)
      }
    })
  }
})

以上就是简单的“微信小程序上传文件到阿里OSS教程”的完整攻略，可根据实际情况作出修改。