【教程】Node.js+Apache 部署网页全过程（非常详细！）

文章目录

  • 背景
  • 0. 前置假设
  • 1. 更新系统和安装必要软件
  • 2. 打包并上传项目到服务器
    • 2.1 识别需要上传的文件
    • 2.2 文件归档和压缩
    • 2.3 压缩文件上传到服务器
    • 2.4 解压文件
  • 3. 配置Node.js应用
    • 3.1 启动 PM2
    • 3.2 确认 PM2 进程
  • 4. 配置Apache反向代理
  • 5. 启用必要的Apache模块
  • 6. 检查 Apache 和 Node.js 的监听地址
    • 6.1 Apache 配置检查
    • 6.2 Node.js 监听地址
    • 6.3 使用 netstat 检查端口
  • 7. 更新防火墙规则（如果需要）
  • 8. 启用站点配置并重启Apache
  • 9. 验证部署
    • 9.1 直接通过 IP 地址访问
    • 9.2 debug
      • 9.2.1 查看日志
      • 9.2.2 测试 Node.js 服务器
  • 10 DNS 设置
    • 10.1 DNS指向设置
    • 10.2 Apache 虚拟主机重定向
      • 10.2.1 配置文件的修改
      • 10.2.2 启用站点配置并重启 Apache
    • 10.3 验证访问

在这里插入图片描述

背景

  • 笔者在 Windows 使用 Node 的本地服务器（http://localhost:${PORT}）进行网页开发并测试完成后，想要将其部署到 vps 上。

  • 要解决的问题有：

    • vps 上的常规端口，80/443 端口已经被其他网页占用，必须通过非常规窗口访问我们的网站
    • 网站部署中 Apache 的配置，Node 服务器的管理
    • 笔者的二级域名已经设置指向该服务器的常规端口 80/443，如何使用三级域名直接访问新部署的网页而不需要输入端口号

  • 补充（域名分级结构）：

  1. 根域名（.）：

    • 这是最顶层的域名，通常不显示。

  2. 顶级域名（TLD）：

    • 例如 cn.（中国的顶级域名）。它是域名系统中最顶层的部分。

  3. 一级域名（一级）：

    • cn. 可以视为顶级域名，同时也是一级域名。

  4. 二级域名（如 xxx.cn.）：

    • 这部分通常是由用户注册的域名，例如 example.cn。

  5. 三级域名（如 xxx.xxx.cn.）：

    • 进一步细分的域名结构，例如 sub.example.cn。

接下来开始网站的部署！

0. 前置假设

假设：

  • 网站要使用端口 11111
  • Node.js 服务器使用端口 9000
  • 要使用的域名为 xxx.xx.x

1. 更新系统和安装必要软件

确保你的系统是最新的，并安装pm2来管理你的Node.js应用：

sudo apt update
sudo apt upgrade -y
sudo npm install -g pm2

2. 打包并上传项目到服务器

2.1 识别需要上传的文件

将项目从本地机器上传到服务器的相应目录，我的项目结构为（使用缩进表示结构层次）：

/frontendindex.htmlregister.htmlscript.jsstyle.css/backendpackage-lock.jsonpackage.jsonserver.jsuser.db/node_modules

/node_modules 文件夹是不用上传到服务器的，因为 /node_modules 文件夹是在 Windows 上开发时生成的，要部署到 ubuntu 上最好重新安装这些包。

2.2 文件归档和压缩

  • 这里我使用 7z 将这些文件归档为 tar，然后再压缩为 bz2（7z中需要先归档为 tar 才会出现压缩为 bz2 的压缩选项）
  • 最终文件后缀名为 .tar.bz2
  • 如下：
    在这里插入图片描述

2.3 压缩文件上传到服务器

  • 这里我使用 MobaXterm，以 SSH 协议连接到服务器，并使用内置的SFTP 服务进行文件上传
  • 上传位置一般为 /var/www/下面的文件夹，可以新建一个和项目名称有关的

2.4 解压文件

