HTML5无法通过域名访问需先配置Web服务器绑定域名。Nginx需正确设置server_name、root、index及try_files;Apache需启用rewrite、AllowOverride All并赋予权限;DNS解析生效前应使用dig/nslookup验证真实IP。

HTML5源代码部署后无法通过域名访问?先确认你没跳过这步
HTML5源代码本身是静态文件,不依赖后端服务,但要通过域名访问,必须完成两件事:域名解析到服务器IP,且服务器正确响应请求。很多人把代码扔进 /var/www/html 或 public_html 就以为完事了,结果浏览器报 ERR_CONNECTION_REFUSED 或直接 404——问题往往出在 Web 服务器(如 Nginx/Apache)未配置该域名的 server 块或 VirtualHost。
Nginx 下添加域名绑定的具体配置项
以 Ubuntu + Nginx 为例,核心是新增一个站点配置文件,并启用它。关键不是“放代码”,而是“告诉 Nginx 这个域名该找哪个目录”。
-
server_name必须写全,支持多个,比如server_name example.com www.example.com;,不能只写example.com然后指望 www 自动跳转 -
root路径末尾不加斜杠,例如root /var/www/example;,否则可能触发 403 - 必须包含
index index.html index.htm;,否则访问域名时不会自动找index.html - 若用 Let’s Encrypt HTTPS,
ssl_certificate和ssl_certificate_key路径要绝对准确,且权限为644
server {
listen 80;
server_name example.com www.example.com;
root /var/www/example;
index index.html index.htm;
location / {
try_files $uri $uri/ =404;
}
}
Apache 的 VirtualHost 配置与常见权限错误
Apache 默认不启用 mod_rewrite 和 AllowOverride,即使你写了 .htaccess 重写规则,也会静默失效。HTML5 路由(如 Vue Router history 模式)尤其依赖这个。
- 确保
a2enmod rewrite已执行,且配置中AllowOverride All出现在对应块内 -
DocumentRoot路径需与实际一致,且 Apache 用户(通常是www-data)对该目录有读取权限 - 如果用
httpd.conf而非sites-enabled,记得在主配置里Include对应文件 - 修改后必须运行
sudo systemctl reload apache2,restart不必要,且可能中断连接
ServerName example.com DocumentRoot /var/www/example AllowOverride All Require all granted
DNS 解析生效前别急着查 Nginx 日志
DNS 更改后,本地 ping example.com 仍返回旧 IP 是正常现象,因为本地 DNS 缓存、运营商缓存、甚至浏览器都可能保留旧记录。此时查 /var/log/nginx/error.log 得不到有效线索。
立即学习“前端免费学习笔记(深入)”;
- 用
dig example.com +short或nslookup example.com查真实解析结果(绕过本地缓存) - 用
curl -v http://example.com看是否连得上,以及返回的Server头和状态码 - 如果返回
502 Bad Gateway,说明 Nginx 转发失败,但 HTML5 不需要后端——大概率是proxy_pass错误残留,删掉相关配置 - Cloudflare 等 CDN 开启后,务必检查 SSL/TLS 加密模式是否为 “Full” 或 “Flexible”,否则源站证书不匹配会导致连接中断
server_name 匹配是精确字符串比对,不支持通配符子域名(除非用 *.example.com 且 DNS 支持泛解析);Apache 的 ServerAlias 才能优雅处理 www 和无 www 场景。这两处写错,是最隐蔽也最常被忽略的绑定失败原因。










