GitHub：页面基础

0. 目录

---

1. 什么是GitHub页面？

GitHub Pages是一个静态网站托管服务，不支持服务器端代码，如PHP，Ruby或Python。

GitHub Pages用于直接从GitHub存储库托管个人、团队或项目。

此外，可以使用Jekyll Theme Chooser在线创建和发布GitHub页面。如果倾向于在本地工作，则可以使用GitHub Desktop或命令行。

---

2. 配置GitHub页面的发布源

通过修改以下源文件可以配置GitHub的页面：master，gh-pages，/docs。

如果站点名为.github.io ，则.github.io不能从其他位置发布站点的源文件，只能从master分支发布。

2.1 没有用户命名方案的存储库的默认设置

从哪个源文件发布站点取决于站点类型和站点存储库中的分支。

如果站点存储库没有master或gh-pages分支，则GitHub页面发布源设置为无，网站不发布。

创建master或gh-pages分支后，可以将其中一个设置为发布源，用于发布网站。

2.2 从master或gh-pages发布GitHub页面

步骤 截图 在GitHub上，进入GitHub Pages仓库 点击Settings 在Source下拉列表中选择master或gh-pages作为GitHub网页的发布源 点击Save

2.3 从/docs发布GitHub页面

从/docs发布GitHub页面，存储库需满足以下条件：

• /docs在存储库的根目录中有一个文件夹
• 不遵循存储库命名方案.github.io或.github.io

GitHub Pages将从/docs文件夹读取发布的网站内容。

提示：通过GitHub页面设置编辑自定义域时，自定义域将写入/docs/CNAME。如果/docs在master分支启用后从分支中删除该文件夹，则网站将无法发布成功，并且会为缺少的/docs文件夹生成页面生成错误消息。

步骤 截图 进入GitHub Pages仓库 在master分支所在的存储库的根目录中创建一个/docs文件夹 点击Settings 点击Source下来列表选择master或/docs作为Github页面的发布源 点击Save

---

3. 用户、组织和项目页面

3.1 GitHub页面类型

GitHub页面有两种基本类型：用户/组织页面和项目页面。它们几乎完全相同，但有一些重要的区别。

GitHub在2016年6月15日之后创建并使用github.io域的页面通过HTTPS提供。

注意：Pages在发布后始终可公开访问。

GitHub页面类型的网站 在GitHub上页面默认的域名和主机位置 用于构建页面站点的源文件的位置 用户页面的网站 username.github.io master 组织页面的网站 orgname.github.io master 项目页面网站拥有一个用户帐户 username.github.io/projectname master，gh-pages或/docs中的master 项目页面网站由一个组织拥有 orgname.github.io/projectname master，gh-pages或/docs中的master

3.2 用户和组织页面

用户和组织页面位于专用于GitHub页面文件的专用存储库中。需要使用帐户名称命名该存储库。

• 必须使用username.github.io命名方案。
• 将用master分支的内容来构建和发布GitHub Pages网站。

当用户页面建立时，可以通过http(s)://.github.io格式的URL访问。

构建您的用户和组织页面

用户页面可以由具有验证的电子邮件地址的任何用户帐户构建。他们还可以使用部署密钥来自动执行该过程。

组织页面可以由任何成员建立，具有对存储库的推送访问权和经过验证的电子邮件地址。要自动构建，可以将机器用户设置为组织的成员。组织页面不支持部署密钥。

3.3 项目页面

“ 项目页面”与其项目保存在同一个存储库中。个人帐户和组织都可以创建项目页面。个人帐户的项目页面http(s)://.github.io/的URL将是“http(s)://.github.io/”，而组织的URL将是“http(s)://.github.io/”。两个创建项目页面的步骤是相同的​​。

项目页面与用户和组织页面类似，只是略有不同：

• 可以从master或gh-pages分支生成和发布Project Pages网站，也可以从分支/docs上的文件夹发布网站master。
• 如果没有使用自定义域，则Project Pages站点将在User Pages站点的子路径下提供服务：username.github.io/projectname
• 如果在用户和组织页面网站上使用自定义域，则自定义域将替换username.github.io为该帐户下托管的所有“Project Pages”网站的网址。项目页面使用自定义域的网站也可以是username.github.io/projectname或orgname.github.io/projectname
• 自定义404只有在使用自定义域时才有效。

注意：如果网站的URL包含以破折号开头或结尾或包含连续破折号的用户名或组织名称，则使用Linux系统浏览网站的用户在访问该网站时将收到服务器错误。

---

4. 使用命令行创建项目页面

4.1 克隆

要建立一个Project Pages站点，需要在仓库中创建一个新的“孤立”分支（一个没有共享现有分支历史的分支）。最安全的方法是从一个新的克隆开始：
$ git clone https://github.com/ user / repository .git

4.2 创建master分支

1. 将目录切换到刚刚克隆的存储库中：$ cd 存储库
2. 检查刚刚克隆的仓库中是否已经有一个master分支：$ git branch
3. 如果没有master分支，则新建一个：$ git checkout --orphan master

提示：步骤3之后，使用步骤2的分支检查命令，分支列表不会显示master分支。对master分支第一次提交后，使用步骤2的命令分支列表才会显示master分支。

4.3 删除所有文件创建一个空的工作目录

<code>$ git rm -rf</code>

4.4 添加内容并推送

echo“My Page”> index.html git add index.html git commit -a -m“第一页提交” git push origin master

4.5 加载GitHub页面网站

在推送到master分支之后，Project Pages站点将可以通过“http(s)://.github.io/“访问。

---

5. 使用HTTPS保护GitHub页面网站

启用HTTPS强制执行后，对GitHub Pages网站的HTTP请求将被重定向到HTTPS。使用自定义域名的GitHub页面不支持HTTPS。

步骤 截图 进入存储库主页面 点击Settings 在GitHub Pages中，选择Enforce HTTPs

解决混合内容的问题：

如果为网站启用了HTTPS，而且网站的HTML仍然通过HTTP引用图片，CSS或JavaScript，那么网站将提供混合内容，可能在加载资源时会遇到问题。提供混合内容也会使网站不太安全。

要删除网站的混合内容，提高网站的安全性，并解决与加载混合内容相关的问题，请修改网站的HTML文件并更改http://为https://使所有内容通过HTTPS引用。

类型 HTTP HTTPS CSS <link rel="stylesheet" href="http://example.com/css/main.css"> <link rel="stylesheet" href="http://example.com/css/main.css"> JavaScript <script type="text/javascript" src="http://example.com/js/main.js"></script> <script type="text/javascript" src="https://example.com/js/main.js"></script> 图片 <A HREF="http://www.somesite.com"><IMG SRC="http://www.example.com/logo.jpg" alt="Logo"></a> <A HREF="https://www.somesite.com"><IMG SRC="https://www.example.com/logo.jpg" alt="Logo"></a>

---

6. 取消发布Project Pages站点

要取消发布GitHub Project Pages站点，直接删除gh-pages项目存储库中的分支。

---

7. 取消发布用户页面站点

要取消发布用户页面网站，直接删除master分支或username.github.io存储库。

---

8. 参考资料

https://help.github.com/categories/github-pages-basics/