Illegal invocation

问题描述:在使用jQuery封装的ajax请求的时候,用于上传图片,表单等一系列。里面formData方法传入作为data的属性值的时候,会出现这个错误

Illegal invocation

在网上百度了一下,只需要添加两行代码就可以解决了。

contentType: false,
// 告诉jQuery不要去设置Content-Type请求头
processData: false,
// 告诉jQuery不要去处理发送的数据

contentType

告诉服务器从浏览器提交过来的数据格式。

默认值是:contentType = "application/x-www-form-urlencoded"

如果不设置的话,我们查看Request headers里面的内容

Illegal invocation_第1张图片
image.png

如果为 contentType:false的话,

Illegal invocation_第2张图片
image.png

如果使用formData的方式提交表单的话,会默认 contentType:'multipart/form-data'

所以这到底是什么意思呢?

这是分界符,后面的一堆字符串是随机生成的,目的是防止上传文件中出现分界符导致服务器无法正确识别文件起始位置。如果为true的时候,jq就会去操作这个分界符,导致后台服务器无法操作数据,导致请求失败。

processData

默认为true,规定通过请求发送的数据是否转换为查询字符串,默认情况下,通过data选项传递进来的数据,如果是一个对象(技术上讲只要不是字符串),都会处理转化成一个查询字符串,以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。

总结来说

本次项目中用到了jQuery封装的ajax请求,并结合了formData的形式来传输数据,因为用了formData会默认 contentType:'multipart/form-data',如果不用Content-Type: application/x-www-form-urlencoded,为了保证后台能够解析浏览器传输过去的数据的时候,我们需要设置contentType:false(防止jq去操作,失去这个分界符)。

借鉴:https://segmentfault.com/a/1190000007207128

你可能感兴趣的