资讯专栏INFORMATION COLUMN

nginx部署/代理/跨域

int64 / 3304人阅读

摘要:关于咱们先了解在开发过程中的主要作用解决跨域负载均衡一解决跨域如果要理解什么是跨域广义上的跨域是指一个域下的文档或脚本试图去请求另一个域下的资源。标记为备份服务器。当主服务器不可用时,将传递与备份服务器的连接。

关于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; // 服务端域名
          }
  }

前端server域名是localhost

服务器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;
        }

2.最少连接数策略

把请求优先分配给连接数最少的server,可以平衡每个队列的长度;
    upstream balance.com{
            least_conn;
            server 192.168.2.100:42000;
            server 192.168.2.101:42000;
            server 192.168.2.102:42000;
        }

3.最快响应时间策略

优先分配给响应时间最短的服务器。
  upstream balance.com {
     fair;
    server 192.168.2.100:42000;
    server 192.168.2.101:42000;
    server 192.168.2.102:42000;
 }

4.权重策略

使用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;
        }

5.客户端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;
    }

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

    upstream balance.com{
        server 192.168.2.100:42000 backup;
        server 192.168.2.101:42000;
    }
本文介绍的是基础功能,如果想了解更多请转nginx文档

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

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

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/40446.html

相关文章

  • 通过nginx反向代理解决前端访问的跨域问题

    摘要:三反向代理解决的原理将安装在本地,然后将项目部署于下,这样访问本地项目时用本地项目即可访问。这样浏览器之间的请求完全满足浏览器域名协议端口相同的同源策略,可在不改变后台接口的情况下避免跨域问题。 一、问题背景说明: 编写移动前端页面时需要访问后台系统接口。前端项目在本地(个人办公电脑)开发,后台接口存放后生产的后台服务器,本地的ajax请求无法直接访问后台接口,也就是遇到了跨域问题...

    dongxiawu 评论0 收藏0
  • 通过nginx反向代理解决前端访问的跨域问题

    摘要:三反向代理解决的原理将安装在本地,然后将项目部署于下,这样访问本地项目时用本地项目即可访问。这样浏览器之间的请求完全满足浏览器域名协议端口相同的同源策略,可在不改变后台接口的情况下避免跨域问题。 一、问题背景说明: 编写移动前端页面时需要访问后台系统接口。前端项目在本地(个人办公电脑)开发,后台接口存放后生产的后台服务器,本地的ajax请求无法直接访问后台接口,也就是遇到了跨域问题...

    paulquei 评论0 收藏0
  • Angular4开发解决跨域问题

    摘要:只需要修改的配置即可解决跨域问题,支持所有浏览器,支持,不需要修改任何代码,并且不会影响服务器性能。正常情况下部署,就会有跨域问题,浏览器拒绝执行如下这样的调用。甚至,通过的反向代理,我们还能调用其他公司开发的网站提供的接口。 1.跨域 浏览器对于javascript的同源策略的限制,例如a.cn下面的js不能调用b.cn中的js,对象或数据(因为a.cn和b.cn是不同域),所以跨域...

    xorpay 评论0 收藏0
  • Nginx

    摘要:此外,其也能够提供强大的反向代理功能。是由为俄罗斯访问量第二的站点开发的,第一个公开版本发布于年月日。 keepalived+nginx 实现高可用双机热备 + 负载均衡架构 1 准备4个ubuntu16.04虚拟机(启用网卡二并使用桥接模式):A服务器:192.168.0.103 主B服务器:192.168.0.104 主(备) 前端工程师学习 Nginx ...

    syoya 评论0 收藏0
  • Nginx

    摘要:此外,其也能够提供强大的反向代理功能。是由为俄罗斯访问量第二的站点开发的,第一个公开版本发布于年月日。 keepalived+nginx 实现高可用双机热备 + 负载均衡架构 1 准备4个ubuntu16.04虚拟机(启用网卡二并使用桥接模式):A服务器:192.168.0.103 主B服务器:192.168.0.104 主(备) 前端工程师学习 Nginx ...

    Imfan 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<