vue 关于axios的使用方法

axios定义：
axios 前端 ajax请求工具
        1. 在浏览器与nodejs可以使用
        2. 可以拦截请求与相应
        3. 扩展与封装自定义方法
        4. 不依赖dom节点
安装
 npm i axios  -S
先在vue全局中挂载
import  axios from ‘axios’
 
Vue.prototype.$http = axios;
使用axios进行 get请求
 
axios.get(url)
axios.get(url?name=zh&age=18)
axios.get(url,{params:{name:"zh",age:18}})
axios({
url,
params:{},
method:"GET"
})
使用axios进行post请求
axios.post(
url,
data, //name=mumu&age=18
{headers:{"content-type":"application/x-www-form-urlencoded"}})
 
 
axios.post(
url,
data,//`{"name":"mumu","age":18}`,
{headers:{"Content-Type": "application/json; charset=UTF-8"}},
)
 
axios({
url,
method:"POST",
data:`name=mumu&age=18`,
headers:{"content-type":"application/x-www-form-urlencoded"}}
})
axios的默认配置
post请求头的默认配置：
axios.defaults.headers.post["Content-Type"] = "请求头"
默认请求域名配置：
axios.defaults.baseURl="/"

请求超时配置：
 
axios.defaults.timeout = 3000

响应拦截
拦截
请求拦截
 

axios.interceptors.request.use(
function(config){return config},
function(err){Promise.reject(err)})
axios.interceptors.response.use(
function(res){return res},
function(err){Promise.reject(err)})
 注意：

     vue.config.js        放在项目的根目录        不是src目录
     对vue脚手架进行配置
     devServer 对内置脚手架服务器配置
     我们主要用来代理

module.exports ={
   devServer:{
    open:true,//打开浏览器
    proxy:{
        "/abcd":{  //当请求地址包含/abcd 开始执行代理
                  target:"url",
                // 允许改变
                changeOrigin:true,
                onProxyReq(proxyReq, req, res) {
                    proxyReq.setHeader('Referer', 'url'); 
                },
                pathRewrite:{
                    "/abcd":"/api/rms/v1"
                }
        }
    }
   }
} 
axios封装

 axios01 页面导入:
import axios from ‘axios’
import qs from ‘qs’
import jsonp from ‘jsonp’

 axios02 创建实例:
var request = axios.create({
// 默认配置
})
axios03 拦截 请求与响应（做加载提示）:
request.interceptors.request.use()
request.interceptors.response.use()
axios04 扩展方法：
request.jsonp = function(){}
axios05 导出：
export default request;
关于qs一些方法：
 
qs.stringify({}) 把对象转换为url编码字符串
{name:"fs",age=18}  name=fs&age=18
 
qs.parse(str)把url编码转换对象
name=fs&age=18  {name:"fs",age=18}  
了解转义：

 window.encodeURI("name=王")
 window.decodeURI("name=%E6%9B%BE")
 window.encodeURIComponent("name=/user") //转
encodeURI 和 decodeURI 函数操作的是完整的 URI；这俩函数假定 URI 中的任何保留字符都有特殊意义，所有不会编码它们。

encodeURIComponent 和 decodeURIComponent 函数操作的是组成 URI 的个别组件；这俩函数假定任何保留字符都代表普通文本，所以必须编码它们，所以它们（保留字符）出现在一个完整 URI 的组件里面时不会被解释成保留字符了。