GitHub页面基本知识

ゝ一世哀愁。 2021-09-14 14:34 327阅读 0赞

官网地址：https://help.github.com/categories/github-pages-basics/

GitHub页面是什么?  
GitHub页面是一个静态的站点托管服务。  
GitHub页面的设计目的是直接从GitHub存储库中托管您的个人、组织或项目页面。要了解更多关于GitHub网站的不同类型，请参见“用户、组织和项目页面”。  
您可以使用Jekyll主题选择器在网上创建和发布GitHub页面。如果您喜欢在本地工作，您可以使用GitHub桌面或命令行。  
GitHub页面是一个静态的站点托管服务，不支持服务器端代码，比如PHP、Ruby或Python。  
使用GitHub页面的指导方针。  
GitHub网站创建于2016年6月15日之后，使用GitHub。io域是通过HTTPS提供的。如果您在2016年6月15日前创建了您的站点，您可以启用HTTPS支持流量到您的站点。  
GitHub网站不应该用于敏感的交易，比如发送密码或信用卡号码。  
你使用GitHub的页面会受到GitHub服务条款的影响，包括禁止转售。  
警告:GitHub页面站点在internet上公开可用，即使它们的存储库是私有的。如果您的页面存储库中有敏感数据，您可能希望在发布之前删除它。  
使用限制  
GitHub页面站点受以下使用限制:  
GitHub页面源存储库的建议限制为1GB。  
发布的GitHub页面站点可能不超过1 GB。  
GitHub网站的带宽限制为每月100GB。  
GitHub页面站点的软限制为每小时10个构建。  
如果你的网站超过这些使用配额,我们可能无法提供你的网站,或者你可能会收到一个礼貌的电子邮件从GitHub支持建议策略以减少你的网站在我们的服务器上的影响,包括将第三方内容分发网络(CDN)前面的站点,利用其他GitHub特性,如发布,或移动到一个不同的托管服务,更好的满足您的需要。  
此外，GitHub网站必须避免:  
以我们的服务条款或社区准则为非法或禁止的内容或活动。  
暴力或威胁的内容或活动。  
过度的自动化批量活动(例如，垃圾邮件)  
破坏GitHub用户或GitHub服务的活动。

为GitHub页面配置一个发布源。  
您可以配置GitHub页面，以便将您的站点的源文件从主分支中发布，或者在您的主分支上的一个/docs文件夹中发布项目页面和其他满足特定标准的页面。  
如果您的站点是一个用户或组织页面，有一个名为<用户名>.github的存储库。io或< orgname > .github。io，您不能在不同的位置发布站点的源文件。具有这种存储库名称的用户和组织页面仅从主分支发布。  
有关不同类型的GitHub页面站点的更多信息，请参见“用户、组织和项目页面”。  
没有用户名命名方案的存储库的默认源设置。  
发布站点源文件的默认设置取决于站点类型和站点存储库中的分支。  
如果您的站点存储库没有主或ghpage分支，那么您的GitHub页面发布源被设置为None，而您的站点没有发布。  
none-source-setting  
在您创建了一个master或ghl -page分支之后，您可以将一个作为发布源，这样您的站点就会被发布。  
如果您使用一个主或ghpage分支来派生或上传站点存储库，那么您的站点的源设置将自动为该分支启用。  
使GitHub页面可以从主页面或ghl页面发布站点。  
要选择作为发布源的master或ghl -page，必须在存储库中拥有分支。如果您没有主或ghpage分支，您可以创建它们，然后返回到源设置来更改您的发布源。  
在GitHub上，导航到您的GitHub页面站点的存储库。  
存储库设置在您的存储库名称下，单击“设置”。  
选择源下拉菜单选择master或ghc -page作为您的GitHub页面发布源。  
click-save-next-to-source-selectionClick保存。  
从您的主分支的一个/docs文件夹中发布您的GitHub页面站点。  
要从主分支的a /docs文件夹中发布站点的源文件，您必须拥有一个主分支，您的存储库必须:  
在存储库的根目录中有一个/docs文件夹?  
不遵循存储库命名方案.github。io或< orgname > .github.io  
GitHub页面将读取所有内容，包括从/docs文件夹中发布您的站点，包括CNAME文件。例如，当您通过GitHub页面设置编辑自定义域时，自定义域将写入/docs/CNAME。  
提示:如果您在启用后从主分支中删除/docs文件夹，那么您的站点将不会构建，您将会为一个缺失的/docs文件夹获取一个页面构建错误消息。  
在GitHub上，导航到您的GitHub页面站点的存储库。  
在名为/docs的主分支上创建存储库根目录中的文件夹。  
存储库设置在您的存储库名称下，单击“设置”。  
选择源下拉菜单选择master branch /docs文件夹作为您的GitHub页面发布源。  
提示:如果/docs文件夹在主分支上不存在，主分支/文档文件夹源设置将不会显示为选项。  
click-save-next-to-master-branch-docs-folder-source-selectionClick保存。

