方法一:
配置vue.config.js文件
vue.config.js
是一个可选的配置文件,如果项目的 (和 package.json
同级的) 根目录中存在这个文件,那么它会被 @vue/cli-service
自动加载。也可以使用 package.json
中的 vue
字段,但是注意这种写法需要你严格遵照 JSON 的格式来写
在项目下配置vue.config.js文件
在vue.config.js文件里输入
module.exports = {devServer: {proxy: {"/api": { //自定义target: "http://你的服务器地址/api", //这里可以跟随项目实际部署服务器来changeOrigin: true,ws: true,pathRewrite: {"^/api": ""//自定义}}}}
}
方式二:
使用JSONP跨域
jsonp原理就是利用<script>标签没有跨域限制,通过<script>标签的src属性,发送带有callback参数,服务端将接口返回数据拼凑到callback函数中,返回给浏览器,浏览器解析执行,从而前端拿到callback函数返回的数据。
<script>var script = document.createElement('script');script.type = 'text/javascript';// 传参一个回调函数名给后端,方便后端返回时执行这个在前端定义的回调函数script.src = 'http://www.domain2.com:8080/login?user=admin&callback=handleCallback';document.head.appendChild(script);// 回调执行函数function handleCallback(res) {alert(JSON.stringify(res));}</script>