<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue交互-axios用法</title>
</head>
<body>
<div id="app">
<!-- 官网:https://github.com/axios/axios -->
<!--
特征:
支持:浏览器端
支持:promise
能拦截请求和响应
自动转换JSON数据 -->
</div>
</body>
<script type="text/javascript" src="js/vue.js"></script>
<script type="text/jscript" src="axios/axios.js"></script>
<script type="text/javascript">
/*4种方式
axios.get:获取
axios.post:提交
axios.delete:删除（接口传参方式和get一样）
axios.put:修改（接口传参方式和post一样）
响应结果：
data:实际响应回来的数据
headers:响应头信息
status:响应状态码
statusText:响应状态信息
axios全局配置
axios.defaults.timeout=3000;//超时时间
axios.defaults.baseURL=''默认地址
axios.defaults.headers['token']=''0230654s6df1sdf54s6f//设置请求头
*/
//配置请求的基础URL地址
axios.defaults.baseURL='http://text.token4.com/api/'
//axios.defaults.headers['token']='0230654s6df1sdf54s6f'
//拦截器
//请求拦截器
axios.interceptors.request.use(function(config){
console.log(config);
config.headers.mytoken='tokensdf3sd54f6s1df'
//console.Content-Type='application/x-www-form-urlencoded;charset=utf-8'
return config;
},function(err){
console.log(err)
})
//响应拦截器
axios.interceptors.response.use(function(config){
console.log(config);
return config;
},function(err){
console.log(err)
})
/*URL传参方式*/
/* axios.get('Token/GetToken?cust_id=10000').then(function(data){
console.log(data)
}) */
/*对象传参*/
/* axios.get('Token/GetToken',{params:{cust_id:10000}}).then(function(data){
console.log(data)
}) */
/*post传递参数方法1*/
/*这里传过去是一个json字符串.需要在后台进行解析。进行接收json数据格式*/
var data={cust_id:10000};
axios.post(
'Token/GetToken'
,JSON.stringify(params)).then(function(data){
console.log(data)
})
/*post传递参数方法2*/
var params=new URLSearchParams();
params.append('cust_id','10000');
axios.post(
'Token/GetToken',
params)
.then(function(data){
console.log(data)
})
</script>
</html>
