• 1. Nginx的安装与启动
  • 1.1 为什么需要Nginx？
  • 1.2 Ngxin是什么？
  • 1.3 Nginx在Linux下的安装
  • 1.4 Nginx在Windows下的安装
    • 1.4.1 安装
    • 1.4.2 使用
• 2. Nginx静态网站部署与调试
  • 2.1 静态网站的部署-部署阶段
  • 2.2 静态网站动态调试
• 3. Nginx配置虚拟主机
  • 3.1 端口绑定
  • 3.2 域名绑定
• 4. nginx作为反向代理
  • 4.1 为什么需要反向代理？
  • 4.2 什么是代理和反向代理？
  • 4.3 反向代理配置
    • 4.3.1 配置语法
    • 4.3.2 原理示意图

1. Nginx的安装与启动

1.1 为什么需要Nginx？

1. 前端项目部署

   项目开发完成后,前端项目需要服务器部署.

2. 解决访问端口问题

   同一台服务器部署多个项目时,访问时需要带端口. - 反向代理(动态网站,多台服务器),虚拟主机(静态网站,一台服务器)

3. 后端项目负载均衡

   现在是用Eureka作为负载均衡器,传统项目集群是就要使用Nginx做负载均衡器.并且我们网关也是使用Nginx作为负载均衡器

1.2 Ngxin是什么？

Nginx 是一款高性能的 http 服务器/反向代理服务器及电子邮件（IMAP/POP3）代理服务器。由俄罗斯的程序设计师伊戈尔·西索夫（Igor Sysoev）所开发，官方测试 nginx 能够支支撑 5 万并发链接，并且 cpu、内存等资源消耗却非常低，运行非常稳定。

Nginx 应用场景：

1. http 服务器。Nginx 是一个 http 服务可以独立提供 http 服务。可以做网页静态服务器。
2. 虚拟主机。可以实现在一台服务器虚拟出多个网站。例如个人网站使用的虚拟主机。
3. 反向代理，负载均衡。当网站的访问量达到一定程度后，单台服务器不能满足用户的请求时，需要用多台服务器集群可以使用 nginx 做反向代理。并且多台服务器可以平均分担负载，不会因为某台服务器负载高宕机而某台服务器闲置的情况。

1.3 Nginx在Linux下的安装

1.4 Nginx在Windows下的安装

1.4.1 安装

下载地址：http://nginx.org/en/download.html

绿色软件，解压即可安装

1.4.2 使用

1. 启动： start nginx.exe
2. 停止： nginx.exe -s stop
3. 重新加载： nginx.exe -s reload （修改了配置文件的时候需要重新加载）

2. Nginx静态网站部署与调试

2.1 静态网站的部署-部署阶段

将我们之前生成的静态页拷贝到nginx的html目录下即可访问

1. npm管理的js vuecli

   打包并部署！（打包命令：npm run build）

   打包以后会在项目里产生一个dist目录，这个就是打包后的结果，丢到nginx的html目录下即可！

2. 直接引入js传统静态

   直接拷贝丢到nginx的html目录下即可！

2.2 静态网站动态调试

开发阶段：

1. vuecli可以npm run dev启动调试
2. 传统导入js开发的模式,没法直接服务器方式调试,需要安装 live-server服务器,这个服务器很简单就是node一个模块.

传统前端项目搭建前端服务器，以下命令：

1. npm install -g live-server
2. live-server --port=6002

3. Nginx配置虚拟主机

虚拟主机，也叫“网站空间”，就是把一台运行在互联网上的物理服务器划分成多个“虚拟”服务器。虚拟主机技术极大的促进了网络技术的应用和普及。同时虚拟主机的租用服务也成了网络时代的一种新型经济形式。

3.1 端口绑定

1. 上传静态网站：
   • 前端网站hrm_course_web，nginx/hrm_course_web下
   • 前端网站hrm_plat_web打包后上传至nginx/hrm_plat_web 下
2. 修改Nginx的配置文件nginx.conf

    server {
        listen       82;
        server_name  localhost;
        location / {
            root   hrm_course_web;
            index  home.html;
        }      
    }
    server {
        listen       83;
        server_name  localhost;
        location / {
            root   hrm_plat_web;
            index  index.html;
        }        
    }

3. 访问测试： 重新加载Nginx
   • 地址栏输入http://localhost:82 查看对应效果
   • 地址栏输入http://localhost:83 查看对应效果

3.2 域名绑定

