浅谈contentType = false

renweihub 发布于2019-08-21 14:38 / 2643人阅读

摘要：起初，协议中没有上传文件方面的功能，直到为协议添加了这个功能。而我们在中设置为是为了避免对其操作，从而失去分界符，而使服务器不能正常解析文件。

在刚接触 JQuery 中的 ajax 时，对其 contentType 并没有很在意，只是知晓它是代表发送信息至服务器时内容编码类型,通俗点说就是告诉服务器从浏览器提交过来的数据格式。

默认值为contentType = "application/x-www-form-urlencoded".在默认情况下，内容编码类型满足大多数情况。
在这里，我们主要谈谈contentType = false.
在使用ajax上传文件时：

    var formData = new FormData();
    formData.append("headPic", $("#upfile")[0].files[0]);
             $.ajax({
                    url: "/web/headPic",
                    type: "post",
                    dataType: "json",
                    cache: false,
                    data:formData,
                    processData: false,
                    contentType: false,
                })
                .done(function(data) {    //上传成功
                    if(data.status == true){
                        console.log("success"); 
                    }else{
                        console.log(data.errMsg);
                    }
                })
                .fail(function() {
                    console.log("GG,failed");
                })
                .always(function() {
                    console.log("complete");
                });

在其中先封装了一个 formData 对象，然后使用 post 方法将文件传给服务器。

这里我们就要先说说在 http 中传输文件的问题。起初，http 协议中没有上传文件方面的功能，直到 rfc1867 为 http 协议添加了这个功能。当然在 rfc1867 中限定 form 的 method 必须为 POST ， enctype = “multipart/form-data” 以及.

当我们使用表单上传文件时，我们来查看他的Request headers：

发现在 multipart/form-data 后面有boundary以及一串字符，这是分界符，后面的一堆字符串是随机生成的，目的是防止上传文件中出现分界符导致服务器无法正确识别文件起始位置。说到这肯定就要说说这分界符有啥作用呢？

因为对于上传文件，我们没有在使用原有的 http 协议，所以 multipart/form-data 请求是基于 http 原有的请求方式 post 而来的.那么来说说这个全新的请求方式与 post 的区别

请求头的不同，对于上传文件的请求，contentType = multipart/form-data是必须的，而 post 则不是，毕竟 post 又不是只上传文件～。

请求体不同。这里的不同也就是指前者在发送的每个字段内容之间必须要使用分界符来隔开，比如文件的内容和文本的内容就需要分隔开，不然服务器就没有办法正常的解析文件，而后者 post 当然就没有分界符直接以 name = "value"的形似发送。

说到这，我们发现在 JQuery ajax() 方法中我们使contentType = false,这不是冲突了吗？这当然没有，因为当我们查看这时的 Request headers，会发现还是有分界符。这就是因为当我们在 form 标签中设置了enctype = “multipart/form-data”,这样请求中的 contentType 就会默认为 multipart/form-data 。而我们在 ajax 中 contentType 设置为 false 是为了避免 JQuery 对其操作，从而失去分界符，而使服务器不能正常解析文件。

说真的，起初我只是想查查为啥使用 ajax 上传文件时要将 contentType = false，结果莫名其妙了解到了 http 协议的一些知识～～有意思>_<

云服务器服务器托管 contentType false 返回false问题 php中的false

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/87980.html

ajax上传文件的请求

摘要：是发送的必须是类型注意把设为，让不要对做处理，如果不设置为，会把转换为字符串。查看文件上传的请求头里，参数为请求参数之间的界限标识。也就是说防止覆盖掉的。 1、data是FormData 发送的data必须是FormData类型 2、注意processData 把processData设为false，让jquery不要对formData做处理，如果processData不设置为fals...

Cobub 2019-08-21 18:25 评论0 收藏0
【每日一包0028】cache-content-type,mime-types

摘要：地址源码依赖响应头部工具包，基于包，对结果进行了缓存获取完成的头部获取类型的默认扩展名获取默认字符编码 [github地址：https://github.com/ABCDdouyae...] cache-content-type(koa2源码依赖) http响应头部工具包，基于mime-types包，对结果进行了缓存 const getType = require(cache-con...

chengjianhua 2019-08-23 14:02 评论0 收藏0
【每日一包0028】cache-content-type,mime-types

摘要：地址源码依赖响应头部工具包，基于包，对结果进行了缓存获取完成的头部获取类型的默认扩展名获取默认字符编码 [github地址：https://github.com/ABCDdouyae...] cache-content-type(koa2源码依赖) http响应头部工具包，基于mime-types包，对结果进行了缓存 const getType = require(cache-con...

klivitamJ 2019-08-02 12:13 评论0 收藏0
【每日一包0028】cache-content-type,mime-types

摘要：地址源码依赖响应头部工具包，基于包，对结果进行了缓存获取完成的头部获取类型的默认扩展名获取默认字符编码 [github地址：https://github.com/ABCDdouyae...] cache-content-type(koa2源码依赖) http响应头部工具包，基于mime-types包，对结果进行了缓存 const getType = require(cache-con...

MSchumi 2019-08-30 15:54 评论0 收藏0