nginx部署代理跨域

关于 nginx, 咱们先了解 nginx 在开发过程中的主要作用

• nginx 解决跨域
• nginx 负载均衡

一、nginx 解决跨域

如果要理解什么是跨域

广义上的跨域是指一个域下的文档或脚本试图去请求另一个域下的资源。即浏览器的同源策略 /SOP 限制引起的跨域也属于在内；

• 那么什么是同源策略呢？

同源策略 /SOP（Same origin policy）是一种约定，由 Netscape 公司 1995 年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到 XSS、CSFR 等攻击。同源策略即: 协议 + 域名 + 端口 ” 三者相同

• 常见的跨域场景如下：

         URL                                      说明                         是否允许通信

    http://www.baidu.com/hello.js
    http://www.baidu.com/world.js         同一域名，不同文件或路径           允许（无跨域）http://www.baidu.com/hello/world.js


    http://www.baidu.com:8000/hello.js
    http://www.baidu.com/hello.js         同一域名，不同端口                不允许（有跨域）http://www.baidu.com/hello.js
    https://www.baidu.com/world.js        同一域名，不同协议                不允许（有跨域）http://www.baidu.com/hello.js
    http://192.168.22.128/world.js        域名和域名对应 ip                 不允许（有跨域）http://baidu.com/hello.js
    http://x.baidu.com/hello.js           主域相同，子域不同                不允许（有跨域）http://www.baidu.com/hello.js

    http://www.baidu.com/hello.js
    http://www.bai.com/world.js           不同域名                        不允许（有跨域）

常见的跨域解决方案有如下:

1. jsonp 解决跨域
2. document.domain + iframe 解决跨域
3.  nginx 代理解决跨域
4.  nodejs 中间件代理解决跨域

重点来了 nginx 代理解决跨域；

server {
          listen       80;
          server_name  localhost; // 前端域名 具体原理解释在下方

          location / {  // location / 代理所有请求 而如果是 location /api 则匹配到有 /api 前缀的请求才会代理
                  proxy_pass www.baidu.com; // 服务端域名
          }
  }

1. 前端 server 域名是 localhost
2. 服务器 server 域名是 www.baidu.com

根据浏览器的 SOP/ 同源策略 localhost 对 www.baidu.com 发起请求一定会出现跨域问题；但现在只要我们启动 nginx 服务器把 server_name 设置成前端的域名，

 此时前端发起的请求相当于是 localhost 对 localhost 发起，这样是不会引起跨域的；但真实情况是，nginx 对 localhost 的请求代理回 www.baidu.com

---

这里赘述一下什么是代理；

代理是在服务器和客户端之间假设的一层服务器（中间服务器），代理将接收客户端的请求并将它转发给服务器，然后将服务端的响应转发给客户端。

 代理分为正向代理和反向代理: 具体区别自行百度...

二、nginx 负载均衡

---

nginx 是通过把请求分发到服务器列表来实现负载均衡的；具体实现如下:

          upstream balance.com{
                         server 192.168.2.100:42000;
                         server 192.168.2.101:42000;
                         server 192.168.2.102:42000;
            }



            server {
                    server_name  fe.server.com;
                    listen 80;
                    location /api {proxy_pass http://balance.com;}
            }

上面的配置只是指定了 nginx 需要转发的服务端列表，并没有指定分配策略。

nginx 负载均衡策略

1. 轮询策略

   轮询策略是默认的策略，把每个请求按顺序逐一分配到不同的 server，如果 server 挂掉，能自动剔除

    upstream balance.com{
            server 192.168.2.100:42000;
            server 192.168.2.101:42000;
            server 192.168.2.102:42000;
        }

1. 最少连接数策略

把请求优先分配给连接数最少的 server, 可以平衡每个队列的长度;

    upstream balance.com{
            least_conn;
            server 192.168.2.100:42000;
            server 192.168.2.101:42000;
            server 192.168.2.102:42000;
        }

1. 最快响应时间策略

优先分配给响应时间最短的服务器。

  upstream balance.com {
     fair;
    server 192.168.2.100:42000;
    server 192.168.2.101:42000;
    server 192.168.2.102:42000;
 }

1. 权重策略

使用 weight 来指定 server 访问比率，weight 默认是 1。访问率比例等于权重比例；

    upstream balance.com{
             server 192.168.2.100:42000 weight=1;
             server 192.168.2.101:42000 weight=2;
             server 192.168.2.102:42000 weight=3;
        }

1. 客户端 ip 绑定 ip_hash

   每个请求会按照访问 ip 的 hash 值分配，这样同一客户端连续的 Web 请求都会被分发到同一 server 进行处理，可以解决 session 的问题。如果 server 挂掉，能自动剔除。

    upstream balance.com{
        ip_hash;
        server 192.168.2.100:42000 weight=1;
        server 192.168.2.101:42000 weight=2;
        server 192.168.2.102:42000 weight=3;
    }

1. backup 标记为备份服务器。当主服务器不可用时，将传递与备份服务器的连接。

    upstream balance.com{
        server 192.168.2.100:42000 backup;
        server 192.168.2.101:42000;
    }

本文介绍的是基础功能，如果想了解更多请转 nginx 文档

以上是博主目前了解和使用到的一些技巧和知识啦，至于关于 nginx 部署后 404 问题请看 @安静 Eno| vue 框架下部署上线后刷新报 404 问题解决方案

尊重原著 文章转自 @安静 Enonginx 部署 / 代理 / 跨域