Github部署静态企业官网

GitHub是一个面向开源及私有软件项目的托管平台，因为只支持Git作为唯一的版本库格式进行托管，故名GitHub。GitHub于2008年4月10日正式上线，除了Git代码仓库托管及基本的Web管理界面以外，还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱（报表）、代码片段分享（Gist）等功能。目前，其注册用户已经超过350万，托管版本数量也是非常之多，其中不乏知名开源项目Ruby on Rails、jQuery、Python等。2018年6月4日，微软通过75亿美元的股票交易收购代码托管平台GitHub。写这段话的目的是想告诉你：把你的网站放在Github，你不用担心出现像某宝上的主机商那种停机跑路的可能性。

静态网页是指全部由HTML代码格式页面组成的网站，所有的内容包含在网页文件中。网页上也可以出现各种视觉动态效果，如Gif动画、Flash动画、滚动字幕等，而网站主要是静态化的页面和代码组成，一般文件名均以htm、html、shtml等为后缀。静态网页的“静”表现在它没有数据库的支持，不需要调取数据库，即使网页中存在“动”的效果，也是基于JavaScript等实现的。

依照传统的做法，搭建一个网站需要购买域名、租用服务器（可以是云主机、VPS、虚拟主机）、配置网站程序等等。今天我们只需要一个独立域名，如果你不介意三级域名的话，甚至连域名的钱都可以省了。

---

关于展示用的测试网页，我是从网上随机找了一个。这个网页就一个页面，基于Bootstrap自适应，看起来比较适合于某一个项目展示用。

实现这个网页用到了下面这些文件，总共874KB，除此无他。

---

第一步：注册Github账户

首先，你需要到Github的官网注册一个属于自己的账户，个人免费版本就行。

第二步：创建Github仓库

然后，你需要在你的账户下创建一个Github仓库，用来存放你的代码（你的网页文件就是放在这个仓库里）。

输入，仓库名称（Repository name）→选择公开（Public）→创建README文件（Add a README file）→点击“Create repository”创建仓库。

继续，点击设置（Setting）选项。

往下滚动网页，直到Github Pages。

在Source模块下点击None，换成main，即将仓库中的分支选择为main（这里也可以是master，没有区别），并点击Save保存。

此时，其实你已经在Github中完成了一个属于自己的网页的创建，我这里生成的链接是https://tongliyang.github.io/static-web-page/.

这个网页看起来很简单，就是通过上面的操作完成的。

第三步：将测试网页及附件推送到仓库中

这里需要借助一个叫GitHub Desktop的工具，点击链接下载安装到你的电脑中。

打开新安装的GitHub Desktop工具后，先将线上仓库同步到本地。

选择，线上仓库（GitHub.com）→你的仓库（Your repository）→本地路径（Local Path）→克隆（Clone）。

点击“Clone”后，稍等一会，即可将线上仓库同步到你的电脑中。

待克隆线上仓库完成，将测试用的网页素材，拷贝到你本地电脑的Github目录下。

在GitHub Desktop工具中，全选已拷贝完成的素材，并在Summary(required)栏中填写更新摘要信息，然后点击“Commit to main”。

正在向线上仓库推送。

在线上仓库中，看到推送成功的效果。测试用的网页素材，已经全在刚刚新建的Github线上仓库static-web-page里面了。

这时，在浏览器输入https://tongliyang.github.io/static-web-page已经可以看到测试用的网页展示了。这个链接的结构是：https://Github用户名.github.io/仓库名/

到这为止，咱们已经将一个企业“官网”成功部署到Github上了，一分钱没花，而且也不担心后期续费。唯一有个槽点就是这个网址怎么看都不像是一个企业的“官网”。

关于这个问题，咱们继续往下看。我们可以将自己的域名与Github的三级域名“捆绑”起来，让访问咱们企业官网域名的请求，自动解析到Github的三级域名上。

第四步：域名解析

还是在Github Pages设置页面，里面有个Custom domain，即用户的域名。在栏目中输入你的域名，并点击Save保存。

同时，还需要在你的域名服务商的控制面板中，给你的域名添加CNAME解析，解析到Github的三级域名上。Github的三级域名的结构是：用户名.github.io

做CNAME解析的时候，你需要像我下图这样，添加两条解析记录，分别是@.yourdomain.com和www.yourdomain.com，表示访问你的域名不管是否带www都解析到同一个地方。当然，这一点你可以自己视情况而定。

现在，你可以出去抽一根烟，等待解析生效，等待GitHub验证生效。

大约10分钟后，再次回到Github Pages设置页面，参照下图勾选“Enforce HTTPS”，即强制HTTPS，这将会给你的域名一个免费的SSL证书。是不是意外的惊喜？还送你SSL证书，你的网址还可以带安全锁标识呢！

最后，在浏览器输入你的域名（例如本文测试网址https://www.jtxqj.cn/），回车！见证最后的奇迹吧！

---

原创不易，转载请注明出处。原标题：Github部署静态企业官网，原文章链接：https://ieclub.net/experience/2020/11/12/1483.html