【前端跨域】

前端跨域

1. jsonp 需要后端和前端配合

2. cors 后端配置

3. 开发阶段：如果是vue脚手架创建的项目，可以通过 devServer 属性做代理配置

4. 项目上线：nignx 做跨越代理

devServe要写在config.js里面

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://121.41.9.242:8082',  //这里是目标服务器地址（后端的）只到域名
        changeOrigin: true,
        pathRewrite: {
          '^/api': '' "       //这里一定要为空
        }
      }
    }
  }
}
​
axios.get('/api/list')
​
​
// 实际上 target: 'http://121.41.9.242:8082/api/list',配置了pathRewrite就没有api了变成空的啦，
// http://121.41.9.242:8082/list

如果后端有多个接口都是带api 的

http://121.41.9.242:8082/api/list
http://121.41.9.242:8082/api/user
http://121.41.9.242:8082/api/name

那么这样配置

​
    proxy: {
      '/api': {
      target: 'http://121.41.9.242:8082/api',  //这里是目标服务器地址（后端的）
        changeOrigin: true,
        pathRewrite: {
          '^/api': '' "       //这里一定要为空
        }
          
          
   axios.get('/api/list')