美文网首页
这不是我认识的$.ajax

这不是我认识的$.ajax

作者: 忆丘 | 来源:发表于2019-08-17 17:01 被阅读0次
    基础参数说明
    1.async:是否异步执行AJAX请求,默认为true,千万不要指定为false;
    2.method:发送的Method,缺省为'GET',可指定为'POST'、'PUT'等;
    3.contentType:发送POST请求的格式,默认值为'application/x-www-form-urlencoded; charset=UTF-8',也可以指定为text/plain、application/json;
    4.data:发送的数据,可以是字符串、数组或object。如果是GET请求,data将被转换成query附加到URL上,如果是POST请求,根据contentType把data序列化成合适的格式;
    5.headers:发送的额外的HTTP头,必须是一个object;
    6.dataType:接收的数据格式,可以指定为'html'、'xml'、'json'、'text'、'jsonp'等,缺省情况下根据响应的Content-Type猜测。
    7.processData:要求为Boolean类型的参数,默认为true。默认情况下,发送的数据将被进行序列表处理,转换为对象(从技术角度来讲并非字符串)以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM树信息,文件或者其他不希望转换的信息,请设置为false。
    
    坑1:JSONP格式不支持跨域同步
    • 一般情况下async设置成true则是异步请求,false则是同步请求,且不无论跨域与否。
    • 但是有时你会碰到无论怎么设置async都无法实现同步请求,这时你得发现dataType的值是jsonp;因为ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提供的js脚本。jsonp的实现不是ajax,而是script节点,所以对ajax有效的配置未必对jsonp有效。
    坑2:contentType影响后端接受传值
    • 表单提交form的enctype属性值:application/x-www-form-urlencoded,multipart/form-data,text/plain
    • PHP接受传值方法有$_POST,$_GET,$HTTP_RAW_POST_DATA,file_get_contents("php://input");
    • contentType为application/x-www-data-urlencoded和multipart/form-data两种情况下,PHP会将请求数据传递给$_POST 。
    • PHP不能识别的contentType类型的时候,会将http请求包中相应的数据填入变量$HTTP_RAW_POST_DATA。
    • 只要form的enctype不为multipart/form-dat和contentType不为false的时候($.ajax的contentType为multipart/form-data时php://input可以接受到参数),PHP将不会把http请求body体数据填入php://input,否则其它情况都会。填入的长度,由Content-Length指定。
    • 只有contentType为application/x-www-data-urlencoded时,php://input数据才跟$_POST数据相一致。
    • php://input与$HTTP_RAW_POST_DATA相同,但是php://input比$HTTP_RAW_POST_DATA,更效率,并不需要配置php.ini
    • http请求的,GET形式下,body体为空。
    坑3:ajax传文件
    • 如果直接将contentType设置成multipart/form-data,会报错Uncaught TypeError: Illegal invocation
    var formData = new FormData();
    file = $('#my-file').val();
    formData.append('file-name', file);
    formData.append('title', 'title');
    contentType: false,
    $.ajax({
        url:'upload',
        type:'post',
        data:formData, //告诉jQuery不要去设置Content-Type请求头
        processData: false,//告诉jQuery不要去处理发送的数据
    })
    

    相关文章

      网友评论

          本文标题:这不是我认识的$.ajax

          本文链接:https://www.haomeiwen.com/subject/zdcvjctx.html