在 Netlify 上部署 Hexo,及自定义域名

将 Hexo 部署到 Netlify 上,并自定义域名

简介

博客之前一直托管在 Gitlab 上自动部署,图片,音乐,视频等静态资源则放在腾讯云,依赖 CloudFlare 支持 HTTPS ,可惜访问速度还是差强人意。无意中发现了 Netlify ,为其优点所吸引,遂换了个部署环境,记录下方法

Netlify

它是国外一个提供静态资源网络托管的综合平台。

  • 能够托管服务,免费 CDN
  • 能够绑定自定义域名
  • 能够启用免费的TLS证书,启用HTTPS
  • 支持自动构建
  • 提供 Webhooks 和 API

使用 Netlify

登录

  • 首先使用 Gitlab 账号登陆 Netlify,登陆后进入空间管理中心,点击New site from git按钮开始部署博客:

建网站

  • 然后根据自己的托管平台,可以选择GitHubGitLab或者BitBucket(这里以 GitLab 为例):

  • 点击GitLab之后会弹出一个让你授权的窗口,给 Netlify 授权后,就会自动读取GitLab的仓库:

  • 选择仓库后,Netlify 会自动识别到 hexo,并填入相关信息,接着选择Deploy site按钮:

  • 稍等片刻,就可以看到博客已经部署成功,并且给分配了一个二级域名给我们:

  • 接下来选择Site settings,修改二级域名的自定义前缀:


  • 好了,可以用自己自定义前缀的二级域名打开博客了

aefgijn.netlify.app/

  • 至此,教程可以告一段落了,如果有自己的域名,那我们接着来设置

添加自定义域名

  • 接着我们选择第二步,开始设置域名:

  • 填写自己的域名,如www.xxxx.cn

  • 一路确认下来,Netlify 会提示我们去域名提供商处进行 DNS 解析::

  • DNS 解析提供商里面,将 CNAME 记录值更改为 Netlify 提供的的二级域名:

  • 刷新一下设置界面,域名变成了墨绿色,表示设置成功:

设置HTTPS

  • Netlify默认会启用 HTTPS,如果没有证书,它会帮你去Let’s Encrypt申请免费的证书:

  • 当然也可以自己申请证书,以阿里免费的 SSL证书为例:

  • 下载下来,如图:

  • 设置自己的证书,选择Set custom certificate,如图填入即可:

  • 再次刷新界面,如图所示,自己的证书设置成功了

自动部署

  • 上面的步骤走完,已经可以自动部署了,只要 push 了代码,就会自动更新,可以在这里查看部署信息:

  • 因为我们采用了Netlify进行部署,所以接着我们回到 Gitlab,注释掉CI文件,关闭 Gitlab的自动部署功能:

开启 Netlify 部分优化

  • 如图,选择 Post processing后期处理,再选 Asset optimization,取消勾选状态,开启资产优化(捆绑CSS,压缩CSS,捆绑JS,压缩JS,压缩图片等):

Written with StackEdit.