Nginx 入门实战:十分钟把你的静态网页部署到云服务器

举报
yd_274623194 发表于 2026/10/24 12:53:04 2026/10/24
【摘要】 关键词:Nginx、静态网站部署、云服务器、Linux写了网页总不能只躺在本地 localhost 里看。最直接的上线方式,就是找一台云服务器(ECS),装上 Nginx,把静态文件往服务器上一放,别人就能通过公网 IP 访问了。这篇文章带你从零走一遍全流程:安装、启动、放页面、改配置、常用命令,全是实操。 一、准备工作一台 Linux 云服务器(本文以常见的 CentOS / Ubuntu...

关键词:Nginx、静态网站部署、云服务器、Linux

写了网页总不能只躺在本地 localhost 里看。最直接的上线方式,就是找一台云服务器(ECS),装上 Nginx,把静态文件往服务器上一放,别人就能通过公网 IP 访问了。这篇文章带你从零走一遍全流程:安装、启动、放页面、改配置、常用命令,全是实操。

一、准备工作

  • 一台 Linux 云服务器(本文以常见的 CentOS / Ubuntu 为例)
  • 服务器安全组放行 80 端口(HTTP)
  • 一个写好的静态页面,比如 index.html

二、安装 Nginx

Ubuntu / Debian:

sudo apt update
sudo apt install nginx -y

CentOS / RHEL:

sudo yum install nginx -y

安装完成后启动并设置开机自启:

sudo systemctl start nginx
sudo systemctl enable nginx

这时在浏览器输入服务器的公网 IP,应该能看到 Nginx 的欢迎页(Welcome to nginx!)。看到它,就说明服务已经跑起来了。

三、把你的页面放上去

Nginx 默认的网站根目录是:

  • Ubuntu:/var/www/html
  • CentOS:/usr/share/nginx/html

把你写好的 index.html 复制过去即可:

sudo cp index.html /var/www/html/index.html

刷新浏览器,你的页面就上线了。就是这么简单——Nginx 默认会把根目录下的 index.html 作为首页返回。

四、看懂一份最简配置

Nginx 的核心配置文件是 nginx.conf(通常在 /etc/nginx/nginx.conf),网站相关的配置一般放在 /etc/nginx/conf.d/ 或 sites-enabled/ 下。一个最简的站点配置长这样:

server {
    listen 80;
    server_name 你的公网IP或域名;

    root /var/www/html;
    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }
}

逐行解释:

  • listen 80:监听 80 端口(HTTP 默认端口)
  • server_name:匹配访问的域名或 IP
  • root:网站文件的根目录
  • index:默认首页文件名
  • location /:所有请求都走这个规则,try_files 表示按顺序找文件,找不到就返回 404

五、改完配置一定要做的两件事

1. 检查配置语法:

sudo nginx -t

输出 syntax is ok 和 test is successful 才算过关。很多人改完配置直接 reload,结果语法写错导致服务起不来——先 -t 是个好习惯。

2. 重新加载配置:

sudo systemctl reload nginx

reload 是平滑重载,不会中断正在访问的用户。注意它和 restart 的区别:restart 会先停再起,有短暂中断。

六、常用命令速查

命令 作用
sudo systemctl start nginx 启动
sudo systemctl stop nginx 停止
sudo systemctl reload nginx 平滑重载配置
sudo nginx -t 检查配置语法
sudo systemctl status nginx 查看运行状态
tail -f /var/log/nginx/error.log 实时看错误日志

出问题先看日志,error.log 能解决 90% 的部署疑问。

七、一个小进阶:反向代理

如果你的后端服务跑在本地的 3000 端口,想让 Nginx 把请求转发过去,只需加几行:

location /api/ {
    proxy_pass http://127.0.0.1:3000/;
}

这样前端访问 /api/xxx 时,Nginx 会默默转发给后端,用户感知不到两台服务的存在。这也是前后端分离项目最常见的部署姿势:静态页面 Nginx 直接 serve,接口请求反向代理到后端。

结语

Nginx 上手的核心就三步:装好、放文件、会看配置。剩下的负载均衡、HTTPS、缓存,都是在这三步之上的叠加。下次写完一个小项目,不妨亲手把它部署到云服务器上走一遍——部署能力本身,就是工程师的基本功之一。

【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0)

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。