如何使用 wx.uploadFile 上传文件？

推荐答案

// www.javascriptcn.com code example
wx.chooseImage({
  success(res) {
    const tempFilePaths = res.tempFilePaths;
    wx.uploadFile({
      url: 'https://example.com/upload', // 上传文件的服务器地址
      filePath: tempFilePaths[0], // 要上传的文件路径
      name: 'file', // 文件对应的 key
      formData: {
        'user': 'test'
      },
      success(res) {
        const data = res.data;
        console.log('上传成功', data);
      },
      fail(err) {
        console.error('上传失败', err);
      }
    });
  }
});

本题详细解读

1. wx.chooseImage 选择文件

首先，使用 wx.chooseImage API 选择要上传的图片文件。wx.chooseImage 会返回一个临时文件路径数组 tempFilePaths，用户可以选择一张或多张图片。

2. wx.uploadFile 上传文件

选择文件后，使用 wx.uploadFile API 将文件上传到服务器。wx.uploadFile 的主要参数包括：

• url: 上传文件的服务器地址。
• filePath: 要上传的文件路径，通常是从 wx.chooseImage 返回的临时文件路径。
• name: 文件对应的 key，服务器端通过这个 key 来获取文件。
• formData: 上传文件时附带的额外表单数据，可以传递一些额外的信息，如用户信息等。

3. 成功与失败回调

• success: 上传成功后的回调函数，res.data 包含了服务器返回的数据。
• fail: 上传失败后的回调函数，err 包含了错误信息。

4. 注意事项

• 上传的文件大小限制为 10MB。
• 上传的文件路径必须是本地路径，不能是网络路径。
• 如果需要上传多个文件，可以循环调用 wx.uploadFile。

通过以上步骤，你可以使用 wx.uploadFile 在微信小程序中实现文件上传功能。