关于传输文件使用multipart/form-data格式传输的问题

1.请求封装不加任何的请求头

2.使用new FromData()

3.使用FormData的方法append()

4.ant.design中组件upload上传的文件需要手动改成原始文件(组件的文件经过封装的) file.originFileObj

  // 提交表单
  const uploadForm = async (values) => {
    console.log('提交数据', values);
    const formData = new FormData();
    const { file, image, type, description, modelName } = values;
    formData.append('type', type);
    formData.append('description', description);
    formData.append('modelName', modelName);
    formData.append('file', file[0].originFileObj);
    formData.append('image', image[0].originFileObj);

    const res = await addModel(formData);

    if (res.result_code == 200) {
      message.success('添加成功');
      addModelList(searchValue);
      return true;
    } else [message.error('添加失败')];
  };

 

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
multipart/form-data是一种用于在HTTP POST请求中递数据的编码格式。它是通过设置请求头的Content-Type为multipart/form-data来指定的。 该格式使用一个boundary字符串来分隔请求头和请求体的数据,每个数据段都以"--${boundary}"开头和结尾,中间是具体的数据内容。 具体使用multipart/form-data格式的POST请求的步骤如下: 1. 在请求头中设置Content-Type为multipart/form-data,并设置boundary的值。 2. 构建请求体的数据段,每个数据段都以"--${boundary}"开始和结束。 3. 每个数据段包括一个头部和一个数据部分。头部包括Content-Disposition和Content-Type等字段,用于描述数据的类型和属性。数据部分即实际要传输的数据。 4. 所有数据段按顺序组成请求体,每个数据段之间以"--${boundary}"分隔。 5. 最后以"--${boundary}--"表示请求体的结束。 通过以上步骤,就可以将数据以multipart/form-data格式进行编码,并通过POST请求发送到服务器。这种格式常用于上文件或提交表单数据等场景,能够有效地递复杂的数据结构。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [Multipart/form-data POST文件详解](https://blog.csdn.net/iteye_13868/article/details/82165506)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [multipart/form-data (一种POST 数据提交的方式)](https://blog.csdn.net/dreamerrrrrr/article/details/111146763)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值