使用如下命令解压上传的文件

tar -xvjf filename.tar.bz2
  • 完成后，服务器中项目内容如下
/var/www/xxx/frontend
/var/www/xxx/backend

3. 配置Node.js应用

3.1 启动 PM2

进入你的服务器，导航到你的backend目录并安装依赖项，然后使用pm2启动应用：

cd /var/www/xxx/backend
npm install
pm2 start server.js --name YourServerName
  • server.js 处填入 Node 代码文件名
  • YourServerName 处可以自己为服务起一个别名

3.2 确认 PM2 进程

要确保你的应用正在运行，可查看 PM2 中的进程列表：

pm2 list

你应该会看到类似如下的输出，显示 YourServerName 正在运行：

┌─────┬─────────────────────┬──────┬─────────┬─────┬────────┬───────────┬──────────┬───────┬──────────┐
│ id  │ name                │ mode │ status  │ cpu │ memory │  uptime   │ restarted│ user  │ watching │
├─────┼─────────────────────┼──────┼─────────┼─────┼────────┼───────────┼──────────┼───────┼──────────┤
│ 0   │ YourServerName      │ fork │ online  │ 0%  │ 32.0mb │ 0s        │ 0        │ root  │ disabled │
└─────┴─────────────────────┴──────┴─────────┴─────┴────────┴───────────┴──────────┴───────┴──────────┘

status 处的 online 就表示服务正在运行。

4. 配置Apache反向代理

编辑或创建一个新的Apache虚拟主机配置文件，例如/etc/apache2/sites-available/YourServerName.conf：

<VirtualHost *:要使用的服务器端口>ServerName 服务名称DocumentRoot /前端文件所在目录<Directory /前端文件所在目录>Options Indexes FollowSymLinksAllowOverride AllRequire all granted</Directory>ProxyRequests OffProxyPass / http://localhost:node代码中使用的本地服务器端口/ProxyPassReverse / http://localhost:node代码中使用的本地服务器端口/ErrorLog ${APACHE_LOG_DIR}/ 服务名称_error.logCustomLog ${APACHE_LOG_DIR}/ 服务名称_access.log combined
</VirtualHost>
  • 一个具体的配置文件例子：
<VirtualHost *:11111>ServerName xxx.xx.topDocumentRoot /var/www/xxx/frontend<Directory /var/www/xxx/frontend>Options Indexes FollowSymLinksAllowOverride AllRequire all granted</Directory>ProxyRequests OffProxyPass / http://localhost:9000/ProxyPassReverse / http://localhost:9000/ErrorLog ${APACHE_LOG_DIR}/YourServerName_error.logCustomLog ${APACHE_LOG_DIR}/YourServerName_access.log combined
</VirtualHost>

5. 启用必要的Apache模块

sudo a2enmod proxy
sudo a2enmod proxy_http
sudo a2enmod rewrite

启用你的站点配置文件并重启 Apache：

sudo a2ensite sharedbill.conf
sudo systemctl restart apache2

6. 检查 Apache 和 Node.js 的监听地址

确保 Apache 和 Node.js 都监听在正确的地址和端口。

6.1 Apache 配置检查

sudo nano /etc/apache2/ports.conf

确保包含：

Listen 11111

6.2 Node.js 监听地址

确保 server.js 中监听的是 localhost 和使用的 Node 服务器端口。

6.3 使用 netstat 检查端口

  • 假如使用的 Node 服务器端口 为 9000，网页要使用的端口为 11111
  • 使用 netstat 或 ss 工具检查端口监听情况：
sudo netstat -tuln | grep :9000
sudo netstat -tuln | grep :11111
  • 应该看到 Node.js 监听在 9000 端口，Apache 监听在 11111 端口。

7. 更新防火墙规则（如果需要）

确保服务器防火墙允许端口11111的流量：

sudo ufw allow 11111/tcp
sudo ufw reload

8. 启用站点配置并重启Apache

启用站点配置并重启Apache服务器：

sudo a2ensite sharedbill.conf
sudo systemctl restart apache2

9. 验证部署

9.1 直接通过 IP 地址访问

尝试直接通过服务器的 IP 地址访问：

http://<your-server-ip>:11111

假设可以访问，并且可以正常使用其上的服务，那么则说明网页部署成功了。

9.2 debug

如果不能访问，比如显示 502 错误，则可以依靠以下手段进行 debug：

9.2.1 查看日志

Apache 错误日志：

sudo tail -f /var/log/apache2/YourServerName_error.log

Node.js 日志（使用 PM2）：

pm2 logs YourServerName

9.2.2 测试 Node.js 服务器

使用 curl 测试你的 Node.js 服务器是否在本地正常运行：

curl http://localhost:9000

你应该能够看到来自你的 Node.js 服务器的响应。如果没有响应，则需要检查你的 server.js 文件是否正确启动并监听端口 9000。

下面是配置域名 DNS 指向网站的过程，没有这个需求就不用看了。

10 DNS 设置

10.1 DNS指向设置

  • 我选择使用 Cloudflare 的 DNS 服务，并且使用三级域名指向服务器地址
  1. 登录到 Cloudflare。
  2. 选择你的域名。
  3. 进入 DNS 选项卡。
  4. 添加 A 记录：
    • Type: A
    • Name: 要使用的三级域名
    • IPv4 Address: 服务器地址
    • TTL: Auto
    • Proxy status: 设置为 DNS only 。

确保你的 A 记录看起来像这样：

TypeNameContentTTLProxy status
A要使用的三级域名服务器地址AutoDNS only

10.2 Apache 虚拟主机重定向

10.2.1 配置文件的修改

  • 由于我要使用非 80/443 这些常规端口访问网站（比如 11111），所以要在监听 80 端口的虚拟主机上添加重定向规则。
  • 在你现有的虚拟主机配置文件中添加特定的重定向规则，如果没有监听 80 端口的虚拟主机，则在刚才的 Apache 虚拟主机配置中添加虚拟主机，确保监听80端口的虚拟主机配置中有如下内容：
<VirtualHost *:80># 启用 Rewrite 引擎RewriteEngine On# 仅对 xxx.xx.x 执行重定向RewriteCond %{HTTP_HOST} ^xxx\.xx\.x$ [NC]RewriteRule ^(.*)$ http://xxx.xx.x:11111$1 [R=301,L]
</VirtualHost>
  • ^xxx\.xx\.x$ [NC]：填写三级域名地址，\ 用于转义

通过这种方式，你可以确保其他在 80 端口上运行的网站不受影响，同时实现特定域名的重定向。

10.2.2 启用站点配置并重启 Apache

启用你的站点配置文件并重启 Apache：

sudo a2ensite YourServerName.conf
sudo systemctl restart apache2

10.3 验证访问

打开浏览器，访问 http://xxx.xx.x:11111，确保页面加载正常。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/diannao/50202.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

linux如何卸载python3.5

linux如何卸载python3.5

卸载&#xff1a; 1、卸载python3.5 sudo apt-get remove python3.5 2、卸载python3.5及其依赖 sudo apt-get remove --auto-remove python3.5 3、清除python3.5 sudo apt-get purge python3.5 或者 sudo apt-get purge --auto-remove python3.5
阅读更多...
异步爬虫基础

异步爬虫基础

我们知道爬虫是 IO 密集型任务&#xff0c; 例如使用 requests 库来爬取某个站点&#xff0c;当发出一个请求后&#xff0c; 程序必须等待网站返回响应&#xff0c; 才能接着运行&#xff0c; 而在等待过程中&#xff0c;整个爬虫程序是一直在等待的。 协程的基本原理 案例的…
阅读更多...
AI发展下的伦理挑战：构建未来科技的道德框架

AI发展下的伦理挑战：构建未来科技的道德框架

一、引言 随着人工智能&#xff08;AI&#xff09;技术的飞速发展&#xff0c;我们正处在一个前所未有的科技变革时代。AI不仅在医疗、教育、金融、交通等领域展现出巨大的应用潜力&#xff0c;也在日常生活中扮演着越来越重要的角色。然而&#xff0c;这一技术的迅猛进步也带来…
阅读更多...
【OpenCV C++20 学习笔记】操作图片

【OpenCV C++20 学习笔记】操作图片

操作图片 概述图片的导入和保存对导入的图片的操作获取像素值Point类型和图片像素 内存管理和引用计数一些简便操作图片可视化更精确的类型转换 概述 在本专栏的第一篇文章中就介绍了一个用OpenCV处理图片的实例&#xff08;《图片处理基础》&#xff09;&#xff0c;这篇文章…
阅读更多...
【Linux】信号3——信号的处理

【Linux】信号3——信号的处理

1.信号的处理 我们都说信号被收到了&#xff0c;可能不会里面处理 信号是什么时候被处理的呢&#xff1f; 前提是我们得知道自己收到了信号&#xff0c;进程就得在合适的时候去查自己的pending表和block表&#xff0c;这些属于内核数据结构&#xff0c;进程一定要处于内核态&a…
阅读更多...
Vue Router高级用法：动态路由与导航守卫

Vue Router高级用法：动态路由与导航守卫

Vue Router是Vue.js官方的路由管理器&#xff0c;它和Vue.js的核心深度集成&#xff0c;让构建单页应用变得轻而易举。 动态路由 动态路由允许你在路由路径中使用变量&#xff0c;这些变量可以从实际的URL中获取&#xff0c;并传递给对应的路由组件。 定义动态路由 在route…
阅读更多...
学习测试12-车（略）

学习测试12-车（略）

系统讲解&#xff0c;可以在懂车帝网站去了解汽车结构
阅读更多...
DMv8共享存储集群部署

DMv8共享存储集群部署

DMv8共享存储集群部署 环境说明 操作系统&#xff1a;centos7.6 服务器&#xff1a;2台虚拟机 达梦数据库版本&#xff1a;达梦V8 安装前准备工作 参考达梦官方文档&#xff1a;https://eco.dameng.com/document/dm/zh-cn/ops/DSC-installation-cluster.html#%E4%B8%80%E3…
阅读更多...
如何为 DigitalOcean 上的托管数据库收集可观测指标

如何为 DigitalOcean 上的托管数据库收集可观测指标

DigitalOcean 在 2024 年 5 月开始支持在托管数据库&#xff08;PostgreSQL、MySQL、Redis和Kafka&#xff09;中收集可观测指标。我们将在本偏内容中&#xff0c;告诉大家如何使用部署在 DigitalOcean App Platform 上的网络应用程序&#xff0c;为 DigitalOcean 上的 Postgre…
阅读更多...
数据恢复教程：如何从硬盘、SD存储卡、数码相机中恢复误删除数据。

数据恢复教程：如何从硬盘、SD存储卡、数码相机中恢复误删除数据。

您正在摆弄 Android 设备。突然&#xff0c;您意外删除了一张或多张图片。不用担心&#xff0c;您总能找到一款价格实惠的数据恢复应用。这款先进的软件可帮助 Android 用户从硬盘、安全数字 (SD) 或存储卡以及数码相机中恢复已删除的数据。 Android 上数据被删除的主要原因 在…
阅读更多...
【PostgreSQL案例】我要查的表没有在执行计划中

【PostgreSQL案例】我要查的表没有在执行计划中

问题&#xff1a;查的表没有在执行计划中 sql&#xff1a; SELECT* FROM(SELECTA.column1 as "column1",--中间省略很多A字段A.column99 as "column99"fromtable_a Aleft join (SELECTlzl_idfromtable_a AAinner join table_b BB ON AA.lzl_key BB.lzl_…
阅读更多...
Failed to activate conda environment

Failed to activate conda environment

问题描述 Pycharm Terminal显示以下错误&#xff0c;导致无法自动激活当前项目的conda环境 Failed : 无法将“Failed”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写&#xff0c;如果包括路径&#xff0c;请确保路径正确&#xff0c;然后再试一次。 …
阅读更多...
多GPU并行处理[任务分配、进程调度、资源管理、负载均衡]

多GPU并行处理[任务分配、进程调度、资源管理、负载均衡]

1. 多GPU并行处理设计 设计思路: 实现基于多GPU的并行任务处理&#xff0c;每个GPU运行独立的任务&#xff0c;以加速整体的处理速度。 实现机制: 进程隔离: 利用multiprocessing.Process为每个GPU创建独立的工作进程。 GPU资源限制: 通过设置CUDA_VISIBLE_DEVICES环境变量&…
阅读更多...
厚积薄发，详解 IoTeX 2.0 如何推动 DePIN 赛道迈向新台阶

厚积薄发，详解 IoTeX 2.0 如何推动 DePIN 赛道迈向新台阶

背 景 DePIN 是加密货币行业的一个新兴垂直领域&#xff0c;也是本轮牛市最重要的叙事之一。DePIN 通常通过发行和分配代币来激励参与者&#xff0c;用户可以通过提供资源、维护网络、参与治理等方式获得代币奖励并产生直接的经济收益&#xff0c;从而重新洗牌财富分配方…
阅读更多...
【Linux】网络通信基础：应用层协议、HTTP、序列化与会话管理

【Linux】网络通信基础：应用层协议、HTTP、序列化与会话管理

文章目录 前言1. 应用层自定义协议与序列化1.1 什么是应用层&#xff1f;1.2 再谈 "协议"1.3 序列化 和 反序列化 2. HTTP 协议3. 认识 URL(统一资源定位符)4. urlencode和urldecode5. HTTP 协议请求与响应格式5.1 HTTP 请求5.2 HTTP 响应 6. HTTP 的方法6.1 GET 方法…
阅读更多...
50.TFT_LCD液晶屏驱动设计与验证（3）

50.TFT_LCD液晶屏驱动设计与验证（3）

&#xff08;1&#xff09;数据生成模块Verilog代码&#xff1a; module data_gen(input [9:0] hang ,input [9:0] lie ,input clk_33M ,input reset_n ,output reg [23:0] data ); //定义最大行、列parameter …
阅读更多...
Git（分布式版本控制系统）（fourteen day）

Git（分布式版本控制系统）（fourteen day）

一、分布式版本控制系统 1、Git概述 Git是一种分布式版本控制系统&#xff0c;用于跟踪和管理代码的变更&#xff0c;它由Linux、torvalds创建的&#xff0c;最初被设计用于Linux内核的开发。Git允许开发人员跟踪和管理代码的版本&#xff0c;并且可以在不同的开发人员之间进行…
阅读更多...
mybatis-plus项目中使用mybatis插件

mybatis-plus项目中使用mybatis插件

1. 确保项目添加MyBatis-Plus依赖以及适合的SpringBoot版本。 <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>版本号</version> </dependency> 2. 创建mybatis自…
阅读更多...
监控Windows文件夹下面的文件(C#和C++实现)

监控Windows文件夹下面的文件(C#和C++实现)

最近在做虚拟打印机时&#xff0c;需要实时监控打印文件的到达&#xff0c;并移动文件到另外的位置。一开始我使用了线程&#xff0c;在线程里去检测新文件的到达。实际上Windows提供了一个文件监控接口函数ReadDIrectoryChangesW。这个函数可以对所有文件操作进行监控。 ReadD…
阅读更多...
SAP中生产版本维护

SAP中生产版本维护

流程概述 本流程为生产版本主数据维护流程，当PBOM、工艺路线主数据维护完成后，方能进行此流程。由于S/4HANA系统中，生产版本被定义为BOM展开的必要条件，因此所有工厂都必须在运行物料需求计划与生产执行等流程前将生产版本维护完成，与此同时，生产版本数据还是财务模块发…
阅读更多...
最新文章

Copyright @ 2022~2023