1. 什么是域名？

   域名（Domain Name），是由一串用“点”分隔的字符组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位（有时也指地理位置，地理上的域名，指代有行政自主权的一个地方区域）。域名是一个IP地址上有“面具” 。域名的目的是便于记忆和沟通的一组服务器的地址（网站，电子邮件，FTP等）。域名作为力所能及难忘的互联网参与者的名称。域名按域名系统（DNS）的规则流程组成。在DNS中注册的任何名称都是域名。域名用于各种网络环境和应用程序特定的命名和寻址目的。通常，域名表示互联网协议（IP）资源，例如用于访问因特网的个人计算机，托管网站的服务器计算机，或网站本身或通过因特网传送的任何其他服务。世界上第一个注册的域名是在1985年1月注册的。

   要想访问网络资源就要使用http://ip:port/uri,但是记忆ip比较难,通过域名就更好,这个域名最终也要解释为ip.

2. 域名解析步骤

   • hosts:本地域名
   • 远程域名:在网络上找DNS(域名解析服务器)来解析域名

3. 域名级别

   • 顶级域名（又名一级域名）。如cn、com等
   • 二级域名（顶级域名之下的域名）。如wangningbo.cn、baidu.com
   • 三级域名。如ningbo.wangningbo.cn

4. 域名与ip绑定

   • 一个域名对应一个 ip 地址，一个 ip 地址可以被多个域名绑定。
   • 本地测试可以修改hosts文件（C:\Windows\System32\drivers\etc\hosts）
   • 可以配置域名和 ip 的映射关系，如果 hosts 文件中配置了域名和 ip 的对应关系，不需要走dns 服务器。

域名解析流程：在浏览器输入https://www.baidu.com/，这时候先会去本地的hosts文件里去解析，如果解析不了就会去网络上找DNS来解析域名！

5. 域名配置

hosts文件配置一下本地域名

127.0.0.1 hrm.com
127.0.0.1 admin.hrm.com
127.0.0.1 course.hrm.com

修改Nginx配置文件nginx.conf

    server {
        listen       80;
        server_name  admin.hrm.com;
        location / {
            root   hrm_plat_web;
            index  index.html;
        }
    }
    server {
        listen       80;
        server_name  course.hrm.com;
        location / {
            root   hrm_course_web;
            index  home.html;
        }
    }

重新启动nginx

 ./nginx -s reload

测试

地址栏输入http://admin.hrm.com/
地址栏输入http://course.hrm.com/ 

4. nginx作为反向代理

4.1 为什么需要反向代理？

静态项目可以通过虚拟主机实现,但动态tomcat网站就不行,nginx无法解释运行.

4.2 什么是代理和反向代理？

1. 代理

   通过客户机的配置，实现让一台服务器代理客户机，客户的所有请求都交给代理服务器处理。

   如下图所示
   [图片上传失败...(image-bd0e39-1569803991383)]

2. 反向代理

   用一台服务器，代理真实服务器，用户访问时，不再是访问真实服务器，而是代理服务器。

   如下图所示
   [图片上传失败...(image-ace90d-1569803991383)]

nginx可以当做反向代理服务器来使用：我们需要提前在nginx中配置好反向代理的规则，不同的请求，交给不同的真实服务器处理。当请求到达nginx，nginx会根据已经定义的规则进行请求的转发，从而实现路由功能，利用反向代理，就可以解决我们前面所说的端口问题！如下图所示
[图片上传失败...(image-c8b74b-1569803991383)]

4.3 反向代理配置

4.3.1 配置语法

语法解释

server {
        listen       80;# 监听的端口
        server_name  course.hrm.com;# 监听的域名
        # location：请求映射规则，/：代表映射一切请求路径
        location / { 
            proxy_pass http://127.0.0.1:6002; # 访问域名为course.hrm.com都交给6002处理 # 代理转发，所有以course.hrm.com并且80端口访问的请求都会被转发给http://127.0.0.1:6002处理
            index  index.html index.htm home.html;
        }
    }

nginx.conf配置

server {
        listen       80;
        server_name  course.hrm.com;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / { 
            proxy_pass http://127.0.0.1:6002; #访问域名为course.hrm.com都交给6002处理
            index  index.html index.htm home.html;
        }
    }

    server {
        listen       80;
        server_name  admin.hrm.com;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            proxy_pass http://127.0.0.1:6001; #访问域名为admin.hrm.com都交给6001处理
            index  index.html index.htm;
        }
    }

4.3.2 原理示意图

[图片上传失败...(image-13dc72-1569803991383)]