从本地到全球：我的扫雷游戏上线记

这周我把写好的“扫雷”挂到了网上，并顺便给我的个人博客引了一波流。原本以为买完域名（其实也没买）、写好代码（其实也没写）就大功告成了，实际操作下来发现，从“本地自嗨”到“全球可访问”，还是有几个坑要踩的。今天把这套** Netlify + Cloudflare **的发布方案复盘一下。

P.S. 欢迎大家来尝鲜，试试我的扫雷小游戏：）

网址如下： https://readeverything.dpdns.org

如果你在扫雷时发现了 Bug，欢迎直接吐槽！！

下面我们一起来具体看看吧！

以前我觉得发布网页得买那种按年计费的云服务器，还得折腾 Linux 命令行。但这次我选了 Netlify。

只要我们选择hobby版本，基本正常使用完全不会扣费，所以这一点还是很吸引人的。

Netlify的逻辑非常粗暴：你把写好的 index.html（连带 CSS 和 JS）塞进一个文件夹，直接往网页上一拖，它就自动给你生成一个预览网址。

我有自己的域名，但为了省心，我把 DNS 托管交给了 Cloudflare。

在 Cloudflare 里设置 CNAME 记录指向 Netlify 的地址，不仅是为了好记，最重要的一点是：安全和加速。开启了那朵“小橘云”（Proxy）后，全球各地的访问速度都稳了很多，而且它自带的免费 SSL 证书解决了浏览器那个烦人的“不安全”警告。

小插曲：刚开始 SSL 报错，后来发现得把 Cloudflare 的加密模式改成 Full (Strict) 才能和 Netlify 完美兼容。

既然想让更多人搜到，那就得按搜索引擎的规矩办。我在 <head> 里塞了一堆 Meta 标签，还顺手撸了一个 sitemap.xml。

虽然我的扫雷只是个单页面应用，但有了站点地图（Sitemap），Google 的爬虫就像有了地图，收录速度快了不少。

最好还配一个“robot.txt”文件，让抓取机器人更容易发现你！！

实例放在这里：（仅供参考）

User-agent: * Allow: /

Sitemap: https://www.yourdomain.com/sitemap.xml

前期是配置好sitemap，并替换自己的域名！

发布一个项目最爽的瞬间，不是代码运行成功，而是在手机浏览器输入域名，看到那个熟悉界面跳出来的时刻。

如果你也想折腾点好玩的小工具，别等代码完美了再发布。先推上线，让 Bug 在阳光下跑一跑，这才是独立开发的乐趣。

附上一张小截图！

小截图

随着AI 技术的火速发展，代码，技术再也不是那”可悲的厚障壁“，AI的春风让我这样的电脑小白，也可以借助智能的力量”扶摇直上“，用自然语言在计算机的虚拟世界中转化为实实在在的新成就！