001:搭建个人网站的踩坑之旅与个人经验[科普篇]

网络本质上不过是多个计算机通过物理或无线链路连接在一起,搭建个人网站其实并不复杂,只是如今的网络环境使个人想要搭建一个能被公共网络访问的站点十分困难。但无论网络如何发展,搭建个人网站所需的基本元素不会变,我将其简化为:

资源+仓库+网络+域名(可选)

首先,个人网站是一组静态或者动态的文字、图片和图形等元素的组合,无论你用什么语言来编写个人网站,其本质与您本地设备中存储的文件没有区别。以比较基本的html语言为例,无论是从网络上访问还是在本地用浏览器打开编写好的index.html文件,甚至是通过通讯软件把index.html发给对方然后在对方的计算机上打开,其展现的内容没有差别。网络所做的事,不过是把您的资源分享给远方的朋友。

001

图1 回归最原始

因此,搭建个人网站的第一步就是要在本地创建一系列网站的资源,在我写这篇文章时,wordpress、Hexo、Hugo等都可以运用模板创建精美的个人网站,我尝试过以上的三个方案,但最终都会在一些莫名其妙的地方遇到问题,比如node的版本太新(没错就是太新)、一些和资源服务器的网络连接问题等等等等。我并不是专业学习这些方面的人,我想有很多小白也和我一样,想要拥有网站只是自己的业余爱好,即使有足够的毅力去克服这些问题,也无法战胜过于庞大的前置知识,而且很多问题在网络上根本搜不到解决方案。对此,我的方法是:

回归本质,自己使用html编写静态网页

我们使用现有模板时遇见的问题不一定能搜到解决方案,但是现在强大的AI资源完全可以辅助一个零基础的小白(比如我)从无到有编写自己的网页,这个网页就是在AI的辅助下完成的,我首先用AI生成了网页主体的排版,然后自己观察其中的结构,经历“模仿-尝试-创新-碰壁-搜索-解决”这些顺序,从模仿开始,不断的加一些自己想要的东西,在这个过程中形成对html语言的感性理解。我想这才是学习一门语言(无论是自然语言还是计算机语言)的正确方式,我们学习中文也是从牙牙学语开始,从模仿开始,如果一上来就给初学语言的人撂下几十个小时的系统课程,我想也失去了以搭建网站作为兴趣爱好的初心,失去了继续学习的积极性了,而后者正是我们在学习时半途而废的最大原因。

002

图2 AI帮忙写的排版(示意图),这样我就有更多精力专注在文章内容上,等以后再设计自己的排版

有了自己的网站资源之后,我们再来谈谈仓库,它可以是你自己的计算机,也可以是专门的服务器,或者托管在其他的云服务提供商上。所有这些方案本质上没有区别,都是找了一个计算机存储你的网站资源,但不同的计算机接入的网络不同,其他用户想要访问的方式也不同,这是各种仓库最大的区别。

首先是自己的设备和专门的服务器,他们都需要通过有线或无线的方式接入公共网络,在写下这篇文章的时候,大多数家庭是入户网线-路由器-您的多个网络设备的方案。您的多个网络设备以路由器为中心,搭建起了内部网络,而因为只有路由器接入了公共网络,内部网络的所有数据要通过路由器才能进入公网,他人通过公共网络访问您的资源时,由于中间有多层结构,无法直接访问到内网的资源,这种网络和仓库的组合只能允许在您的内部网络中的设备访问您的资源,并不能很好的满足我们的要求。

另一种常见的方案是内网穿透,其原理是在您内网中的设备与公网中的服务器之间搭建桥梁,他人通过访问公网中的服务器来访问您的资源。其缺点在于公网中服务器的维护费用导致大多数内网穿透的服务商在免费和好用两者之间不可兼得,而且这需要您自己的电脑24小时开机来确保无论他人何时访问都可以访问到您的仓库。

003

图3 其中红线代表搭建的桥梁

我曾经使用过樱花Frp和Zerotier两种方案,这两种方案各有优缺点,樱花Frp的优点是能给出公网的ip和端口号,他人可以直接访问,也可以把给出的ip和端口解析到您自己的域名下方,缺点是免费版在某些特定时间比较拥挤,当然您也可以使用付费版;Zerotier方案的优点是非常稳定,但缺点是没有位于公网的服务器搭建桥梁,而是通过虚拟组网的方式,直接在用户之间搭建桥梁,组成虚拟的内部网络,这要求用户必须在加入您的虚拟组网后才能访问资源,没有加入虚拟组网的用户不能访问。它更适合固定设备之间的通信,比如几个朋友之间的游戏服务器。

当然前面也提到过,所有内网穿透的共同缺点还有您的仓库必须24小时开机,这是非常不方便的。因此您可以使用云服务商提供的的云服务器,他们和您的电脑本质上没有区别,但是多数云服务器都直接在公网中,不需要进行内网穿透即可访问,缺点在于云服务器的价格非常昂贵,如果只是建站的话性能也会过剩,并且国内的服务器建站需要备案。截至这篇文章更新,最便宜的云服务器方案也要99CNY/年(阿里云)

那么有没有既经济又方便的方案呢?有的兄弟,有的。Github和CloudFlare等都推出了个人网站的免费托管服务,先前国内的Gitee也提供过,不过这篇文章发布时已经关闭了。在这两种方案中,github在国内的访问时好时坏,虽然在这篇文章发布时他的访问良好,但不能保证之后不出差错。使用CouldFlare的托管服务是目前比较稳定的方案,本网站就是使用的CloudFlare的托管,它的本质就是直接把你的资源放在CloudFlare的服务器上,他人通过访问CloudFlare来访问你的资源,因此不需要您的电脑保持24小时开启。

004

图4 我用来储存网站的github仓库,本质都是存放资源的仓库,与您个人计算机在搭建网站的过程中发挥的作用相同

最后就是域名了,虽然使用仓库对应的ip地址或者托管平台自动分配的域名也可以直接访问您的资源,但这些ip或者自动分配的域名非常难记,也无法体现自己的个性。我们可以在阿里云、腾讯云、namesilo等域名经销商处购买域名(国内的经销商的域名需要实名购买),跟据域名后缀不同价格也有不同,购买完域名后将域名解析到对应的ip地址或者自动分配的域名就好了。域名就相当于我们给自己的资源地址起了一个昵称,他人只需访问这个昵称,浏览器就知道去访问对应的地址了。

感谢您阅读到这里,如果文章中出现错误请指出,欢迎提出这篇文章在叙述上的不足之处,具体的实操篇将在后续更新。

2025年1月29日