场景:比如现在有导出csv的url, 要求方式为get/post,后端是要求数据是form表单数据form-data的形式。
处理:
1 ,直接用form表单提交
设置好action,method即可,设置form提交content-type是multipart/form-data,如果不设置 enctype 属性,那么最终就会以 application/x-www-form-urlencoded 的默认方式提交数据。
2 , xmlHttpRequest方式处理(使用ajax)
需要数据处理为FormData形式即可(https://developer.mozilla.org/zh-CN/docs/Web/API/FormData)
以vue的项目为例,下文的someData为举例
//生成formData类型数据
const formDataTrans = new FormData();
formDataTrans.append("name", someData.name);
formDataTrans.append("age", someData.age);
formDataTrans.append("sex", someData.targetDesc);
(如果传递参数为formData形式,浏览器会忽略或者删除自定的Content-type,并添加Content-type:"multipart/form-data")
ajax({
url: "后端定义的接口,
method:‘post',
headers:{
"Content-type": "multipart/form-data"
},
data: formDataTransfer
})
FormData 接口提供了一种表示表单数据的键值对的构造方式,经过它的数据可以使用 XMLHttpRequest.send() 方法送出,本接口和此方法都相当简单直接。如果送出时的编码类型被设为 "multipart/form-data",它会使用和表单一样的格式。
网友评论