开发者社区> 一切总会归于平淡> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

如何使用Nginx 部署前端项目,什么是反向代理?

简介: Nginx可以作为静态web服务器来部署静态资源。这里所说的静态资源是指在我们web服务端真实存在,并且能够直接展示的一些文件,比如常见的html页面
+关注继续查看

https://developer.aliyun.com/article/1034403?spm=a2c6h.26396819.creator-center.6.244f3e186gxA3S
这篇博客介绍了并安装了Nginx之后,本片博客就要讲解Nginx 的应用。

1、配置文件结构

nginx的配置文件(conf/nginx.conf)整体上分为三部分:

  1. 全局块;
  2. events块;
  3. http块;

这三块的分别配置什么样的信息呢,看下表:
image.png
image.png

在这个三个地方,我们操作得最多的地方就是http块,在http块中可以包含多个server块,每个server块可以配置多个location块。

2、部署静态资源

Nginx可以作为静态web服务器来部署静态资源。这里所说的静态资源是指在我们web服务端真实存在,并且能够直接展示的一些文件,比如常见的html页面、css文件、js文件、图片、视频等资源,那么我们就可以使用Nginx来部署这些静态资源。
为什么我们不使用Tomcat来部署静态资源,而使用nginx 呢?

这是因为 相对于Tomcat,Nginx处理静态资源的能力更加高效,所以在生产环境下,一般都会将静态资源部署到Nginx中。

将静态资源部署到Nginx非常简单,只需要将文件复制到Nginx安装目录下的html目录中即可。
例如:

<!DOCTYPE html>
<html>
<head>
<title>Welcome to nginx!</title>
<style>
    body {
        width: 35em;
        margin: 0 auto;
        font-family: Tahoma, Verdana, Arial, sans-serif;
    }
</style>
</head>
<body>
<h1>Hello nginx!</h1>
</body>
</html>
  1. 将静态资源上传到 /usr/local/nginx/html 目录(看好路径,别上传错了)

image.png
2.启动nginx
image.png
3. 访问
image.png
4.修改默认首页
image.png
如果我们需要将hello.html作为nginx的首页,可以修改location的index指令,将其修改为hello.html,如下:
image.png
配置文件修改了,我们需要重新加载一下,才可以生效:

nginx -s reload

image.png

3、反向代理

Nginx所提供的这个反向代理功能是我们后面使用非常多的功能。
我们在了解什么是反向代理之前,先来了解一下什么是正向代理。

3.1 概念

其实就是一个位于客户端和原始服务器(origin server)之间的服务器,为了从原始服务器取得内容,客户端向代理发送一个请求并指定目标(原始服务器),然后代理向原始服务器转交请求并将获得的内容返回给客户端。

只看这段话是没有什么感觉的,我们来举个例子。
比如,我们现在作为客户端要访问谷歌的网站,我们要知道,我们直接去访问这个网站是访问不到的,这个时候,我们就可以通过一个代理服务器,帮我们去访问谷歌这个网站。所以我们现在是访问这个代理服务器,代理服务器去访问谷歌这个网站,谷歌再将返回的数据返回给代理服务器,代理服务器再将数据返回给我们。
image.png

这个就是正向代理。
正向代理的典型用途就是有些公司内部是局域网,但是又想上网查点东西,这个时候就可以通过代理服务器提供访问外网的途径。
正向代理一般是在客户端设置代理服务器,通过代理服务器转发请求,最终访问到目标服务器。
了解完正向代理,我们就来了解反向代理,看看它们有什么不一样。

这个反向代理服务器也是位于用户于服务器之间的,但是对于用户而言,反向代理服务器就相当于目标服务器,用户直接访问反向代理服务器就可以获得目标服务器的资源,那么反向代理服务器负责将请求转发给代理服务器。

image.png
大家看上图,发现反向代理跟正向代理过程好像是一样的,都是客户端访问代理服务器,然后代理服务器将请求发给服务器。
实际上,反向代理和正向代理的区别在哪里呢?

就是这个正向代理在我们的这个客户端来设置这个代理服务器,而且我们的客户端是知道有这个代理服务器的。
而在我们的反向代理中,我们的客户端它其实是不知道有代理服务器这个存在的,那么我们客户端只需要访问这个反向代理这个服务器,然后这个反向代理服务器就会给他返回相应的资源。
那么在这个过程中,我们的客户他其实都不知道我们的目标服务器在什么位置,甚至都不知道有目标服务器的存在。

这个时候可能会有人问,我们不能绕过反向代理服务器,去访问这个目标服务器,其实是可以的,但是正常情况下,我们的公司内部可能会有多台web服务器,我们客户端都一个一个去连接这些服务,就不太好管理,所以我们就可以使用反向代理服务器作为统一的入口。

3.2 配置并测试

那么接下来,我们就是要使用nginx来作为反向代理服务器使用。
首先我们要准备两台服务器,没钱的像我一样,使用虚拟机。
一台安装好Nginx,一台配置好java 环境。