用户、组织和项目页面。  
GitHub页面有两种基本类型:用户/组织页面和项目页面。它们几乎相同，但它们之间有一些重要的区别。  
GitHub页面创建于2016年6月15日之后，使用GitHub。io域是通过HTTPS提供的。有关更多信息，请参见“使用HTTPS保护您的GitHub页面站点”。  
提示:GitHub页面不应该用于敏感的事务，比如发送密码或信用卡号码。  
请注意，在发布时页面总是可以公开访问的，即使它们的存储库是私有的。  
GitHub页面的类型页面默认的域&主机位置在GitHub位置上，用于构建您的页面站点。  
用户页面站点username.github。io主  
网站orgname.github组织页面。io主  
项目页面站点由用户帐户username.github拥有。主服务器上的io/projectname master、ghl -pages或a /docs文件夹。  
项目页面站点由一个组织机构所有。github。主服务器上的io/projectname master、ghl -pages或a /docs文件夹。  
要了解GitHub页面网站的自定义域如何重定向，请参见这个自定义域重定向图表。  
用户与组织页面  
用户和组织页面位于专用于GitHub页面文件的专用存储库中。您需要使用帐户名称来命名此存储库。  
您必须使用username.github。io命名方案。  
来自主分支的内容将用于构建和发布您的GitHub页面站点。  
您只能为用户或组织页面存储库使用自己的帐户名称。这样的存储库乔/ bob.github。io不会构建用户页面站点。  
在构建用户页面时，可以在http(s)://<用户名>.github.io。  
构建您的用户和组织页面。  
用户页面可以由任何用户帐户建立，并有一个经过验证的电子邮件地址。它们还可以使用部署键来自动化流程。  
组织页面可以由任何成员通过访问存储库和经过验证的电子邮件地址来构建。要实现自动化构建，可以将机器用户设置为组织的成员。组织页面不支持部署键。  
项目页面  
与用户和组织页面不同，项目页面被保存在与他们的项目相同的存储库中。个人帐户和组织都可以创建项目页面。个人帐户的项目页面的URL将是'http(s)://<用户名>.github。一个组织的URL将是'http(s)://.github。io / < projectname >”。创建项目页面的步骤对两者都是相同的。  
项目页面类似于用户和组织页面，有一些细微的差别:  
您可以从主或ghpages分支构建和发布项目页面站点。你也可以在你的主分支的一个/docs文件夹中发布你的站点。有关更多信息，请参见“为GitHub页面配置发布源”。  
如果你不使用一个自定义的领域,项目页面网站服务在用户页面站点的子路径:username.github.io / projectname  
如果您在用户和组织页面站点上使用自定义域，则自定义域将替换username.github。io在该帐户下托管的所有项目页面站点的URL中。使用自定义域的项目页面站点也可以在username.github上使用。个人账户的io/projectname，以及orgname.github。io / projectname组织。  
定制的404s只有在使用自定义域时才会起作用。否则，将使用用户页404。

