调用跨域接口,设置了代理鸭!做了好几天,真的是删了改,改了删试过千百遍之后终于成功!!!!!现在来记录一下趴!!!!
第一步还是要在根目录下面创建一个vue.config.js文件(话说这个文件这么有用干嘛取消掉鸭--来自萌新小白的吐槽)
还是这张图哈哈哈哈
第二步设置代理域名
devServer: {
//自己的端口号鸭
port: 8080,
//是否打开代理
open: true,
proxy:{
// /api自己定义的名字鸭
'/api': {
//设置你调用的接口域名和端口号 别忘了加http
target: 'http://192.168.1.123:8888/',
//允许跨域
changeOrigin: true,
pathRewrite: {
'^/api': '' //这个是定义要访问的路径,名字随便写
}
}
}
}
就这样哈
第三步使用这个代理鸭
我这里是用了一个拦截器哦,也可以写在main.js里面哦
import axios from 'axios';
axios.defaults.baseURL = '/api';
引入axios
然后就可以使用啦
最最最最后要说明一点就是设置之后一定要npm run serve
不然没有效果哦
这适用于开发模式,不适用打包哦,打包的话程序不回景区这里