Github Page建站心得及所踩的坑

最近想用 github.io 建立我的个人博客站点，具体步骤我参考了知乎上的一篇文章，里面写的够清楚了，下面就建站时碰到的坑写的不完全总结，估计以后陆续增加

ys558.github.io改为自己的域名

去阿里云申请一个自己的域名后绑定原理的ys558.github.io域名，步骤：

  1. 登陆阿里云的万网，挑一个喜欢便宜的域名注册，我的域名 zyzy.info 一年只花21元，注册完成后选择个人站点，顺便也就开通了阿里云账号，如其他域名服务商，如申请.me结尾的个人网站，应该去GoDaddy等

  2. 依次进入右上角的 控制台 => 运维管理 选项卡下找到 域名 标签 => 点击 解析，如下：

阿里云域名解析

=> 点击添加记录， 在 记录值 处填下ys558.github.io，如下，点击确定。这样就把你github.io上的页面绑定了购买的域名下

阿里云域名解析

  1. 用ping 也可查询到新绑定的域名网址IP：
    阿里云域名解析

  2. 按以下命令在自己的github仓库中添加CNAME文件，其中填入购买的域名。或者可以在仓库的settings中设置Custom Domain设置好自己的域名，github会自动添加CNAME文件。

    1
    2
    touch CNAME
    echo 'zyzy.info'> CNAME

图片显示错误：

！！！该方法也是在网上搜索得到，虽可行，但解析中文路径时经常会出错，后来还是转用CDN，把图片全部移到另一个repo，推荐用CDN的方法，具体操作办法看我另一篇文章

  1. 需要安装一个图片路径转换的插件，这个插件名字是 hexo-asset-image 

    1
    2
    3
    npm i hexo-asset-image --save
    # or
    yarn add hexo-asset-image --save

  1. _config.yml文件，修改下述内容，用 hexo n <博客文章名字> 生成新博客时，会生成一个对应的文件夹，将图片放入该文件夹引用即可：

    1
    post_asset_folder: true

  2. 修改博客目录下node_modules\hexo-asset-image\index.js (hexo文件有bug)
    阿里云域名解析

证书错误，不是私密连接

Github建站好之后，经常会碰到打开页面浏览器显示不是私密链接的情况，搜来搜去，说是GitHub的SSL证书不稳定，不知道是不是墙的原因。

不是私密连接

有两个方法可以解决：一是申请 cloudfare 的免费证书，二是自己买证书，两种方法都介绍以下

方法一： 某宝买证书

去某宝买了证书，（p.s. 不差钱也可以直接买阿里云的证书，两年2000多），证书是有有效期的，我买的那家证书一年80元，两年140元，5年300元。选个自己能接受，不太贵的价格即可。一般销量高的店家都有教你怎么配置，我这里把其配置记录了下来：

1. 在 Github Page 上取消勾选 Enforce HTTPS 服务

位置如下图：
取消Github HTTPS 勾选

2. 将买到的证书在阿里云上设置

如下图顺序设置便可完成：

阿里云设置证书

方法二：蹭 cloudfare 的免费证书

1. 申请个 cloudfare 账号，并添加DNS

cloudfare 我的cloudfare是以前注册的，忘了一步步截图，但有中文界面跟着提示操作即可，不会很难，注册完成后，在以下界面操作：

找到github的ipv4的地址为以下几个，也不知道访问时会分配到哪个ip，索性A类地址全部添加上，像阿里云以下，把 CHAME 类地址也添加上，如下：

DNS添加记录

SSL/TSL 选择完全

2. 返回阿里云添加 cloudfare 申请的DNS服务器

阿里云的DNS修改操作
从 cloudfare 复制DNS

Github Page 更新自己的域名

  1. 点击仓库 ys558.github.io 里的 Settings
  2. 点击左侧的 Pages
  3. 在 Custom domain 里输入自己配置好DNS的域名
  4. 点击 Save, 则会自动检查域名是否可用
    从 cloudfare 复制DNS