关于jquery.ajax 与axios 请求接口的request header ：Content-type设置问题

请求接口，传递参数发送请求时候，后端会指定传递的参数类型（即request header的content-type）
如果了解jquery.ajax 与axios，可以省略指定,让浏览器根据传递参数类型与添加。
例如登陆接口，要求前端请求的request Content-Type类型 "Content-Type": "application/x-www-form-urlencoded"，
如果header中传递数据如下，就不用手动设置Content-Type：
  data: paramsData,
    transformRequest: [function(data) {
        data = Qs.stringify(data); // Qs使用情况在文后
        return data;
    }],

规则如下：
1 jQuery.ajax的post提交默认的请求头的Content-Type: application/x-www-form-urlencoded
2 axios,在data是内置对象的时候会进行一些自动设置，
(1) 当 data 是 FormData 时，即便设置content-type 的值，也会被强制删除，让浏览器自己设置为multipart/form-data。
(2) 当 data 为 URLSearchParams 对象时设置为 application/x-www-form-urlencoded;charset=utf-8,
(3) 当 data 为普通对象(包含数组)时，会被设置为 application/json;charset=utf-8

/* qs 使用说明
  qs是一个npm仓库所管理的包
1. qs.parse()将URL解析成对象的形式。
  const qs= require('qs');
    let url = "admin=jack&appToken=abcdefg";
    qs.parse(url);
    console.log(qs.parse(url));
会生成{admin：’jack‘，appToken:'abcdefg'}
2 qs.stringify()将对象序列化成URL的形式，以&进行拼接
如上，qs.stringify({admin：’jack‘，appToken:'abcdefg'}),变为  "admin=jack&appToken=abcdefg"

如果改变的是数组，默认情况下，它们给出明确的索引，如下代码
qs.stringify({ a: ['b', 'c', 'd'] }); // 'a[0]=b&a[1]=c&a[2]=d'
也可以进行重写这种默认方式为false
qs.stringify({ a: ['b', 'c', 'd'] }, { indices: false }); // 'a=b&a=c&a=d'

    当然，也可以通过arrayFormat 选项进行格式化输出，如下代码所示：
    qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' }) // 'a[0]=b&a[1]=c'
    qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' }) // 'a[]=b&a[]=c'
    qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' }) // 'a=b&a=c'

在这里需要注意的是，JSON中同样存在stringify方法，但是两者之间的区别是很明显的，如下所示：
{"uid":"yh9999","pwd":"sh9999"} // JSON.stringify(param)
uid=yh9999&pwd=sh9999 //Qs.stringify(param)
如上所示，前者是采用JSON.stringify(param)进行处理，后者是采用Qs.stringify(param)进行处理的

关于form数据提交的文章https://www.cnblogs.com/bester-ace/articles/9234229.html

最后编辑于：2019.06.19 13:45:21