使用 axios 将本机表单数据与其中的对象和文件反应

Posted 2023-02-22

【中文标题】使用 axios 将本机表单数据与其中的对象和文件反应

【英文标题】：react native post form data with object and file in it using axios

【发布时间】：2019-10-07 16:06:06

【问题描述】：

所以我想上传 对象作为数据 并作为注释归档 使用axios转api

uploadToServer= () => 
    const file =this.state.photo

  let data2 =sale_id:1,
            note_type_id:4,
            description:"test",
            note_content_item:" hi from broker hub"
            
            



let data = new FormData()
data.append('data[sale_id]', '1')
data.append('data[note_type_id]', '4')

data.append('data[description]', "test")

data.append('data[note_content_item]', "test")







console.log(data)


axios(
  url: api',
  method: 'POST',
  data: data,
  headers: 
   
            'Content-Type' : 'multipart/form-data',
          'Authorization':'Basic YnJva2VyOmJyb2tlcl8xMjM='

  
)
        .then(resp => console.log(resp.data.response))
        .catch(error => console.error(error)); 

首先我尝试使用没有注意的数据，我可以在邮递员中完成

但是我的代码出错了

消息：“无法保存文件” response_code: 10

仅当我将密钥从数据更改为其他内容时才会出现此错误

【参考方案1】：

你没有正确构建FormData，试试这个：

let data = sale_id:1,
                note_type_id:4,
                description:"test",
                note_content_item:" hi from broker hub"            
                
const formData = new FormData();
formData.append('data', JSON.stringify(data));
formData.append('Note', 
                     uri: "file://" //Your Image File Path
                    type: 'image/jpeg', 
                    name: "imagename.jpg",
                  );
axios(
       url    : api,
       method : 'POST',
       data   : formData,
       headers: 
                    Accept: 'application/json',
                    'Content-Type': 'multipart/form-data',
                    'Authorization':'Basic YnJva2VyOmJyb2tlcl8xMjM='
                
            )
            .then(function (response) 
                    console.log("response :", response);
           )
           .catch(function (error) 
                    console.log("error from image :");
           )

【讨论】：

即使我采用相同的方法，但它对我不起作用。

@bubble-cord 您遇到了什么错误/问题，分享您的代码以便了解您的问题。

我使用相同的代码，但无法从图像中获取错误：[错误：网络错误]，请帮助，我已经浪费了太多时间，提前谢谢

请添加注释 FormData 来自 form-data 包，即来自 import FormData from 'form-data' 我一直在努力寻找正确的，因为默认的 FormData 指向 VS Code 应用程序的内部是不正确。