uni-app小程序使用uni.uploadFile上传文件时无法发送formData数据【解决】

发布于 1周前 作者 nodeper 来自 Uni-App

uni-app小程序使用uni.uploadFile上传文件时无法发送formData数据【解决】

自己的问题

3 回复

有大神遇到没。。。


没遇见过,你可以看下是不是接口交互方式不对

在uni-app小程序开发中,使用uni.uploadFile上传文件时,确实可能会遇到无法发送formData数据的问题。这通常是因为uni.uploadFile方法的参数设置不当。uni.uploadFile方法主要用于上传文件,但它也支持附带一些其他字段。不过,这些字段需要通过formData参数以特定的格式传递。

以下是一个正确的使用示例,展示了如何在uni.uploadFile中发送文件和其他formData数据:

// 假设你要上传一个文件,并且想附带一些额外的数据
const filePath = 'path/to/your/file.jpg'; // 文件路径
const url = 'https://your-server.com/upload'; // 上传接口地址

// 要发送的formData数据
const formData = {
  'user': 'testuser',
  'token': '123456abcdef'
};

// 将formData转换为适合uni.uploadFile的格式
let formDataStr = '';
for (let key in formData) {
  if (formData.hasOwnProperty(key)) {
    let value = formData[key];
    formDataStr += encodeURIComponent(key) + '=' + encodeURIComponent(value) + '&';
  }
}
formDataStr = formDataStr.slice(0, -1); // 去掉最后一个'&'

uni.uploadFile({
  url: url,
  filePath: filePath,
  name: 'file', // 后台接收文件的参数名
  formData: formDataStr, // 附带的其他数据,注意这里是字符串格式
  success: (uploadFileRes) => {
    console.log('上传成功', uploadFileRes.data);
    // 可以在这里处理上传成功后的逻辑
  },
  fail: (err) => {
    console.error('上传失败', err);
    // 可以在这里处理上传失败后的逻辑
  }
});

在上面的代码中,我们首先定义了要上传的文件路径和上传接口地址。然后,我们创建了一个包含要发送的formData数据的对象。接下来,我们将这个对象转换为一个查询字符串,因为uni.uploadFileformData参数期望的是一个字符串格式。

在调用uni.uploadFile时,我们将文件路径、上传接口地址、后台接收文件的参数名(name)、以及转换后的formData字符串传递给方法。

这样,你就可以在上传文件的同时,发送额外的formData数据了。如果你的服务器正确配置了接收这些参数,那么你应该能够在服务器端接收到这些数据。

回到顶部