vue项目里面使用脚手架实现跨域

时间：2019-12-17 20:45:45 阅读：151 评论：0 收藏：0 [点我收藏+]

今天在做vue项目的时候，项目在本地，接口数据在阿里云，这就造成了跨域，在网上找了好久，网上大部分的方法都是找到config文件夹下面的index进行修改的，可是我找到的Index却和他们描述的不一样。后来找到了一个比较适合小白实现的方法。

首先在vue项目的根目录下建一个vue.config.js文件，vue.config.js里面的代码是这样的：

module.exports = {

publicPath: ‘/‘,

devServer: {

proxy: {

‘/api‘: {

target: ‘http://121.41.9.242:8082‘, //这里是目标服务器地址

changeOrigin: true,

ws: true,

pathRewrite: {

‘^/api‘: ‘‘ " //这里一定要为空

}

"^/api":后面必须为空。这样vue.config.js就搞定了。

然后就是发送网络请求了，我看的大佬的那篇文章，其他都很好，就是网络请求哪里没说的很清楚，我写好vue.config.js后网络请求那里还搞了一个小时才弄好。

网络请求需要这样发：

let { data } = await this.$axios.post(

"/api/inside/user/findUserByUserId",

null,

{

params: {

userId: this.id

}

);

原本后端给我的接口是这个：http://121.41.9.242:8082/inside/user/findUserByUserId

现在我发网络请求的接口是这样：/api/inside/user/findUserByUserId，用/api代替前面的目标服务器地址，这样就行了。

原文：https://www.cnblogs.com/lihai132/p/12056650.html

踩

(0)

评论一句话评论（0）

分享档案

更多>