跨域的解决 – devServer
devServer: {
proxy: {
'/api': {
//要访问的跨域的域名
target: 'http://10.160.36.126:8080',
ws: true,
secure: false, // 使用的是http协议则设置为false,https协议则设置为true
changOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
}
注意跨域问题的产生,是本地的服务器地址与后端给定的地址的CORS问题
axios的封装
import axios from 'axios'
var instance = axios.create({
baseURL: '/api',
timeout: 1000,
});
export const get = ({url, params}) => {
return instance({
url,
params
})
}
export const post = ({url,headers, params, data}) => {
return instance({
url,
headers,
method: 'post',
params,
data
})
}
// 添加请求拦截器
instance.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
instance.interceptors.response.use(function (response) {
// 对响应数据做点什么
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});
// 文件中调用的方式,可以使用async + await调用
- params中传参是放在地址栏上,get和post都可以
- query传参是get独有的,形式为?a=xx&c=xx
- data传参是post独有的,放在body体中传播
post方式的content-type要注意区分使用场景:
- application/json 通常, 好像是默认的
- www/url-encoded 键值对传参 通过& 连接 ,通常是表单
- formData 貌似是传文件的
目前只总结了get和post的常用操作,后续遇到再补充