前端打包之后跨域，用Nginx代理

一、什么是跨域?
首先跨域出于浏览器的同源策略的限制，浏览器本身会限制跨域请求（严格来说，只是限制跨域的读操作）。那什么是跨域呢?在不同的协议、域名、端口中进行请求，就是跨域。

二、如何解决跨域?

一般多用于本地自测或者前后端开发部署均为分离的情况
1、webpack的proxyTable方案
在一般项目中都会有webpack对应的开发环境的配置文件：webpack.dev.js，在配置项中加入ProxyTable的配置项即可：

proxy: {
          '/api': {
          changeOrigin: true,
          target: 'http://******.*****.com',
    }
}

如果前后端前缀不匹配或者后端前缀不统一的情况，可以增加pathRewrite属性来统一：

proxy: {
            '/EntryApp': {
              changeOrigin: true,
              target: 'http://******.*******.com',
              pathRewrite: {"^/EntryApp": "/EntryApp"}
        },
    }

proxyTable实现跨域可能存在的问题：
1.cookie丢失,接口无法访问
2.post请求报403错

三、vue打包之后用Nginx代理
Nginx是一个免费的，开源的高性能的HTTP和反向代理服务器。
通常，线上前后端分开部署时，用nginx比较多。
nginx.conf是主配置文件，有若干个部分组成，每一部分都用{}区分。主要包括:
main：nginx的全局配置，对全局生效
events：影响nginx服务器或与用户的网络连接
http：可以嵌套多个server,配置代理，缓存，日志等
server：配置虚拟主机的相关参数，一个http可以有多个server

nginx解决跨域的基本方法是在sever中配置proxy_pass:

// 前端服务的域名为 fe.**.com
// 后端服务的域名为 dev.**.com

server {
    listen: 80,
    server_name: fe.**.com,
    location / {
         proxy_pass dev.**.com
    }
}

根据工作需求，还可以添加一些其他的指令，比如：
proxy_connect_timeout：nginx从接受请求至连接到上游服务器的最长等待时间
proxy_cookie_domain：替代上游服务器的set_cookie头的domain属性
proxy_cookie_path：替代上游服务器的set_cookie头的path
proxy_set_header：重写发送到上游服务器头的内容，也可以通过将某个头部的值设置为空字符串，而不发送某个头部的方式发放实现
以上是跨域的全部内容