Fork me on GitHub

在GitHub Pages上使用CloudFlare的免费SSL指南


github.png

GitHub提供了一个虚拟主机服务,您可以从一个GitHub仓库提供静态网站。这个平台,GitHub页面,可以与CloudFlare一起使用,同时使用自定义域名。
在本教程中,我将向您展示如何一起使用CloudFlare和GitHub。通过利用CloudFlare的全球网络,您可以利用我们的CDN服务来提高您网站的性能和安全性。
虽然GitHub Pages通常不支持自定义域上的SSL,但CloudFlare的通用SSL允许用户通过SSL访问您的站点,从而打开HTTP / 2的性能优势。

GitHub页面被设计为托管只提供静态HTML的网站。只有托管静态内容的能力并不像您想象的那么大。
静态网站生成器避免重复更新“最新的帖子”饲料,分页或网站地图的更新任务; 同时生成静态的HTML,可以上传到任何虚拟主机服务没有脚本引擎。与缺乏内容模型的FrontPage和Dreamweaver等古老的桌面工具不同,现代静态站点生成器的设计与内容明显分离。
通常情况下,基于CMS的网站必须向数据库查询内容,然后将HTML呈现给最终用户。这一切都是为了在请求后为请求提供相同的内容。即使使用缓存,这种组合对于只有管理员更改内容的站点来说也不是很好。
对于静态网站,Web服务器只需要向最终用户提供静态HTML。这具有深远的性能优势; 静态网站走动,而动态网站爬行。在此之上,跟踪Git存储库中所有站点更改的功能在协同编辑时可以更好地控制。
静态网站没有CMS,没有数据库; 只是HTML。无需担心修补PHP或插件与不安全的数据库查询。
明显静态的网站不能做任何事情,即任何动态的; 尽管你可以利用JavaScript API添加一些动态功能,如果这是你想要的路线。

第0步:设置我们的DNS

我假设你已经注册了一个域,并将其添加到你的CloudFlare帐户
为了让GitHub接受来自这个域的流量,我们需要在我们的仓库中创建一个CNAME文件,其中包含主机名来接受流量。

以下规则适用:

  • 如果CNAME文件包含example.com,那么www.example.com将重定向到example.com。
  • 如果CNAME文件包含www.example.com,则example.com将重定向到www.example.com。

在我们上一节创建的Git仓库中,让我们添加一个CNAME文件到该仓库并提交我们的更改:

echo "www.ju.je" > CNAME      
git add -A  
git commit -m “Added CNAME file.”  
git push origin master

我们可以添加记录,将我们的DNS记录指向我们的GitHub网页帐户:
cloudflare-dns.png
您可以从GitHub Pages文档中找到最新的IP地址

第1步:SSL的模式

不幸的是,GitHub Pages还不支持GitHub页面上的自定义域,通常会排除使用HTTP / 2。虽然HTTP / 2规范(RFC 7540)允许通过纯文本HTTP / 2的HTTP / 2,但所有流行的浏览器都要求HTTP / 2在传输层安全上运行; 这意味着HTTP / 2只能通过HTTPS运行是事实上的标准。
幸运的是,CloudFlare的通用SSL选项允许我们向网站访问者提供签名的SSL证书。这使我们能够获得HTTP / 2的性能优势,并有可能提高搜索引擎排名

cloudflare_ssl_modes.png
在您的CloudFlare网站的“加密”选项卡中,您应该确保您的SSL模式设置为Full但不是Full (Strict)
cloudflare-Full.png
现在,我们可以添加一个页面规则来实施HTTPS,因为您添加其他页面规则,请确保这是主页面规则:
always_use_https_page_rule.png
我们还可以创建一个页面规则,以确保在使用HTTPS时非www安全地重定向到www:
redirect_page_rule_to_www.png
启用HTTP严格传输安全性(HSTS)将有助于确保您的访问者必须通过HTTPS与您的网站进行通信,告诉浏览者他们应该始终通过加密的HTTPS进行通信。如果您选择设置,请小心,如果您希望选择关闭HTTPS,可能会导致您的网站无法访问。

第2步:缓存所有的东西

CloudFlare在页面规则中有一个“Cache Everything”选项。对于静态网站,它允许您的HTML被缓存,并直接从CloudFlare的CDN提供服务。
cloudflare-Cache Everything.png
在部署站点时,可以使用CloudFlare上“缓存”选项卡中的“清除缓存”选项来删除缓存版本的静态页面。如果您使用持续集成系统部署您的站点,则可以使用我们的API以编程方式清除缓存。

缺点

首先是安全的一个字。如果您正在部署与远程API进行通信的JavaScript应用程序,请务必不要将其用于提交敏感数据。正如GitHub自己所说的:“GitHub Pages网站不应该用于发送密码或信用卡号码等敏感事务。”同时请记住,您的网站源文件可以在Git存储库中公开访问,所以要特别小心放在那里。
有一些我们不能做的事情。GitHub页面不允许我们设置自定义标题,这不幸意味着我们现在不能执行HTTP / 2服务器推送。

结论

GitHub页面,CloudFlare和一个静态网站生成器结合起来,为静态网站创建快速,安全,免费的托管。


—— 本文结束 ——

0%