使用npm install axios --save安装axios
例如请求地址为:http://127.0.0.1:5000/student GET请求 无入参
一、未封装
配置代理
devServer:{
host:'localhost',
port:'8080',
proxy:"http://127.0.0.1:5000"
}
//或者
devServer:{
host:'localhost',
port:'8080',
// proxy:"http://127.0.0.1:5000"
proxy:{
"/api":{
target:'http://127.0.0.1:5000',
ws:true,
changeOrigin:true,
pathRewrite:{
'^/api':''
}
},
"/api1":{
target:'http://127.0.0.1:5000',
ws:true,
changeOrigin:true,
pathRewrite:{
'^/api1':''
}
}
}
在需要发送请求的页面引入axios
import axios from 'axios'
methed:{
reqClick(){
axios.get('http://localhost:8080/api/student').then(res=>{
console.log(res);
},err=>{
console.log(err);
})
console.log(result);
}
}
二、封装
新建文件夹
request.js
import axios from 'axios'
const request=axios.create({
baseURL:'/api',
timeout:5000
})
request.interceptors.request.use(config=>{
config.headers['Content-Type']='application/json;charset=utf-8'
return config;
})
request.interceptors.response.use(res=>{
return res.data
},err=>{
Promise.reject(err)
})
export default request;
index.js
import request from './request'
export const reqGetStudent=()=>request({url:'/student',method:'GET'})
使用
async reqClick(){
let result=await reqGetStudent()
console.log(result);
}