前后端分离跨域问题的解决

1.开发环境

打开config/index.js,在proxyTable中添写如下代码：

proxyTable: { 
  '/api': {  //使用"/api"来代替"http://f.apiplus.c" 
    target: 'http://f.apiplus.cn', //源地址 
    changeOrigin: true, //改变源 
    pathRewrite: { 
      '^/api': 'http://f.apiplus.cn' //路径重写 
      } 
  } 
}

2.生产环境

使用nginx部署前端

vue  build 后dist文件夹下有静态资源

配置nginx后运行

   server {
        listen       80;   //监听的端口
        server_name  localhost;//地址

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

          location / {
            root   D:\vcp\vue-client0525\dist;//dist的路径
            try_files $uri $uri/ /index.html;
			error_page 405 =200 /index.shtml;//405转200
        }
		location /api {//配置反向代理，请求调用含有/api时跳转到后场的服务地址
            proxy_pass   http://192.168.101.111:8081/api;//跳转的地址
        }
    }

后台tomcat正常部署就可以了