Github Blog 绑定二级域名并开启 HTTPS

1. 创建 github 仓库

通常使用 GithubPages 创建个人主页需要创建一个与用户名同名的 XXX.github.io 仓库

以我的博客为例,创建一个新仓库 wangriyu.github.io,上传网页文件,然后在仓库设置里开启 GitHub Pages 功能

此时应该能够在浏览器中输入 http://www.hory-ai.com 访问自己的网页了

而且 GithubPages 默认开启 HTTPS

2. 绑定自定义域名

到 万网 上买个喜欢的域名,比如我买了 wangriyu.wang(可惜买不到 riyu.wang)

到上面的仓库目录下添加 CNAME 文件,里面的内容就是我的域名,比如我的就写了二级域名 blog.wangriyu.wang

此时 Github Pages 看起来是这样的

image

Enforce HTTPS 选项显示 Unavailable for your site because you have a custom domain configured

自定义域名不提供 HTTPS 服务

此时还无法访问 http://www.hory-ai.com, 需要到 DNS 服务商那配置 DNS 解析,比如阿里云的即可

3. 配置 DNS 解析

打开 阿里云的域名控制台,点击自己域名的解析按钮进入 DNS 设置页,添加解析:

image

  • 记录类型中 A 类填的是 IP 地址,CNAME 类填的是域名,我们需要把 wangriyu.github.io 转向 blog.wangriyu.wang, 所以填 CNAME
  • 主机记录填二级域名即可,'@' 值代表一级域名,更多选项见阿里云说明
  • 解析路线填默认即可,如果分国内国外需要另外选择使其能够根据国内外 IP 解析到不同地址
  • 记录值就是我们的原域名 wangriyu.github.io,如果记录类型是 A 类这里需要填 IP 地址 (可以 PING 一下得到)

等待 DNS 生效即可通过 http://www.hory-ai.com 访问自己的网页了,而且原本的 http://www.hory-ai.com
也会重定向到自定义域名上

DNS 解析这里我用了二级域名 blog 访问博客,还可以添加别的二级域名,比如我用了 home 访问我的另一个仓库 https://github.com/wangriyu/homepage

只要在新的仓库根目录下添加 CNAME 文件并写入添加的有效二级域名 (home.wangriyu.wang), 再开启 GithubPages 功能即可访问另一个主页

4. 实现自定义域名 HTTPS

到 CloudFlare 注册一个账号,注册成功后在返回的页面中添加域名 (一级域名 wangriyu.wang),点击扫描 DNS 记录

image

添加域名解析

如果 DNS 扫描不到你的解析记录,可以手动添加,与上面的添加方法类似

image

修改域名服务器

我用的是万网的 DNS,所以现在要在万网的域名控制台将 DNS 服务器修改至 CloudFlare 提供的域名服务器

image

进入万网的域名控制台,点击域名的管理按钮,修改域名 DNS 为 CloudFlare 提供的

image

回到 CloudFlare 页面,设置 SSL 为 Flexible

image

添加路由重定向规则

在 Page Rules 里使用通配符将路由重定向到 HTTPS 的链接

image

待设置生效后再访问 http://www.hory-ai.com 就会变成 https 了

具体原理如图,cloundflare 访问原网址的服务器获取储存原网页文件,用户再访问 cloundflare 的加密连接
如果在控制台中 Ping 一下 CloudFlare 代理前后的网址就会发现博客 ip 变了

image

除此之外,在 CloudFlare 控制台中还提供了很多服务,比如 js、html 等静态文件压缩,设置浏览器缓存过期时间,
清空 CloudFlare 服务器缓存 (强制刷新资源,避免原网页更新用户访问的还是旧资源) 等等

更多技巧见文章: 十个你可能不知道的 CloudFlare 免费 CDN 加速技巧 -SSL\DDOS\Cache

cloundflare 的服务很适合博客这样的静态网页,也弥补了 GithubPages 的不足

https://github.com/wangriyu/wangriyu.github.io/issues/6

https://dash.cloudflare.com/a4478cfcd466818be3094caea229dffa/hory-ai.com

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值