微信小程序云开发：图片上传、存储和访问

在小程序开发中，处理用户上传的图片是常见需求。传统的后端开发方式相对繁琐，而微信小程序云开发提供了简洁高效的API，助你轻松实现图片的上传、存储和访问。

图片上传

首先，我们需要借助云开发提供的文件上传API将图片上传至云存储。具体步骤如下：

1. 在小程序中引入cloud模块：

const cloud = require('cloud-sdk')

2. 调用cloud.uploadFile函数进行图片上传：

const filePath = 'path/to/image.jpg'

cloud.uploadFile({
  cloudPath: 'user-images/image.jpg',
  filePath: filePath,
  success: res => {
    // 上传成功
  },
  fail: err => {
    // 上传失败
  }
})

图片存储

图片上传成功后，云开发会自动将图片存储在云存储中。文件的存储路径为cloudPath参数指定的路径，即user-images/image.jpg。

图片访问

图片存储后，我们需要获取图片的访问路径以便在小程序中展示或使用。我们可以使用cloud.getTempFileURL函数获取图片的临时访问路径：

const fileID = 'cloud://your-project-id.appservice.cloud.tencent.com/user-images/image.jpg'

cloud.getTempFileURL({
  fileList: [fileID],
  success: res => {
    // 获取临时访问路径
    const tempFileURL = res.fileList[0].tempFileURL
  },
  fail: err => {
    // 获取临时访问路径失败
  }
})

示例代码

下面是一个完整的示例代码，展示了如何使用云开发API实现图片上传、存储和访问：

const app = getApp()

Page({
  data: {
    fileID: '',
    tempFileURL: ''
  },

  chooseImage: function() {
    wx.chooseImage({
      count: 1,
      success: res => {
        const filePath = res.tempFilePaths[0]

        // 上传图片
        cloud.uploadFile({
          cloudPath: 'user-images/image.jpg',
          filePath: filePath,
          success: res => {
            this.setData({
              fileID: res.fileID
            })

            // 获取图片临时访问路径
            cloud.getTempFileURL({
              fileList: [res.fileID],
              success: res => {
                this.setData({
                  tempFileURL: res.fileList[0].tempFileURL
                })
              },
              fail: err => {
                console.error('获取临时访问路径失败', err)
              }
            })
          },
          fail: err => {
            console.error('上传图片失败', err)
          }
        })
      }
    })
  }
})