罗昌毕前几天帮一个学弟看网页作业，他在聊天窗口直接甩过来一行地址：http://127.0.0.1:8848/25%E5%8F%B7%E5%BC%A0%E7%95%85/25%E5%8F%B7/xm3.html。我盯着看了三秒，倒不是这地址访问不了，而是它把很多新手容易忽略的事情全凑齐了：中文路径被编码成一串百分号、8848 这种不常见的端口、嵌套两层的目录、还有一个叫 xm3 的 HTML 文件。
这种“编号加姓名”的作业目录，在国内前端课上太常见了，老师们收作业时经常看到 25号张畅/25号/xm3.html 这样的结构。如果你也正在做类似的网页练习，或者拿到别人发来的本地 HTML 链接却打不开，那么这篇内容就是给你写的。我会把这串地址从外到内拆一遍，讲清楚 127.0.0.1 和 8848 端口到底是怎么回事，再带你完整复现一次“目录 → 本地服务 → 浏览器预览”的流程，最后把最常见的报错和排查思路整理出来。看完之后，你至少能自己解决九成的本地网页预览问题。
1. 先拆地址：作业目录、URL 编码和文件命名里的门道
拿到一个网址，别急着复制粘贴，先看结构。这个地址拆开其实只有三段关键信息：127.0.0.1:8848 是服务的入口，/25%E5%8F%B7%E5%BC%A0%E7%95%85/25%E5%8F%B7/ 是服务器上的目录路径，xm3.html 是我们要打开的文件。最后一段很直白，前两段则需要稍微翻译一下。
1.1 “25号张畅”是什么：课堂作业归档的典型命名
以我接触过的无数份学生作业来看，25号张畅 这种命名方式大概率来自课程作业归档。老师为了方便统计，通常会要求“学号或序号 + 姓名 + 项目序号”作为文件夹名，比如 25号张畅 就是第 25 号学生张畅的作业目录，里面的 25号 可能是一次次迭代留下的子文件夹，也可能是班级分组后的目录，xm3.html 大概率就是“项目三”或“练习三”的页面文件。
如果你自己写作业，我也建议保留这种清晰的归档习惯。因为到了期末，老师往往要在几十个目录里批量找文件，如果你把文件名起成 新建文档(3)(最终版)(真的最终版).html，不光老师头疼，你自己过一个月再回来找也会头疼。HTML 项目里，文件名的命名最好能做到“见名知意”，比如 index.html、about.html、contact.html，而不是一堆 xm1.html、xm2.html。但既然作业已经这么命名了，路径对不对、能不能被服务器找到，才是我们接下来要解决的事。
1.2 %E5%8F%B7 是“号”的另一种写法：URL 编码原理
地址中间那一段 25%E5%8F%B7%E5%BC%A0%E7%95%85，很多新手第一次看到会以为是乱码，其实它是中文的 URL 编码结果。URL 的标准规定路径里只能出现字母、数字和少数符号，中文这种非 ASCII 字符必须转换成特定格式才能放进 URL，这个转换过程叫百分号编码，也叫 URL 编码。
以“号”字为例，它在 Unicode 字符集里的码点是 U+53F7，经过 UTF-8 编码后得到三个字节：E5 8F B7，每个字节前面加上百分号，就成了 %E5%8F%B7。所以 25号 在 URL 里就显示为 25%E5%8F%B7。同理，张 对应 %E5%BC%A0，畅 对应 %E7%95%85。整段地址还原过来就是：
| 字符 | UTF-8 字节（十六进制） | URL 编码结果 |
|---|---|---|
| 号 | E5 8F B7 | %E5%8F%B7 |
| 张 | E5 BC A0 | %E5%BC%A0 |
| 畅 | E7 95 85 | %E7%95%85 |
浏览器在地址栏里输入中文路径时会自动完成这个编码过程。你手动输入全中文地址也能访问，是因为浏览器帮你把汉字转成了右边的形式再发给服务器。知道这个原理对排查问题很有用：当网页报 404，而地址栏里是半截中文、半截百分号时，通常就是复制链接时把编码弄坏了，或者服务器上的文件名和 URL 里的编码对不上。
1.3 为什么是 xm3.html 而不是 index.html
服务器默认打开目录时会找 index.html，但这里地址明确写的是 xm3.html，说明这是一个需要被直接访问的具体页面。很多初学者会忽略文件名的作用，其实文件名决定了 URL 的最后一层路径。如果老师要交三个练习，分别叫 xm1.html、xm2.html、xm3.html，那就必须通过完整的文件名来区分。另外，我也建议在同一个目录里放一个 index.html 作为入口页，再从入口页链接到其他页面，这样访问目录根路径时就不会看到一屏文件列表，体验会专业很多。
需要模型API调用？ 免费领10W Token，多模型网关一键接入 Claude、DeepSeek 等主流模型。
2. 127.0.0.1 和 8848 端口：本地网页预览的第一堂原理课
为什么我们不直接双击 HTML 文件，而非要搞出 http://127.0.0.1:8848 这样的地址？因为网页生来就是给“服务器 + 浏览器”这对组合用的。这里涉及两个基本概念：本机回环地址和端口。
2.1 127.0.0.1 是“自己家的信箱”
127.0.0.1 是 IPv4 协议里专门保留的回环地址，所有发往这个地址的请求都不会离开你的电脑，只会回到你自己的网卡上。你可以把它理解成“自己家