# 在 Nginx 上部署 Angular 应用并设置反向代理
在将 Angular 应用程序部署到生产环境时，使用 Nginx 作为服务器是一种常见的选择。本文将指导您如何在 Nginx 上运行 Angular 应用，并且在应用程序位于额外的 Nginx 反向代理之后。这样的设置可以提高安全性，并允许您更好地管理不同服务的流量。## 步骤 1：部署 Angular 应用首先，确保您的 Angular 应用已经构建完成。您可以使用以下命令构建应用：bashng build --prod这将在 `dist/` 目录中生成一个用于生产环境的构建。将这些文件部署到您的服务器上，确保您的服务器已经安装了 Node.js 和 Nginx。## 步骤 2：配置 Nginx 服务器### 安装 Nginx如果您的服务器上尚未安装 Nginx，可以使用以下命令安装：
bashsudo apt updatesudo apt install nginx### 配置 Nginx 以服务 Angular 应用在 Nginx 配置文件中添加一个新的站点配置。打开默认配置文件：
bashsudo nano /etc/nginx/sites-available/default将以下配置添加到 `server` 块中，确保替换 `
nginxserver { listen 80; server_name your_domain.com; # 替换为您的域名或服务器 IP 地址 location / { root /path/to/your/app/dist; index index.html; try_files $uri $uri/ /index.html; } # 可以添加其他配置，如 SSL 配置等}保存并关闭文件，然后重新加载 Nginx：bashsudo service nginx reload现在，您的 Angular 应用应该可以通过服务器的 IP 地址或域名访问。## 步骤 3：设置额外的 Nginx 反向代理有时，您可能希望将 Angular 应用放置在额外的 Nginx 反向代理之后，以增加安全性或对应用程序进行更精细的控制。### 安装并配置额外的 Nginx在安装额外的 Nginx 之前，请确保已经停止默认的 Nginx 服务：
bashsudo service nginx stop然后安装额外的 Nginx：
bashsudo apt install nginx创建一个新的配置文件：
bashsudo nano /etc/nginx/sites-available/extra-proxy将以下配置添加到文件中，替换 `
nginxserver { listen 80; server_name your_domain.com; # 替换为您的域名或服务器 IP 地址 location / { proxy_pass http://; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; } # 可以添加其他配置，如 SSL 配置等} 保存并关闭文件，然后创建符号链接到 `sites-enabled` 目录：bashsudo ln -s /etc/nginx/sites-available/extra-proxy /etc/nginx/sites-enabled/重新启动额外的 Nginx：
bashsudo service nginx start现在，您的 Angular 应用将通过额外的 Nginx 反向代理进行访问。在本文中，我们学习了如何在 Nginx 上部署 Angular 应用，并通过反向代理提高了安全性。通过按照以上步骤操作，您可以确保您的应用程序在生产环境中以安全可靠的方式运行。希望这些步骤对您有帮助，祝您的应用顺利运行！