从电脑上的文件到公开链接

页面已经做好，在浏览器里打开着。看起来像个网站，用起来也像网站：链接能点，按钮能按。您把它发给别人，对方回复"打不开"。或者能打开，但没有样式和图片。其实什么都没坏。页面只存在于一个地方，在您自己的硬盘上，浏览器的地址栏其实已经说明了这一点 - 只是需要知道该看哪里。

"怎么把网站发布到互联网上"这个问题，听起来像是有个按钮等着您去找。换个问法更有用：网站要放在哪里，才能不只是我一个人看得到？答案要一块一块拼出来：服务器、两种地址、path、托管和部署。再往后是怎么更新已发布的内容、托管服务为什么需要密钥，以及您让智能体"发布一下"时它具体做了什么。

1. 文件只活在一台电脑上

页面从硬盘打开的时候，看一眼地址栏。那里不是链接，是文件路径：

file:///C:/projects/landing/index.html    # 您硬盘上的文件路径
https://landing-demo.tiiny.site/          # 另一台电脑上的地址

第一行是您的硬盘。浏览器在这里就是个查看器：打开文件，读一下，显示出来，没往网络上跑一步。第二行是另一台电脑的地址。前者只有您自己能打开，后者任何联网的设备都能打开。

"打不开"的原因就在这儿。发送文件和发布页面是两码事。页面通常不是一个文件，而是一个文件夹：index.html，旁边还有 style.css 和图片。只发了一个 index.html - 收件人那边能打开，但样式和图片没地方去找。这就是"打得开，但是乱"。

还有第二个限制，更简单。晚上您合上笔记本电脑，装进包里带回家。好了，它睡着了，什么都发不出去了。要让所有人随时都能看到页面，文件就不能只放在您这儿。

"在我这儿能跑"和"大家都能打开"是两种不同的状态。下面就来讲讲这两者之间隔着什么。

2. 服务器

关键词是服务器。它不是什么带指示灯的神秘箱子，就是一台一直开着、负责把文件发给别人的电脑。它存在的全部意义就是：您不在的时候也一直在线。

看起来好像没有服务器也能行。您用即时通讯软件给朋友发一张图片 - 它是直接从您手机飞到对方那儿的吗？不是。它先落到即时通讯软件的服务器上，再从那儿转给朋友。所以您可以发完就关机睡觉，朋友两小时后再打开也能看到。服务器就在中间，只是您看不见它。

对页面来说结论一样：要让所有人都能看到，文件就得放在这样一台机器上。互联网不是什么东西自己飘进去的公共云，而是另一台不睡觉的电脑。刚听到这个说法可能会有点失望，太朴实了。但这样一想就都清楚了。

3. 域名和 IP

世界上有很多服务器，得有办法找到需要的那一台，靠的是地址。服务器有两种地址，跟普通住宅一样：坐标和门牌。

IP 是第一种。像 192.0.2.1 这样的数字地址：精确，但对人来说不好记，就是一串裸坐标。计算机之间正是靠这个互相交流。

域名是第二种，给人看的名字，像 example.com。这就是门牌：您不会跟朋友说"在坐标五十点四五、三十点五二的那栋楼见"，您会说"街角那家咖啡馆见"。

192.0.2.1        # IP：服务器的数字地址，给机器用
example.com      # 域名：同一个地方，给人用的名字

两者怎么对上号：您输入名字，浏览器先去问名字对照表，这个名字背后是哪个 IP，然后才按数字去找。这个对照表叫 DNS，现在只需要知道这些就够了：您输入名字，剩下的自动完成。

地址里还有一部分很容易被忽略：开头的 https://。它不是名字的一部分，而是一种连接方式：和服务器的通信是加密的。浏览器标示的方式各不相同，但没有 s 的 http://，所有浏览器都会标成不安全。加密由托管服务自己提供。

4. Path 和默认文件

服务器上通常放着一大堆文件。具体要哪一个，由 path 决定 - 这是地址里域名后面的那部分路径。如果域名是一栋楼，path 就是楼里的哪个柜台。

地址是从左往右读的，它不是什么魔法字符串，而是三个答案。https://example.com/about/team.html 的意思是"在服务器 example.com 上打开文件 about/team.html"。

Path 就是服务器磁盘上那个文件的路径：about 文件夹，里面是 team.html，跟您电脑上文件夹的路径是一回事。大网站的页面往往是即时生成的，但逻辑一样：地址指向一个具体的位置。

那 path 是空的怎么办？您输入 https://example.com/ - 该打开哪个文件？答案早就定好了：服务器会发出网站根目录下的 index.html，几乎所有托管服务都这么做。由此得出一条很快就会用到的规则：index.html 要放在您发布的那个文件夹的根目录，不能放在嵌套的子文件夹里。

5. 完整路线

现在所有部分都到位了，可以串成一条链。

您输入地址。浏览器向名字对照表查询这个域名对应的 IP，然后连接服务器，服务器按 path 找到文件并发出来。浏览器拿到的是同一份 HTML 文本，跟放在您硬盘上的没什么两样，接着把页面画出来。

关键在这里：不管文件是从硬盘来的还是从服务器来的，浏览器绘制排版和样式的方式都一样。区别在于还有谁能拿到这个文件。不过浏览器对本地磁盘上的 JavaScript 会有一些限制，所以同一个页面在服务器上有时反而比本地跑得更完整。

6. 托管

您没有数据中心里的服务器，也不需要有。有托管服务就够了 - 相当于租一台服务器：您把装着页面的文件夹交给它，它把文件放到自己那台一直开着的服务器上，然后返回一个公开链接。就这么简单。

