将NGINX作为Node或Angular应用程序的反向代理

反向代理是一个从一个或多个上游服务器为客户端检索资源的服务器。它通常位于私有网络的防火墙后面,并将客户端的请求转发给上游服务器。反向代理极大地提高了任何Web应用程序的安全性、性能和可靠性。许多使用NodeJS或Angular编写的现代Web应用程序可以使用自己的独立服务器运行,但它们缺乏许多高级功能,如负载均衡、安全性和加速,这是大多数这些应用程序所需的。NGINX通过其先进的功能,可以在为NodeJS或Angular应用程序提供服务的同时充当反向代理。

NGINX 反向代理服务器

在本教程中,我们将探讨如何使用NGINX作为Node或Angular应用程序的反向代理服务器。下面的图示向您展示了反向代理服务器的工作原理,以及它如何处理客户端请求并发送响应。

Nginx Reverse Proxy

先决条件

  • You have already installed NGINX by following our tutorial from here.

假设

  • The NGINX server can be accessed from public domain.
  • The Node or Angular application will be running in a separate system (upstream server) in a private network and can be reached from NGINX server. Although it is very much possible to do the setups in a single system.
  • The tutorial makes use of variables like SUBDOMAIN.DOMAIN.TLD and PRIVATE_IP. Replace them with your own values at appropriate places.

NodeJS应用程序

假设您已在您的环境中安装了NGINX,请让我们创建一个示例的NodeJS应用程序,该应用程序将通过NGINX反向代理进行访问。首先,在您的私有网络中的一台系统上设置一个Node环境开始。

安装 Node

在安装NodeJS和最新版本的npm(node包管理器)之前,请检查它是否已经安装了。

# node --version 
# npm --version

如果上面的命令返回了NodeJS和NPM的版本,请跳过下面的安装步骤,继续创建示例NodeJS应用程序。要安装NodeJS和NPM,请使用以下命令:

# apt-get install nodejs npm

安装完成后,请再次检查 NodeJS 和 NPM 的版本。

# node --version
# npm --version

创建一个示例的Node应用程序

一旦 NodeJS 环境准备就绪,使用 ExpressJS 创建一个示例应用程序。因此,创建一个用于 Node 应用程序的文件夹,并安装 ExpressJS。

# mkdir node_app  
# cd node_app
# npm install express

现在使用您最喜欢的文本编辑器,创建app.js并将以下内容添加到其中。

# vi app.js
const express = require('express')
const app = express()
app.get('/', (req, res) => res.send('Hello World !'))
app.listen(3000, () => console.log('Node.js app listening on port 3000.'))

使用以下命令运行节点应用程序:运行节点应用程序。

# node app.js

用curl查询端口号3000,确认应用程序是否在本地运行。

# curl localhost:3000
Hello World !

在这一点上,NodeJS应用程序将在上游服务器上运行。在最后一步中,我们将配置NGINX作为上述Node应用程序的反向代理。暂时让我们继续创建一个Angular应用程序,以下是相应的步骤:

Angular 应用程序

Angular是另一个使用TypeScript开发Web应用程序的JavaScript框架。通常情况下,Angular应用程序通过与之捆绑的独立服务器进行访问。但是由于在生产环境中使用该独立服务器存在一些缺点,所以在Angular应用程序之前放置了一个反向代理服务器来更好地提供服务。

设置 Angular 环境

由于Angular是一个JavaScript框架,因此在系统中需要安装Nodejs版本大于8.9。因此,在安装angular CLI之前,请在终端中输入以下命令,快速设置node环境。

# curl -sL https://deb.nodesource.com/setup_10.x | sudo bash -
# apt-get install nodejs npm

现在开始安装Angular CLI,它可以帮助我们创建项目,并为任何Angular应用程序生成应用程序和库的代码。

# npm install -g @angular/cli

现在,Angular环境的设置已经完成。接下来,我们将创建一个Angular应用程序。

创建Angular应用

使用以下Angular CLI命令创建一个Angular应用:

# ng new angular-app

切换到新创建的Angular目录,并通过指定主机名和端口号来运行Web应用程序。

# cd angular-app
# ng serve --host PRIVATE_IP --port 3000

发送一个Curl请求到3000端口,确认Angular应用正在本地主机上运行。

# curl PRIVATE_IP:3000

目前,Angular应用程序将在您的上游服务器上运行。在下一步中,我们将配置NGINX以充当上述Angular应用程序的反向代理。

将NGINX配置为反向代理

导航到NGINX虚拟主机配置目录,并创建一个作为反向代理的服务器块。记住之前安装NGINX的系统可以通过互联网访问,即系统附带了公共IP。

# cd /etc/nginx/sites-available
# vi node_or_angular_app.conf

server {  
              listen 80;
              server_name SUBDOMAIN.DOMAIN.TLD;
              location / {  
                           proxy_pass https://PRIVATE_IP:3000;  
                           proxy_http_version 1.1;  
                           proxy_set_header Upgrade $http_upgrade;  
                           proxy_set_header Connection 'upgrade';  
                           proxy_set_header Host $host;  
                           proxy_cache_bypass $http_upgrade;  
               }  
}

以上配置中的proxy_pass指令使服务器块成为反向代理。所有发送到域名SUBDOMAIN.DOMAIN.TLD并与根位置块(/)匹配的流量将转发到运行节点或Angular应用程序的https://PRIVATE_IP:3000。

是否可以用NGINX反向代理同时承载NodeJS和Angular应用程序?

上述服务器块将充当node或angular应用程序的反向代理。如果您打算在同一系统上同时提供node和angular应用程序,只需在两个不同的端口号上运行它们即可使用NGINX反向代理。还可以使用两个单独的上游服务器来运行node和angular应用程序。此外,您还需要创建另一个NGINX服务器块,其中包含与server_name和proxy_pass指令匹配的值。推荐阅读:了解NGINX配置文件。检查上述服务器块中的任何语法错误并启用它们。最后,重新加载NGINX以应用新的设置。

# nginx -t
# cd /etc/nginx/sites-enabled
# ln -s ../sites-available/node_or_angular_app.conf .
# systemctl reload nginx

请将您喜欢的网络浏览器定向到https://SUBDOMAIN.DOMAIN.TLD,您将会收到来自Node或Angular应用程序的欢迎消息。

Angular Welcome Page

总结

将以下内容用中文进行本地化的改写,只需提供一种选择:

这就是为NodeJS或Angular应用程序配置NGINX反向代理的全部内容。您现在可以继续添加免费的SSL证书,例如Let’s Encrypt来保护您的应用程序!

发表回复 0

Your email address will not be published. Required fields are marked *