我的项目是用vue2+uniapp开发的,遇到了跨域问题,上篇文章使用了浏览器端解决跨域问题,但是始终觉得不够完美,于是又百度了很多资料,终于解决了。亲测可用,直接上干货。
1.在根目录下新建vue.config.js文件
module.exports = {
"devServer": {
"port": 3264, //浏览器运行端口
"https": false,
"proxy": {
"/xboot": {
"target": "http://xx.xx.xxx.xxx:8082/xboot",//后台地址
"changeOrigin": true,
"secure": false,
"pathRewrite": {
"^/xboot": ""
}
}
}
}
}
2·在common 下新建request.js文件
import App from '../App.vue'
const request = (
url = '', date = {}, method = 'POST') => {
return new Promise((resolve, reject) => {
let header = {
'content-type': 'application/x-www-form-urlencoded'
}
const accessToken = uni.getStorageSync('accessToken')
let url1 = '/xboot' + url;
if (accessToken !== undefined && accessToken !== '') {
header.accessToken = accessToken
}
uni.request({
method: method,
// #ifdef H5
url: url1, //H5下
// #endif
// #ifndef H5
url: `${App.globalData.baseUrl}${url}`, //非H5下(即APP下)
// #endif
data: date,
header: header,
dataType: 'json',
}).then((response) => {
setTimeout(function() {
uni.hideLoading();
}, 200);
let [error, res] = response;
resolve(res.data);
}).catch(error => {
let [err, res] = error;
reject(err)
})
});
}
export default request
3·vue文件中使用
this.request('/login', data)
.then(res => {
if (res.success) {
uni.setStorageSync("accessToken", res.result);
this.request('/user/info', '', 'GET').then((res) => {
})
uni.switchTab({
url: '/pages/me/me'
});
} else {
}
})