注：本文档负责记录axios-https和基础知识以及必备知识扩展内容
1.Axios发送请求时params和data的区别
答： params是添加到url的请求字符串中的，用于get请求。
而data是添加到请求体（body）中的， 用于post请求。
HTTP请求过程中，
1.get请求：表单参数以name=value&name1=value1的形式附到url的后面；
2.post请求：表单参数是在请求体中，也是name=value&name1=value1的形式在请求体中。
POST表单请求提交时，使用的Content-Type是application/x-www-form-urlencoded，而使用原生AJAX的POST请求如果不指定请求头RequestHeader，默认使用的Content-Type是text/plain;charset=UTF-8。
在html中form的Content-type默认值：Content-type：application/x-www-form-urlencoded
如果使用ajax请求，在请求头中出现 request payload导致参数的方式改变了 ,那么解决办法就是：
headers: {'Content-Type':'application/x-www-form-urlencoded'}
或者使用ajax设置：
$.ajaxSetup({contentType: 'application/x-www-form-urlencoded'});
这样，问题就可以解决。
补充：post请求：data指的是数据；
qs.stringify()和 JSON.stringify() 是两种不同的方法，传不同的数据；
qs.stringify() 以&进行拼接
JSON.stringify() 以对象方式
2.qs.stringify和JSON.stringify的使用和区别
答：qs可通过npm install qs命令进行安装，是一个npm仓库所管理的包。而qs.stringify()将对象 序列化成URL的形式，以&进行拼接。JSON是正常类型的JSON，请对比一下输出
例如：
var a = {name:'hehe',age:10};
qs.stringify(a)
// 'name=hehe&age=10'
JSON.stringify(a)
// '{"name":"hehe","age":10}'
3.CORS跨域请求控制方法
cors概述：跨源资源共享标准通过新增一系列 HTTP 头，让服务器能声明那些来源可以通过浏览器访问该服务器上的各类资源（包括CSS、图片、JavaScript 脚本以及其它类资源）。另外，对那些会对服务器数据造成破坏性影响的 HTTP 请求方法（特别是 GET 以外的 HTTP 方法，或者搭配某些MIME类型的POST请求），标准强烈要求浏览器必须先以 OPTIONS 请求方式发送一个预请求(preflight request)，从而获知服务器端对跨源请求所支持 HTTP 方法。在确认服务器允许该跨源请求的情况下，以实际的 HTTP 请求方法发送那个真正的请求。服务器端也可以通知客户端，是不是需要随同请求一起发送信用信息（包括 Cookies 和 HTTP 认证相关数据）。
原理：例如：域名A(http://a.example)的某 Web 应用程序中通过<img>标签引入了域名B(http://b.foo)站点的某图片资源(http://b.foo/image.jpg)。这就是一个跨域请求，请求http报头包含Origin: http://a.example，如果返回的http报头包含响应头 Access-Control-Allow-Origin: http://a.example （或者Access-Control-Allow-Origin: http://a.example），表示域名B接受域名B下的请求，那么这个图片就运行被加载。否则表示拒绝接受请求。
1.http请求头
Origin: 普通的HTTP请求也会带有，在CORS中专门作为Origin信息供后端比对,表明来源域。
Access-Control-Request-Method: 接下来请求的方法，例如PUT, DELETE等等
Access-Control-Request-Headers: 自定义的头部，所有用setRequestHeader方法设置的头部都将会以逗号隔开的形式包含在这个头中
2.http响应头
然后浏览器再根据服务器的返回值判断是否发送非简单请求。简单请求前面讲过是直接发送，只是多加一个origin字段表明跨域请求的来源。然后服务器处理完请求之后，会再返回结果中加上如下控制字段
Access-Control-Allow-Origin: 允许跨域访问的域，可以是一个域的列表，也可以是通配符"*"。这里要注意Origin规则只对域名有效，并不会对子目录有效。即http://foo.example/subdir/ 是无效的。但是不同子域名需要分开设置，这里的规则可以参照同源策略
Access-Control-Allow-Credentials: 是否允许请求带有验证信息，XMLHttpRequest请求的withCredentials标志设置为true时，认证通过，浏览器才将数据给脚本程序。
Access-Control-Expose-Headers: 允许脚本访问的返回头，请求成功后，脚本可以在XMLHttpRequest中访问这些头的信息
Access-Control-Max-Age: 缓存此次请求的秒数。在这个时间范围内，所有同类型的请求都将不再发送预检请求而是直接使用此次返回的头作为判断依据，非常有用，大幅优化请求次数
Access-Control-Allow-Methods: 允许使用的请求方法，以逗号隔开
Access-Control-Allow-Headers: 允许自定义的头部，以逗号隔开，大小写不敏感
4.VUE添加axios插件
安装：cnpm install axios
在main.js中添加axios，此处注意axios插件不同于其他，引用不能使用Vue.use();而是使用Vue.prototype.axios = axios;
import axios from 'axios'
Vue.prototype.axios = axios;
new Vue({
axios
})
5.http和https协议有什么区别
http: 是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP），用于从WWW服务器传输超文本到本地浏览器的传输协议，它可以使浏览器更加高效，使网络传输减少
https: 是以安全为目标的HTTP通道，简单讲是 HTTP 的安全版，即 HTTP 下加入 SSL 层，HTTPS 的安全基础是 SSL ，因此加密的详细内容就需要 SSL
- http 是超文本传输协议，信息是明文传输，https 则是具有安全性的 ssl 加密传输协议
- http 和 https 使用的是完全不同的连接方式，用的端口也不一样，前者是 80 ，后者是 443
- http 的连接很简单，是无状态的；HTTPS 协议是由 SSL+HTTP 协议构建的可进行加密传输、身份认证的网络协议，比 http 协议安全
网友评论