前言

ajax也分很多种,本人用的最多的是jQuery的Ajax,这篇文章就大概说一下相关的知识点。

首先下面是常用的ajax使用方式,其中的参数也是经常用到的:

$.ajax({
    type:"post/get",
    url:"url",
    async:true/fasle,
    dataType:"json",
    processData:"true",
    contentType:"application/x-www-form-urlencoded",
    data:{
        value_name:value
    },
    success:function (data,status,ajaxclass) {
        //处理返回的数据
    },
    error:function () {
        //ajax失败时执行的方法
    }
})

参数说明

  1. type

    传值类型,分为POST和GET两种,不区分大小写,默认为GET。

    实际上put、delete等传值方式也能使用,但仅部分浏览器支持。

  2. url

    发送请求的地址

  3. async

    是否异步,不写该属性时默认true。(异步是多线程,同步是单线程)

    设置为true时,所有请求为异步。设置为false时,所有请求未同步。

    注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

  4. data

    发送到请求地址的数据,将自动转换为请求字符串格式。

    单个值可直接写。例如name,接口可以接受到name这个值。

    多个值用json格式。{参数名:值,参数名:值,……}的形式,或者直接写变量名{变量1,变量2,变量3,……}。

  5. success

    当请求运行成功时的回调函数,并返回根据 dataType 参数进行处理后的数据。

    参数一:data(这里参数名称任意)即为返回的值

    参数二:status(这里参数名称任意)返回ajax的执行状态,这里返回success

    参数三:ajaxclass(这里参数名称任意)返回当前ajax对象的一些数据。

  6. error

    当请求运行失败时的回调函数,一般用作请求地址响应失败时给予用户报错提示。

  7. dataType

    请求返回后要处理成的数据类型。常用值:

    • "xml": 返回 XML 文档,可用 jQuery 处理。

    • "html": 返回纯文本 HTML 信息;包含的 script 标签会在插入 dom 时执行。

    • "script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意:在远程请求时(不在同一个域下),所有 POST 请求都将转为 GET 请求。(因为将使用 DOM 的 script标签来加载)

    • "json": 返回 JSON 数据 。

    • "jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

    • "text": 返回纯文本字符串

  8. processData

    参数值为true或false,默认为true

    一般情况下,通过data选项传递进来的数据,如果是一个对象(技术上讲只要不是一个字符串),都会处理转化成一个查询字符串,以配合默认内容类型“application/x-www-form-urlencoded”。

    如果发送DOM树信息或其他不希望转换的信息,则需要设置为false。

    此属性在使用FormData进行data传值时属性值必须为false

  9. contentType

    默认值“application/x-www-form-urlencoded”,是发送信息至请求地址时内容编码类型。

    此属性在使用FormData进行data传值时属性值必须为false。

  10. end,waiting for update……

其他说明

contentType在传输文件时为什么设为false?

相关知识扩充:

①如果不加此参数,会出现不可预知的错误!

比如某些加了安全控件的系统,不加此参数,会直接报错403,服务器认为你的此次请求是在攻击系统。

②当ajax上传文件时,我们查看Request headers:

451399555-58061f68010e8_articlex.png

这时会发现content-Type这个的参数是multipart/form-data后面还会有boundary再接着一串随机字符串。

前面的参数我们并不陌生,这是form表单上传文件必须的参数,而后面的参数是当我们上传文件时,系统会自动生成一堆随机字符串,也叫分界符,目的是为了防止文件中出现分隔符导,最终致请求地址的服务器无法正确解析文件的起始位置。

换言之就是,文件传输中本质还是文件流传输(其实也就是字符代码的传输),这样就需要与其他非文件参数进行区分,而boundary生成的这个复杂随机字符串就是为了将文件流与其他参数区分开来,而将contentType设为false是为了防止jQuery对数据进行二次编码,从而失去分界符,最终导致请求地址的服务器无法正常解析文件。

processData在传输文件时为什么设为false?

按默认值也就是true,会将上传的数据转换为字符上传,而当上传文件的时候,则不需要把其转换为字符串,因此就要关闭此转换功能,也就是设置为false。