使用命令行创建项目页面。  
如果您熟悉命令行Git，那么手动创建项目页面站点是很容易的。  
做一个新的克隆  
要设置项目页面站点，您需要创建一个新的“孤儿”分支(在您的存储库中没有与现有分支有共同历史的分支)。最安全的方法就是从一个新的克隆开始:  
git克隆https://github.com/user/repository.git  
\#我们克隆存储库  
克隆到“库”……  
远程:计数对象:2791，完成。  
远程:压缩对象:100%(1225/1225)，完成。  
遥控:总计2791 (delta 1722)，再利用2513 (delta 1493)  
接收对象:100% (2791/2791)，3.77 MiB | 969 KiB/s，完成。  
解决delta: 100%(1722/1722)，完成。  
创建一个主分支  
一旦您拥有了一个干净的存储库，您就需要创建一个新的主分支，除非您的克隆存储库已经有了一个主分支。  
提示:您还可以为您的项目页面站点创建一个ghpage分支。要了解更多关于您的选项，包括从主分支的/docs文件夹中发布项目页面的选项，请参见“用户、组织和项目页面”。  
将目录切换到新的克隆存储库:  
光盘存储库  
检查您的存储库是否已经有一个主分支:  
git分支  
\#显示存储库的分支列表。  
\*分支名称  
\*分支名称  
如果您还没有在您的存储库中拥有一个主分支，那么创建一个新的主分支:  
git checkout,孤儿的主人  
\#创建一个主分支，没有任何父母(它是一个孤儿!)  
切换到一个新的分支“master”  
提示:如果您刚刚创建了主分支，那么当您使用git分支命令时，它不会出现在您的分支列表中，直到您第一次提交。  
删除所有文件以创建一个空的工作目录。  
一旦您拥有了一个主分支，您将需要从工作目录和索引中删除所有内容:  
git rm射频。  
从老工作树中删除所有文件。  
rm .gitignore”  
添加内容,推动  
为了在您推送到页面的存储库时触发构建，您必须首先验证您的电子邮件地址。  
现在您有一个空的工作目录。您可以在该分支中创建一些内容并将其推送到GitHub。例如:  
echo "My Page" > index.html。  
git添加index . html  
git提交- - -m“第一页提交”  
git push来源主  
您的GitHub页面现在应该可用了。如果构建失败，您将收到一封电子邮件。  
加载新的GitHub页面站点。  
在您推送到主分支后，您的项目页面站点将在“http(s)://<用户名>.github”上可用。io / < projectname >”。请注意，在发布时页面总是可以公开访问的，即使它们的存储库是私有的。  
要为GitHub网站设置一个自定义域，请参见“用GitHub页面设置自定义域”。  
联系一个人

## 使用HTTPS保护您的GitHub页面网站 ##

您可以强制HTTPS为流量添加一层加密到GitHub Pages站点，如果它有一个`github.io`域。

启用HTTPS强制执行后，您对GitHub Pages网站的HTTP请求将被透明地重定向到HTTPS。

在2016年6月15日之后创建并使用`github.io`域名的GitHub Pages网站需要执行HTTPS 。如果您在2016年6月15日之前创建了GitHub Pages网站，则可以手动启用HTTPS实施。使用自定义域名的GitHub页面不支持HTTPS。

提示： GitHub Pages网站不应该用于发送密码或信用卡号等敏感交易。

1.  在GitHub上，导航到存储库的主页面。
2.  ![存储库设置按钮][repo-actions-settings.png]在您的存储库名称下，单击  设置。
3.  ![强制HTTPS复选框][HTTPS]在“GitHub页面”下，选择强制HTTPS。

### 解决混合内容的问题 ###

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

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

对于使用Jekyll的GitHub Pages网站，您的HTML文件很可能会存储在\_layouts文件夹中。一般来说，CSS是在`<head>`HTML文件的一部分中找到的。JavaScript通常位于`<head>`结束`</body>`标记之前或之前。图像通常在该`<body>`部分中。

提示：如果您无法找到您网站中的资产，请尝试在`http`文本编辑器或GitHub上搜索您网站的代码。

#### 如何在HTML文件中引用资产的示例 ####

