前端解决跨域问题

1 开发阶段配置

在 vue.config.js 文件中，加入如下代码：

devServer:{
    open:true,
    proxy: {
        '/4000': {
                    target: 'http://api.waimai.fuming.site:4000',
                    changeOrigin: true,
                    pathRewrite: {
                        '^/4000': ''
                    }
            }
        }
},

2 部署到 nginx 之后通过反向代理解决跨域问题

打开 nginx 配置文件，在 server 的花括号内添加如下一行：

location /4000 {
     proxy_pass http://api.waimai.fuming.site:4000/;
}

3 后端解决跨域 （了解）

后端也可以通过 CORS 方案结局跨域问题，原理是设置响应头里的Cross-origin resource sharing 字段