链接会用托管服务自己的域名，您的名字排在前面：landing-demo.tiiny.site、名字.github.io。域名属于托管服务，您得到的是域名前面那一段：有时候是您自己选的，有时候是托管服务直接分配的。用自己的域名，比如 mysite.com，也可以，但它的购买和配置这里先不展开：想让页面能被打开，并不需要它。

对于由现成文件组成、不需要服务器端程序的页面（这种页面叫静态页面，是另一个话题），有些托管服务是免费的。您不用去当运维人员。

7. 部署

终于到了这篇文章一直在铺垫的那个词。部署，英文 deploy：您把自己的文件复制到一个不只是您能访问的地方 - 从您的硬盘复制到托管服务的服务器上。文件夹本身还留在您这儿，同时也出现在了那边。

部署之后，同一个文件夹存在于两个地方，链接指向右边那份。左边那份哪儿也没去，还能继续用来干活。

具体上传的是什么：

landing/
  index.html
  style.css
  img/
    hero.png

发布的是整个 landing/ 文件夹，所以 style.css 和图片依然和 index.html 放在一起，路径也不变。而 index.html 在这个文件夹的根目录里。要是发布的是上一级文件夹，链接打开的就会是一堆文件夹列表，或者一片空白。

文件夹是怎么送到服务器上的，每家托管服务都不一样。最简单的是手动方式：打开托管服务的网站，把文件夹或压缩包拖进去，点一下部署按钮。也有靠终端命令或者靠仓库的方式。本质都一样：您的文件夹在他们服务器上有了一份副本。方式还取决于谁来部署：您可以走网站，智能体则只能靠命令。

这里有两个词经常出现。本地 - 在您自己的机器上，只有您能用。对外 - 在服务器上，所有人都能用。部署是两者之间的桥，而且比听起来要短：一个文件夹，加它的一份副本。

8. 怎么更新已发布的内容

您改了 index.html 里的标题，在手机上刷新页面 - 显示的还是旧的。这是正常的。托管服务器上放的是部署那一刻的副本，而您改的是原件。要让链接显示新内容，就得把文件夹再发一次：更新其实就是再部署一次。

这里有个细节。想发到同一个地址上，前提是托管服务能认出您。由此出现两种链接。

临时链接。有些托管服务连账号都不用注册就给链接 - 方便您拿去展示和讨论。它活不了多久：比如 Tiiny Host 的临时链接大概只活一个小时。托管服务哪怕是给临时链接，也可能要您留个邮箱，这不是注册，只是想把这次上传跟点什么挂上钩。这种链接没法更新，只能换个新地址重新发布一次。

永久链接。有了账号，链接就不会消失，地址可以自己选，也能更新和删除；免费套餐通常会限制网站数量和更新次数。给临时链接的那些托管服务，账号本身也是免费的。有了账号，还会附带一个密钥，但不是每次都用得上。

如果部署是智能体做的，第一次发布和更新之间的差别，就是一句话的事：

把 landing 文件夹发布到托管服务上。需要一个能在手机上打开的链接。

我改了 index.html 里的标题。把 landing 再发一次，如果可以的话发到同一个地址。

第二个请求是诚实的。"如果可以的话"把是临时链接还是永久链接的判断交给了智能体，它会告诉您最后得到的是哪一种。智能体具体的回复我这里就不展示了：不同托管服务和不同 skill 的回复各不相同。

9. 访问密钥

托管服务的账号会给您一个访问密钥：一长串字母和数字，托管服务靠它认出您。手动操作时用不上它：您在网站上登录了账号，拖进文件夹，点了部署 - 托管服务本来就知道您是谁。密钥是智能体需要的：它不会走网站，而是用命令发送文件夹，而托管服务只能靠密钥认出命令是谁发的。有了密钥，部署会把文件放到您的永久地址上；没有它，就只能拿到临时链接。

密钥有自己该待的地方，工具会自己去那儿读取：环境变量，或者部署 skill 会自动打开、不用您操心的文件。skill 要是问密钥存在哪里，回答一个存放位置，而不是聊天里的一行字。

也有反过来的情况：密钥自己出现在对话里，是服务对智能体请求的回应。这种情况下，把它保存到该放的地方，同时记住这段对话已经见过这个密钥了。

第一次发布不需要密钥：临时链接或者通过网站上传就够了。

10. 和 Claude Code 配合时怎么运作

您让智能体"发布一下"的时候，大致会发生以下这些事。

• 智能体看一眼文件夹，发现这是由现成文件组成的页面。如果没有对应托管服务的 skill，它会提议安装一个，或者问您要发到哪里。托管服务由您来选。
• 发送是靠命令完成的。在需要智能体请求许可的模式下，命令会在运行前显示出来：里面写清楚了发送的是哪个文件夹、发到哪里，值得您认真读一遍，而不是习惯性地按"是"。要是它不请求确认 - 这种模式确实存在，而且可能从一开始就是开着的 - 请让它在发送之前先展示命令和文件夹。
• 结果是智能体回复里的一个链接。请用手机打开它检查：智能体没有第二台设备，它自己没法验证这一点。
• 更新就是同一句"再发一次"。能不能发到同一个地址，取决于托管服务能不能靠密钥认出您。认不出的话，智能体会如实返回一个新的临时链接，这不是出错。
• 临时链接需要的邮箱，智能体可以直接问您，这不是秘密。密钥不行：要是它问了，正确的回答是告诉它去哪儿读取密钥，而不是在聊天里打出那串字符。