- 目录 -
黑白之海
当指针转向天台

Hugo | 加密博文

在?看看代码。

免本地安装环境,直接云端部署即可。

我hugo是挂在cloudflare pages上的,其他平台的操作请酌情调整。

根据前人的教程12,我在cloudflare pages添加了新的环境变量RUBY_VERSION=2.6.2,并把所需文件放到了博客文件夹的根目录,解密用的decrypt.js也放进根目录,短代码放进了短代码文件夹。同时在cloudflare pages的build command写chmod +x ./deploy.sh && ./deploy.sh

众神归位——

对不起果然出现问题了!

  1. 一开始遇到的问题是Permission denied,搜了一下解决办法3。build command不要只写./deploy.sh,按我上面那段似乎就可以成功部署了。
  2. 第二个问题是,点击解密按钮,提示未定义click_handler。这个我看了一下应该是js的问题,把js文件在hugo的single.html引用一下即可。
{{.Content}}<script src="./decrypt.js"></script>

项目演示中4提到:

现在你可以尝试刷新页面、关闭页面再重新打开,你会发现认证状态仍然有效

所以如果想反复测试的话需要开一下浏览器无痕【

输入PASSWORD

文章的部分内容被密码保护:

加密后未解密时,在浏览器中显示为

体验谈:

  • 添加加密脚本以后,cloudflare pages部署时间需要35s左右,比原来单独hugo生成网页要慢上一些。但总体还能接受啦w
  • 部分主题下,加密内容的css层高段落间距等样式、对应的侧边toc目录会失效。(尝试手动添加新的css类,可行。)
  • RSS需要改一下,从.Content改为.Summary
// 抄一下原有css

.hugo-encryptor-form{
   margin-top: 0;
   margin-bottom: 1rem;
}

.hugo-encryptor-container{
   line-height: 1.5em;
}

.hugo-encryptor-container p{
   margin-top: 0;
   margin-bottom: 1rem;
}

.hugo-encryptor-container h1 {
  margin: 20px auto;
}

.hugo-encryptor-container h2 {
  margin: 20px auto;
}

.hugo-encryptor-container h3 {
  margin: 20px auto;
}

  1. Hugo 文章加密 ↩︎

  2. Hugo文章加密 ↩︎

  3. Permission denied on build script ↩︎

  4. 这是一个Hugo文章加密工具 ↩︎