4

Vue跨域问题

 3 years ago
source link: https://tcpgnl.com/vue_cross_origin.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

Vue跨域问题

2020年6月20日 631点热度 2人点赞 0条评论

使用vue做前后端开发时,难免会遇到跨域的问题。本文记录跨域的解决方案

在Vue工程的目录中找到config文件夹下的index.js 查找其中的dev:
原始dev如下:

dev:{
    env: require('./dev.env'),
    port:8080,
    autoOpenBrowser:true,
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},
    cssSourceMap: false
}
JavaScript

在其中仅需要对proxyTable:{} 修改为如下的配置参数既可以实现跨域。

proxyTable: {
    '/api': {
        target: 'https:tcpgnl.com',
        changeOrigin: true,
        secure: false,
        pathRewrite: {
            '^/api': 'api' //此为路径的替换规则,此处为正则表达式,所有以/api开头的都会被'/api'替换掉 比如后台的文档接口为/api/list/xxx 前端api接口可以写成: axios.get('/api/list//xxx'),实际访问的是 :https://tcpgnl.com/api/list/xxx
        },
    }
}
JavaScript
本作品采用 知识共享署名 4.0 国际许可协议 进行许可

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK