Skip to main content

🚀 轻量服务器从零到全副武装

前言: 为什么选择腾讯云“首尔机房”的 Ubuntu 22.04 轻量服务器?

  1. 免备案:绑定域名后直接解析即可访问,告别繁琐的 ICP 备案流程。
  2. 网络自由:自带原生出海网络环境,直连 GitHub、Docker Hub、NPM 极其顺畅,告别各种国内镜像源配置。
  3. 低延迟:首尔机房到国内(尤其是华东/北方)的延迟非常优秀。

本文将带你打造一台极具现代感、安全稳定、专为前端/Node.js 开发者定制的生产力服务器。


阶段一:云端控制台准备

在打开终端敲命令之前,请先在腾讯云网页控制台完成以下配置:

  1. 重置密码:进入服务器详情页,重置 ubunturoot 用户的密码。
  2. 配置防火墙(⚠️极重要):进入“防火墙”选项卡,确保放行以下端口:
    • 22 (SSH连接)
    • 80 (HTTP)
    • 443 (HTTPS)
    • 81 (Nginx Proxy Manager 面板)。建议限制访问,只允许指定 IP 访问比如你本地的ip,或者只在需要操作时开放
  3. 准备域名:在云服务商处购买域名并完成实名认证。不需要购买任何 SSL 证书,后续我们将全自动白嫖并自动续期。

💡 防黑客提示:不要在防火墙暴露你 Node 服务的真实端口(如 3000、8080),所有外部访问统一从 80/443 进入,由网关代理转发。


阶段二:系统初始化与防爆破(SSH 登录后执行)

通过你喜欢的终端工具(推荐 Ghostty)SSH 连入服务器。

1. 更新系统软件包

sudo apt update && sudo apt upgrade -y

(如弹出粉红色服务重启提示框,直接按回车选 OK 即可)

2. 修正服务器时区

首尔机房默认为韩国时间,修改为上海时间方便看日志:

sudo timedatectl set-timezone Asia/Shanghai
date # 确认时间是否正确

3. 开启 BBR 网络加速

有效降低跨国传输的延迟与丢包:

echo "net.core.default_qdisc=fq" | sudo tee -a /etc/sysctl.conf
echo "net.ipv4.tcp_congestion_control=bbr" | sudo tee -a /etc/sysctl.conf
sudo sysctl -p

4. 增加 Swap 虚拟内存(防爆内存死机)

轻量服务器内存较小,配置 2GB Swap 保命:

sudo fallocate -l 2G /swapfile
sudo chmod 600 /swapfile
sudo mkswap /swapfile
sudo swapon /swapfile
echo '/swapfile none swap sw 0 0' | sudo tee -a /etc/fstab

5. 安装基础安全与监控工具

# fail2ban: 防止 SSH 暴力破解,输错密码自动封禁 IP
# btop: 高颜值系统资源监控工具
# ncdu: 磁盘空间分析神器
sudo apt install fail2ban btop ncdu -y

阶段三:打造高颜值终端(Fish + Starship)

作为极客,我们需要自动补全和语法高亮,Fish Shell 是最佳选择。zsh 和 Oh my zsh 也可以,就是配置麻烦了点,需要引入多个插件,参考 前端环境搭建,看个人喜好了

1. 安装 Fish 并设为默认 Shell

sudo apt install fish -y
chsh -s /usr/bin/fish

⚠️ 关键操作:执行完后,输入 exit 断开连接。重新 SSH 连入,即可进入 Fish 环境。

2. 安装 Starship 终端主题

# 1. 一键安装
curl -sS https://starship.rs/install.sh | sh

# 2. 写入 Fish 配置
mkdir -p ~/.config/fish
echo 'starship init fish | source' >> ~/.config/fish/config.fish
source ~/.config/fish/config.fish

阶段四:前端专属运行环境(Node.js + Git)

彻底抛弃老旧的 nvm,拥抱基于 Rust 的超快版本管理器 fnm

1. 安装 fnm

curl -fsSL https://fnm.vercel.app/install | bash
# 将 fnm 注入 fish,支持根据项目 .nvmrc 自动切换 Node 版本
echo 'fnm env --use-on-cd | source' >> ~/.config/fish/config.fish
source ~/.config/fish/config.fish

2. 安装 Node.js 与全局工具

fnm install 20
fnm default 20
npm install -g pnpm yarn pm2 serve

3. 配置 Git 密钥(用于免密拉取 GitHub)

ssh-keygen -t ed25519 -C "你的邮箱@example.com"
# 查看并复制公钥,将其添加到 GitHub 的 SSH Keys 中
cat ~/.ssh/id_ed25519.pub

4. 规范化工程目录

别把代码乱扔,从第一天起建立标准目录:

mkdir -p ~/projects ~/docker ~/scripts

阶段五:容器化基建(Docker + 网关)

1. 安装 Docker

后续服务大多走 Docker 容器化部署以屏蔽环境差异,先把 Docker 装上。

curl -fsSL https://get.docker.com | sh
# 将当前用户加入 docker 组,免 sudo 运行
sudo usermod -aG docker $USER

⚠️ 关键操作:再次输入 exit 断开并重新 SSH 连接,使 Docker 权限生效。

2. 限制 Docker 日志(防止磁盘撑爆)

sudo nano /etc/docker/daemon.json

写入以下内容限制日志大小:

{
"log-driver": "json-file",
"log-opts": {
"max-size": "20m",
"max-file": "3"
}
}

保存后重启 Docker:sudo systemctl restart docker

3. 部署现代网关:Nginx Proxy Manager (NPM)

告别手写 Nginx 配置文件!NPM 提供完美的 Web UI,全自动管理域名转发与 HTTPS 证书。

mkdir -p ~/docker/npm && cd ~/docker/npm
nano docker-compose.yml

填入配置:

version: "3.8"
services:
app:
image: "jc21/nginx-proxy-manager:latest"
restart: unless-stopped
ports:
- "80:80"
- "81:81"
- "443:443"
volumes:
- ./data:/data
- ./letsencrypt:/etc/letsencrypt
# 关键:把宿主机 /var/www 整个挂到容器内,NPM 才能 serve 静态文件,和 github workflow 的目标目录相对应
# 可以是其他目录,看个人喜好
- /var/www:/var/www:ro

:ro只读挂载,容器只能读不能改宿主机的文件,更安全。NPM 不需要写 /var/www,只读够用。

~/docker/npm 目录下启动 NPM 服务:docker compose up -d


阶段六:实战演练:一键部署服务与配置域名

DNS 域名解析

  • 去域名注册商的控制台,添加一条 A 记录(记录类型),将 yourdomain.com 解析到你的服务器公网 IP
  • 子域名也是需要做好解析,比如 api.yourdomain.com,添加一条 A 记录,主机记录填 api,记录值填 服务器公网 IP

动态服务部署

1.启动你的 Node/前端服务

假设你在 ~/projects/my-app 下打包了一个纯静态的 dist 文件夹,使用 PM2 将其运行在 5000 端口:

pm2 start "serve -s dist -p 5000" --name "my-frontend"

或者也可以是 SSR 和后端服务

2.在 NPM 中配置反向代理与绿锁

  1. 浏览器访问 http://服务器公网IP:81 登录 NPM。
  2. 点击 Hosts -> Proxy Hosts -> Add Proxy Host
  3. 基础配置
    • Domain Names: www.yourdomain.com
    • Forward IP: 填入服务器内网 IP ❗️(重要:千万不要填 127.0.0.1,因为 NPM 在 Docker 容器内)
    • Forward Port: 5000
    • 勾选 Block Common ExploitsWebsockets Support
  4. SSL 证书配置
    • 切换到 SSL 选项卡。
    • 下拉选择 Request a new SSL Certificate
    • 注意:需要先确保你的邮箱是正确的,右上角点击头像可修改,否则会出现 Internet Error 报错
第3步配置表单
字段
Domain Nameswww.yourdomain.com
Schemehttp
Forward Hostname / IP127.0.0.1(占位,下一步用 Custom 配置覆盖)
Forward Port8080(占位)
Cache Assets❌(我们用更精细的 cache 策略)
Block Common Exploits
Websockets Support❌(不需要)
Access ListPublic

💡 关于 www. 子域:对子域名(sub.yourdomain.com),不需要额外的 www. 重定向 —— www.sub.yourdomain.com 本身就是个奇怪的子域,访问者只会用 sub.yourdomain.com

等待 15 秒钟转圈结束……恭喜!你的项目已经可以通过安全的 HTTPS 链接访问了! 🎉

静态网页部署

上面讲的是 Node 服务要常驻进程的场景。如果你的产物是 pnpm build 出来的纯静态文件(Vite / Astro / Next SSG / Hugo 等等),事情反而更简单——不需要起任何 Node 进程,build 产物直接扔进 nginx 映射的目录,NPM 自身就能 serve

核心思路一句话:扔进 /var/www/,NPM 用 root 直接 serve,连 PM2 都省了。

1.同步 build 产物到服务器

# 本地 build
pnpm build # 产物在 dist/

# 同步到服务器
rsync -avz --delete ./dist/ root@你的服务器:/var/www/my-site/

dist/ 里的内容(index.html_astro/assets/ 等)会直接落在 /var/www/my-site/ 下。NPM 容器已挂载 /var/www,能直接读取。

2.在 NPM 里配置静态站点

照搬"动态服务部署"步骤 2、3 添加 Proxy Host(Forward 那两个字段随便填,Advanced 标签里会覆盖掉):

  • Domain Names: www.yourdomain.com
  • Forward IP: 127.0.0.1
  • Forward Port: 80
  • 勾选 Block Common Exploits

切到 Advanced 标签,贴上:

location / {
root /var/www/my-site;
try_files $uri $uri/ /index.html;
}

这段会覆盖默认的 proxy_pass,让 NPM 直接作为静态文件服务器跑。省掉 PM2 + serve 这一层,零 Node 常驻进程,资源占用最低。

关于SSL证书申请

NPM 内置 Let's Encrypt 申请,针对每个子域单独申请一张证书。NPM 会自动续期,零运维。

回到 NPM → Proxy Hosts → www.yourdomain.comEditSSL 标签

字段
SSL CertificateRequest a new SSL Certificate
Email你的邮箱(Let's Encrypt 通知 + 过期提醒)
I Agree to the Let's Encrypt Terms
Force SSL✅(80 → 443 自动重定向)
HTTP/2
HSTS Enabled✅(让浏览器永远走 HTTPS,防 SSL Strip 攻击)
HSTS Subdomains

点击 Save。NPM 会:

  1. 向 Let's Encrypt 申请证书(HTTP-01 验证)
  2. 证书下发后自动配置到 nginx
  3. 设置 cron 任务自动续期(证书 90 天有效,NPM 在到期前 30 天续期)

⏱️ 申请耗时 30 秒 ~ 2 分钟。失败常见原因:DNS 未生效、80 端口不可达、邮箱格式错误。

验证 SSL

# 1. HTTPS 可达
curl -I https://www.yourdomain.com
# 期望:HTTP/2 200
# 2. HTTP 自动跳转 HTTPS
curl -I http://www.yourdomain.com
# 期望:301 → https://
# 3. 证书有效期
echo | openssl s_client -connect www.yourdomain.com:443 -servername www.yourdomain.com 2>/dev/null | openssl x509 -noout -dates
# 期望:notAfter 90 天后

自动化部署

参考 Github Actions 自动化部署,实现往github push代码后,自动部署到服务器。


最后

这套方案将底层运维的痛苦降到了最低,完美契合前端工程师的工作流。以后新增任何服务,只需要:本地写代码 -> Push -> 服务器 Pull -> PM2 启动(可选) -> NPM 网页点两下绑定域名。享受创造的乐趣吧!