1、首先我们将自己手上的随意一个项目上传到服务器上,并启动,自己测试一下能不能访问到。
image.png
浏览器测试
image.png
2、在代理服务器中配置反向代理
进入nginx的安装目录,并编辑配置文件nginx.conf;

cd /usr/local/nginx/conf/  #看大家自己的Nginx安装在何处
vim nginx.conf

在http块中,再添加一个server块虚拟主机的配置,监听82端口,并配置反向代理proxy_pass:

server {
    listen 82;
    server_name localhost;
    location / {
        proxy_pass http://192.168.231.136:8080;     #反向代理配置,将请求转发到指定服务
    }
}

image.png
3、检查配置文件,并重新加载

nginx -t

image.png

nginx -s reload

4、开放 82 端口,如果你开启了,忽略这一步

firewall-cmd --zone=public --add-port=82/tcp --permanent
firewall-cmd --reload

5、 访问
image.png

4、负载均衡

4.1 介绍

现在我们来了解负载均衡,负载均衡也是Nginx为我们提供的非常非常重要的一个功能。

以前的业务都是非常简单的,一台服务器就能满足我们的需求,但是随着互联网的发展,业务流量越来越大,并且业务逻辑也越来越复杂,单台服务器的性能及单点故障问题就凸显出来了,因此需要多台服务器组成应用集群,进行性能的水平扩展以及避免单点故障出现。

这里有两个概念,大家了解一下:

应用集群将同一应用部署到多台机器上,组成应用集群,接收负载均衡器分发的请求,进行业务处理并返回响应数据。
负载均衡器将用户请求根据对应的负载均衡算法分发到应用集群中的一台服务器进行处理。

image.png
此处的负载均衡器,我们将会使用Nginx来实现,而Nginx的负载均衡是基于反向代理的,只不过此时所代理的服务器不是一台,而是多台。

4.2 配置并测试

这里大家可以再多加一台服务器或者虚拟机,我懒选择在同一虚拟机上,运行两个Java项目,但是端口不一样用于区分。(记得开放端口!!!)

1、在代理服务器上配置Nginx.
打开nginx的配置文件nginx.conf并增加如下配置:

#upstream指令可以定义一组服务器
upstream targetserver{    
    server 192.168.231.136:8080;
    server 192.168.231.136:8081;
}

server {
    listen       82;
    server_name  localhost;
    location / {
        proxy_pass http://targetserver; #反向代理配置,将请求转发到指定服务
    }
}

具体配置位置如下:
image.png
2、 重新加载nginx配置文件,访问

nginx -s reload

测试时,我们直接访问nginx的82端口(http://192.168.231.134:82/hello), 此时nginx会根据负载均衡策略,将请求转发到后面的两台服务器。
image.png
image.png
在上述的测试过程中,我们看到请求均衡的转发到了8080和8081,因为模式的负载均衡策略是轮询。

4.3 负载均衡策略

处理上述默认的轮询策略以外,在Nginx中还提供了其他的负载均衡策略,如下:
image.png
权重的配置:

#upstream指令可以定义一组服务器
upstream targetserver{    
    server 192.168.231.136:8080 weight=10;
    server 192.168.231.136:8081 weight=5;
}

上述配置的weight权重是相对的,在上述的配置中,效果就是,在大数据量的请求下,最终8080接收的请求数是8081的两倍。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
nginx怎么部署php项目,如何php项目部署到nginx
php项目部署到nginx的方法:首先安装“Nginx”和“php-fpm”;然后将项目复制到“nginx/html”文件下;接着修改配置文件;最后重新载入Nginx并启动“php-fpm”即可。
606 0
Nginx 安装 SSL 配置 HTTPS 超详细完整教程全过程
说到 Nginx 服务器,最大特点就是轻量级和高性能。通过在几台不同的服务器上进行测试,发现它的并发能力特别强,并且相对而言吃的内存少很多。目前已是绝大多数站长的首选 HTTP 和反向代理服务器。
28846 0
Nginx 安装 SSL 配置 HTTPS 超详细完整全过程
说到Nginx服务器,个人认为最大特点就是轻量级和高性能。通过在几台不同的服务器上进行测试,发现它的并发能力特别强,并且相对而言吃的内存少很多。目前已是绝大多数站长的首选 HTTP 和反向代理服务器。站长自己的网站,包括承接企业服务器运维服务所采用的都是 Nginx。Apache 当然也可以,如果有兴趣
1072 0
+关注
一切总会归于平淡
在活着的每一天,跳舞吧。 用脚尖着地,
文章
问答
文章排行榜
最热
最新
相关电子书
更多
《Nginx 代理系统常用手册》
立即下载
3D/AR技术在新零售商业场景中的应用
立即下载
1._Alibaba_Cloud_Whitepaper_-_Data_Security_is_Now_More_Important_Than_Ever
立即下载