<table style=""> 
 <thead style="margin:0px; padding:0px; border:0px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:baseline"> 
  <tr style="margin:0px; padding:0px; border:0px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:baseline"> 
   <th align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top; color:rgb(50,93,114); background-color:rgb(238,238,238)"> <span style="margin-top:0px; margin-bottom:0px; vertical-align:inherit"><span style="vertical-align:inherit">资产类型</span></span></th> 
   <th align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top; color:rgb(50,93,114); background-color:rgb(238,238,238)"> <span style="margin-top:0px; margin-bottom:0px; vertical-align:inherit"><span style="vertical-align:inherit">HTTP</span></span></th> 
   <th align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top; color:rgb(50,93,114); background-color:rgb(238,238,238)"> <span style="margin-top:0px; margin-bottom:0px; vertical-align:inherit"><span style="vertical-align:inherit">HTTPS</span></span></th> 
  </tr> 
 </thead> 
 <tbody style="margin:0px; padding:0px; border:0px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:baseline"> 
  <tr style="margin:0px; padding:0px; border:0px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:baseline"> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <span style="margin-top:0px; margin-bottom:0px; vertical-align:inherit"><span style="vertical-align:inherit">CSS</span></span></td> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <code style="">&lt;link rel="stylesheet" href="http://example.com/css/main.css"&gt;</code></td> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <code style="">&lt;link rel="stylesheet" href="https://example.com/css/main.css"&gt;</code></td> 
  </tr> 
  <tr style="margin:0px; padding:0px; border:0px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:baseline"> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <span style="margin-top:0px; margin-bottom:0px; vertical-align:inherit"><span style="vertical-align:inherit">JavaScript的</span></span></td> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <code style="">&lt;script type="text/javascript" src="http://example.com/js/main.js"&gt;&lt;/script&gt;</code></td> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <code style="">&lt;script type="text/javascript" src="https://example.com/js/main.js"&gt;&lt;/script&gt;</code></td> 
  </tr> 
  <tr style="margin:0px; padding:0px; border:0px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:baseline"> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <span style="margin-top:0px; margin-bottom:0px; vertical-align:inherit"><span style="vertical-align:inherit">图片</span></span></td> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <code style="">&lt;A HREF="http://www.somesite.com"&gt;&lt;IMG SRC="http://www.example.com/logo.jpg" alt="Logo"&gt;&lt;/a&gt;</code></td> 
   <td align="center" style="margin:0px; padding:10px; font-style:inherit; font-variant:inherit; font-weight:inherit; font-size:undefined; line-height:inherit; font-family:inherit; vertical-align:top"> <code style="">&lt;A HREF="https://www.somesite.com"&gt;&lt;IMG SRC="https://www.example.com/logo.jpg" alt="Logo"&gt;&lt;/a&gt;</code></td> 
  </tr> 
 </tbody> 
</table>

## 取消发布Project Pages站点 ##

如果您的项目不再被维护，您可能希望取消发布您的GitHub项目页面网站。

要取消发布GitHub Project Pages站点，请删除`gh-pages`项目存储库中的分支。有关更多信息，请参阅“ [在存储库中创建和删除分支][Link 1] ”。

要取消发布用户页面站点，请参阅“ [取消发布用户页面站点”][Link 2]。

## 取消发布用户页面站点 ##

如果内容不再相关，或者不想再公开发布，则可能需要取消发布GitHub用户页面站点。

要取消发布用户页面网站，请删除`master`分支或删除您的`username.github.io`存储库。有关更多信息，请参阅“ [删除未使用的分支”][Link 3]。

要取消发布Project Pages站点，请参阅“ [取消发布Project Pages站点”][Project Pages]。

## 进一步阅读GitHub页面 ##

请参阅“ [自定义GitHub页面][GitHub] ”了解更多关于使用批准的Jekyll插件和GitHub Pages网站，创建自定义404页面以及查看可用存储库元数据的更多信息。

请参阅“ [GitHub页面构建疑难解答][GitHub 1] ”和“ [自定义域疑难解答][Link 4] ”以获取进一步的帮助。

## 后续 ##

关注我，每天都有优质技术文章推送。工作，学习累了的时候放松一下自己。

欢迎大家关注我的微信公众号:「醉翁猫咪」

![SouthEast][]

[repo-actions-settings.png]: /images/20210724/20fd9a32593040dd9419e37452bf0bf3.png
[HTTPS]: /images/20210724/cbbf82a6ddcc4ee28342a42d5cf9f3eb.png
[Link 1]: https://help.github.com/articles/creating-and-deleting-branches-within-your-repository#deleting-a-branch
[Link 2]: https://help.github.com/articles/unpublishing-a-user-pages-site
[Link 3]: https://help.github.com/articles/deleting-unused-branches/
[Project Pages]: https://help.github.com/articles/unpublishing-a-project-pages-site
[GitHub]: https://help.github.com/categories/customizing-github-pages/
[GitHub 1]: https://help.github.com/articles/troubleshooting-github-pages-builds
[Link 4]: https://help.github.com/articles/troubleshooting-custom-domains
[SouthEast]: /images/20210724/5fe4710251474679b764be6692c4180f.png