vue-cli3.0环境下使用proxyTable解决跨域问题

现在项目一般都进行前后端分离了。前后端服务器都不在一起,开发环境下,当协议、子域名、主域名、端口号中任意一个不相同时,算不同域,这个时候会出现跨域问题。

1.在config下index.js中proxyTable加上:

proxyTable: {

      '/api': {                                // 要代理的接口名

        target: 'http://39.108.102.200/',  // 要代理的后台接口地址

        changeOrigin: true,                            // 允许跨域

        pathRewrite: {'^/api': ''}            // 接口名重写

      }

 }

2.去main.js中配置

import axios from 'axios'

Vue.prototype.HOST = '/api'

Vue.config.productionTip = false

3.功能页面请求接口

axios({

           method: 'get',

            url: this.HOST + `接口`,

           }).then((res) => {

                console.log(res)

})

注意:这是在开发环境下的配置,生成环境下可以会Nginx反向代理

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容