Hexo 静态博客 我的新博客

欢迎访问我的新博客:
内容持续更新 https://www.oikiou.top/

静态网页

静态网页生成器

Jekyll（由 Github 构建的用于为其 Github 页面提供支持的 Ruby 生成器）、

Hugo（构建在 Go 编程之上的极快静态生成器）语言）和

Hexo（基于 Node.js 的快速网站生成器）。

参考

How to Choose the Right Static Generator: Jekyll vs. Hugo vs. Hexo

StackShare

Hexo

TBD

Jekyll

TBD

Hugo

TBD

Hexo

Hexo 部署

HEXO文档_参考链接

要求:

Node.js (Node.js 版本需不低于 10.13，建议使用 Node.js 12.0 及以上版本)
Git

部署:

npm install hexo-cli -g
hexo init blog
cd blog
npm install
hexo server

Hexo CMD

Init 初始化

hexo init [folder]

新建一个网站。如果没有设置 folder ，Hexo 默认在目前的文件夹建立网站。

new 新建

hexo new [layout] <title>
hexo new "post title with whitespace"
hexo new page --path about/me "About me"
hexo new page -p     about/me "About me"

参数	描述
-p, --path	自定义新文章的路径
-r, --replace	如果存在同名文章，将其替换
-s, --slug	文章的 Slug，作为新文章的文件名和发布后的 URL

generate 生成

# 生成静态文件。
hexo generate
# 该命令可以简写为
hexo g

选项		描述
-d	–deploy	文件生成后立即部署网站
-w	–watch	监视文件变动
-b	–bail	生成过程中如果发生任何未处理的异常则抛出异常
-f	–force	强制重新生成文件 Hexo 引入了差分机制， 如果 public 目录存在，那么 hexo g 只会重新生成改动的文件。 使用该参数的效果接近 hexo clean && hexo generate
-c	–concurrency	最大同时生成文件的数量，默认无限制

publish 草稿

hexo publish [layout] <filename>

发表草稿。

server 服务器

在服务器启动期间，Hexo 会监视文件变动并自动更新，您无须重启服务器。

hexo server
hexo s

启动服务器。默认情况下，访问网址为： http://localhost:4000/。

选项	描述
-p, --port	重设端口
-s, --static	只使用静态文件(不会更新)
-l, --log	启动日记记录，使用覆盖记录格式
-i	hexo server -i 192.168.1.1 指定监听的IP

deploy 部署

# 部署网站。
hexo deploy
# 该命令可以简写为：
hexo d

参数	描述
-g, --generate	部署之前预先生成静态文件

render

hexo render <file1> [file2] ...

渲染文件。

参数	描述
-o, --output	设置输出路径

migrate

hexo migrate <type>

从其他博客系统 迁移内容。

clean 清理

$ hexo clean

清除缓存文件 (db.json) 和已生成的静态文件 (public)。

在某些情况（尤其是更换主题后），如果发现您对站点的更改无论如何也不生效，您可能需要运行该命令。

list

$ hexo list <type>

列出网站资料。

Hexo _Config.yml

Home page setting

index_generator.order_by 文章的顺序

• -date 默认情况下按日期降序排序(从新到旧)。
• -update 按更新时间排序(- = 从新到旧)。

Hexo Theme

我是直接在github搜索 hexo theme看到了几个 star 比较多而且比较活跃的 repository

• icarus 5.5K star

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-VcIybtO9-1663510547982)(静态网页/68747470733a2f2f70706f66666963652e6769746875622e696f2f6865786f2d7468656d652d6963617275732f67616c6c6572792f707265766965772e706e673f31.png)]

• fluid 4.8K star

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-M9Nd5mGR-1663510547984)(静态网页/68747470733a2f2f63646e2e6a7364656c6976722e6e65742f67682f666c7569642d6465762f737461746963406d61737465722f6865786f2d7468656d652d666c7569642f73637265656e73686f74732f696e6465782e706e67.png)]

• matery(blinkfox) 4.5K star

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-l6ODH5Ms-1663510547985)(静态网页/687474703a2f2f7374617469632e626c696e6b666f782e636f6d2f6d61746572792d32303138313230322d312e706e67.png)]

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-AH1zYdqi-1663510547985)(静态网页/687474703a2f2f7374617469632e626c696e6b666f782e636f6d2f6d61746572792d32303138313230322d332e706e67.png)]

• butterfly 4.3K star

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0fBiBMUI-1663510547989)(静态网页/68747470733a2f2f63646e2e6a7364656c6976722e6e65742f67682f6a65727279633132372f43444e406d322f696d672f7468656d652d627574746572666c792d726561646d652e706e67.png)]

• volantis 1.5k star

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-EToG6lmq-1663510547991)(静态网页/68747470733a2f2f692e6c6f6c692e6e65742f323032302f30332f31382f663550516c576973766d397a62674b2e6a7067.jpeg)]

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-SsOHdgvM-1663510547992)(静态网页/68747470733a2f2f692e6c6f6c692e6e65742f323032302f30332f31382f585742476639354532743162646e6c2e6a7067.jpeg)]

其中 fluid 和 volantis 最对我胃口, 最后选择的 fluid, 后期可能会改成volantis或者icarus试试看, 主要是喜欢简洁些, 又能有一定的观赏性的.

Fluid

参考文档

https://hexo.fluid-dev.com/docs/guide/

theme 的 Github

https://github.com/fluid-dev/hexo-theme-fluid

自带的内置图标库

内置社交图标

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-3cCne4sK-1663510547994)(静态网页/iconfont.f8319467.png)]

Hexo Note

Hexo Permalink简化

参考:

Hexo Permalink简化

Note:

使用hexo-abbrlink插件实现

# install
npm install hexo-abbrlink --save
# setting edit _config.yml
permalink: posts/:abbrlink.html
abbrlink:
  alg: crc32  # 算法：crc16(default) and crc32
  rep: hex    # 进制：dec(default) and hex

hexo 图片链接问题

hexo本地图片显示问题

使用hexo生成静态资源后,由于url的问题会出现图片加载的问题,现在网上的文章及官方的解决方案大概分为三种:

1. 将图片放入source/images目录下,每次generate都会生成图片,在使用相对或绝对路径进行引用
2. 配置hexo的_config.yml文件, 将 post_asset_folder 设置为true, 这样每次new 生成一个文章时都会同步生成一个同名的文件夹,然后设置相对或绝对路径.
3. 使用hexo官方的解决方案,使用模版变量, {% asset_img slug [title] %}
4. !new!. hexo init的时候会自动copy一个插件 hexo-renderer-marked 这个插件可以开启相对路径的支持,但是需要改一些代码

但是在配置过程中发现这三种方式都多多少少存在一些问题,前两中首页跟内容页会有一个加载失败的问题,而第三种则失去了markdown的意义.

方法四:

官方手册上提到过, hexo-renderer-marked 3.1.0已经开始支持相对路径了.但是可以看到它支持的路径似乎并不合理, 其他的md阅读器是不能识别这样的路径的.

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-opOnnLl3-1663510547995)(静态网页/image-20220815153651988.png)]

参考: https://github.com/hexojs/hexo-renderer-marked/issues/216

1. 修改_config.yml

   post_asset_folder: true
   marked:
     prependRoot: true
     postAsset: true
   

2. 修改文件node_modules\hexo-renderer-marked\lib\renderer.js

    if (!/^(#|\/\/|http(s)?:)/.test(href) && !relative_link && prependRoot) {
      if (!href.startsWith('/') && !href.startsWith('\\') && postPath) {
        const PostAsset = hexo.model('PostAsset');
        // findById requires forward slash
        // ***************** Add the following code *******************
        const fixPostPath = join(postPath, '../');
        const asset = PostAsset.findById(join(fixPostPath, href.replace(/\\/g, '/')));
        // const asset = PostAsset.findById(join(postPath, href.replace(/\\/g, '/')));
        // ************************** End *****************************
        // asset.path is backward slash in Windows
        if (asset) href = asset.path.replace(/\\/g, '/');
      }
      href = url_for.call(hexo, href);
    }

3. enjoy it

方法二:

# 设置
post_asset_folder:true
# 安装插件 asset-image
npm install https://github.com/CodeFalling/hexo-asset-image  --save
# typora中设置图片为相对路径 看下图
./${filename}
# 运行查看
hexo clean && hexo generate && hexo s 

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eoiBtGKh-1663510547996)(静态网页/image-20220815133503275.png)]

注意

Env:使用方法四

• 文件名不能带有空格, title 可以带空格 (hexo new的时候需要注意这一点)
  • 修改 node_modules\hexo-renderer-marked\lib\renderer.js文件可能可以改善这点. -> TBD
• md文件名要和图片等等资源文件夹同名 -> 注定了不能使用 ./${filename}.assets这种方案, 一定要改成./${filename}才行

Hexo 跳过一些文件,不渲染某些文件

搜索引擎确认网站所有权时往往会提供一个html文件来进行验证，要是这个文件被渲染了，验证自然就会失败了。或者，有时候会写一些简单的html示例页面或README.md，这也是不希望Hexo渲染的。因此有必要针对某个文件或者目录进行排除。

Hexo博客的基本内容是一些Markdown文件，放在source/_post文件夹下，每个文件对应一篇文章。除此之外，放在source文件夹下的所有开头不是下划线的文件，在hexo generate的时候，都会被拷贝到public文件夹下。但是，Hexo默认会渲染所有的HTML和Markdown文件，导致我的README.md直接转成html格式了。。。

怎么样避开这个坑呢？如果只有一个HTML文件的话，可以简单地在文件开头加上layout: false一行即可：

layout: false
---

<html>
...

如果有多个要避开渲染的md文件，显然是不可能使用这种方法的。这时候需要使用skip_render配置。根据Hexo文档中的说明，通过在_config.yml配置文件中使用skip_render参数，可以跳过指定文件的渲染。使用方式如下：

skip_render: [games/**, depview/**, knowledge/**]

这里的路径匹配可以使用正则表达式。

**注意：skip_render参数设置的路径是相对于source目录的路径。**例如，需要跳过渲染source/README.md，只需要设置 skip_render:README.md。

在设置了跳过渲染之后，最好使用hexo clean清除以前的编译结果，保证配置生效。

hexo 开启RSS订阅 feed atom

基于hexo-generator-feed

先安装这个包:

npm install hexo-generator-feed

然后在在_config.yml文件中配置该插件

feed:
    type: atom
    path: atom.xml
    limit: 20
    hub:
    content:
    content_limit:
    content_limit_delim: ' '
    order_by: -date
    icon: /images/favicon.png

参数的含义：

• type: RSS的类型(atom/rss2)
• path: 文件路径,默认是atom.xml/rss2.xml
• limit: 展示文章的数量,使用0或则false代表展示全部
• hub:
• content: 在RSS文件中是否包含内容 ,有3个值 true/false默认不填为false
• content_limit: 指定内容的长度作为摘要,仅仅在上面content设置为false和没有自定义的描述出现
• content_limit_delim: 上面截取描述的分隔符,截取内容是以指定的这个分隔符作为截取结束的标志.在达到规定的内容长度之前最后出现的这个分隔符之前的内容,，防止从中间截断.
• order_by: 顺序排列方式
• icon: 图标路径

配置好之后运行hexo clean & hexo g就可以找到你博客的pubilc 文件夹下发现atom.xml文件了

我们可以在关于(about)页面添加RSS源, 有些主题可以在头像下面自动开启, 这些都是后话了.

配置RSS的时候发现还有一些其他的推送方式, 比如邮件推送, 浏览器通知推送等等.

RSS阅读器

Feedly.com 这个比较满意, 文章显示和界面都不错

inoreader: 订阅的文章展示效果也还不错(卡片形式).

the old reader: 这个是比较老牌的RSS阅读器了

参考链接:

为hexo博客添加RSS订阅功能

hexo开启atom订阅

hexo 静态网页压缩

了解到有三个插件可以做到这个功能(hexo-neat, gulp, Hexo-all-minifier)

gulp存在各种乱七八糟的依赖关系, 推荐直接用Hexo-all-minifier一套走.

1. hexo-neat

集成插件 hexo-neat

首先时所说集成压缩 HTML JS CSS 为一体的 hexo-neat 插件，该插件有以下几个问题：

1. 各种打印信息输出一大串，并且还不能去掉打印信息，而且还向编译后的文件加入私有注释 rebuild by neat，不太爽！
2. npm包 跟 github 包 不统一，github 的 README 有 logger 配置选项，npm 包却没有这配置。
3. 每次执行 npm run build html 都被重新构建，不能启用 hexo 缓存优化，看不到最新的 html 构建信息。
4. 包长久不维护。

基于以上放弃了这个插件

2. gulp

# 安装gulp
npm install gulp --save
# 安装gulp依赖
npm install gulp-minify-css gulp-uglify gulp-htmlmin gulp-htmlclean gulp-imagemin --save

创建 gulpfile.js 文件

在Hexo站点根目录下创建gulpfile.js文件

var gulp = require('gulp');
var minifycss = require('gulp-minify-css');
var uglify = require('gulp-uglify');
var htmlmin = require('gulp-htmlmin');
var htmlclean = require('gulp-htmlclean');
var imagemin = require('gulp-imagemin');
// 压缩css文件
gulp.task('minify-css', function() {
  return gulp.src('./public/**/*.css')
  .pipe(minifycss())
  .pipe(gulp.dest('./public'));
});
// 压缩html文件
gulp.task('minify-html', function() {
  return gulp.src('./public/**/*.html')
  .pipe(htmlclean())
  .pipe(htmlmin({
    removeComments: true,
    minifyJS: true,
    minifyCSS: true,
    minifyURLs: true,
  }))
  .pipe(gulp.dest('./public'))
});
// 压缩js文件
gulp.task('minify-js', function() {
    return gulp.src(['./public/**/.js','!./public/js/**/*min.js'])
        .pipe(uglify())
        .pipe(gulp.dest('./public'));
});
// 压缩 public/demo 目录内图片
gulp.task('minify-images', function() {
    gulp.src('./public/demo/**/*.*')
        .pipe(imagemin({
           optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
           progressive: true, //类型：Boolean 默认：false 无损压缩jpg图片
           interlaced: false, //类型：Boolean 默认：false 隔行扫描gif进行渲染
           multipass: false, //类型：Boolean 默认：false 多次优化svg直到完全优化
        }))
        .pipe(gulp.dest('./public/uploads'));
});
// 默认任务 gulp 4.0 适用的方式
gulp.task('default', gulp.parallel('minify-html', 'minify-css', 'minify-js'
 //build the website
));

只要每次在执行hexo g命令后执行gulp就可以进行静态资源压缩，压缩后再同步到github上

hexo cl & hexo g & gulp
hexo d

注意: 这里部署的时候出了一个问题

Error [ERR_REQUIRE_ESM]: require() of ES Module xxx\hexo\node_modules\gulp-imagemin\index.js from xxx\hexo\gulpfile.js not supported.
Instead change the require of index.js in xxx\hexo\gulpfile.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (xxx\hexo\gulpfile.js:6:16)
    at async Promise.all (index 0) {
  code: 'ERR_REQUIRE_ESM'
}

gulp-imagemin 8.0.0 and above are now ESM only. You can downgrade gulp-imagemin to 7.1.0 which is commonjs and it should work fine.

This package is now pure ESM. Please read this.

https://github.com/sindresorhus/gulp-imagemin/releases/tag/v8.0.0

最终找到说是包的版本太高导致的

重新安装特定版本的包

# 先卸载掉这些包
npm uninstall gulp
npm uninstall gulp-htmlclean gulp-htmlmin gulp-clean-css gulp-uglify gulp-imagemin
npm uninstall gulp-minify-css 

# 重新安装
npm install gulp@4.0.2 --save
npm install gulp-htmlclean@4.0.2 gulp-htmlmin@5.0.1 gulp-clean-css@4.2.0 gulp-uglify@3.0.2 gulp-imagemin@7.1.0 --save
npm install gulp-babel@8.0.0 babel-preset-env@1.7.0 babel-preset-mobx@2.0.0 --save
npm install gulp-miniify-css@1.2.4 -save

包的版本可以参考这个

"babel-preset-env": "^1.7.0",
"babel-preset-mobx": "^2.0.0",
"gulp": "^4.0.2",
"gulp-babel": "^8.0.0",
"gulp-clean-css": "^4.2.0",
"gulp-htmlclean": "^2.7.22",
"gulp-htmlmin": "^5.0.1",
"gulp-imagemin": "^7.1.0",
"gulp-uglify": "^3.0.2",
"gulp-minify-css": "^1.2.4",

把gulpfile.js也改动了一下,

在minify-images项里面我的图片是随文章存放的, 并不是全部存放在img等文件夹下面, 所以只能用全文件匹配去做图片压缩, 代价就是速度很忙, 希望有大佬来指点一下如何更好的修改

let gulp      = require('gulp')
let htmlmin   = require('gulp-htmlmin')
let htmlclean = require('gulp-htmlclean')
let uglify    = require('gulp-uglify')
let imagemin  = require('gulp-imagemin')
var minifycss = require('gulp-minify-css');

// 压缩html
gulp.task('minify-html', function () {
    // 匹配所有 .html结尾的文件
    return gulp.src('./public/**/*.html')
        .pipe(htmlclean())
        .pipe(htmlmin({
            removeComments: true,
            minifyJS: true,
            minifyCSS: true,
            minifyURLs: true,
        }))
        .pipe(gulp.dest('./public'))
});

// 压缩css
gulp.task('minify-css', function () {
    return gulp.src('./public/**/*.css')
        .pipe(minifycss())
        .pipe(gulp.dest('./public'));
});

// 压缩js
gulp.task('minify-js', function () {
    return gulp.src(['./public/**/.js', '!./public/js/**/*min.js'])
        .pipe(uglify())
        .pipe(gulp.dest('./public'));
})

// 压缩图片
gulp.task('minify-images', function () {
    return gulp.src('./public/**/*.*')
        .pipe(imagemin({
            optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
            progressive: true,    //类型：Boolean 默认：false 无损压缩jpg图片
            interlaced: false,    //类型：Boolean 默认：false 隔行扫描gif进行渲染
            multipass: false,     //类型：Boolean 默认：false 多次优化svg直到完全优化
        }))
        .pipe(gulp.dest('./public'));
})

gulp.task('default', gulp.series('minify-html', 'minify-css', 'minify-js', 'minify-images'))

3. Hexo-all-minifier

https://github.com/chenzhutian/hexo-all-minifier

Hexo 资源压缩 | hexo-all-minifier

# 安装
npm install hexo-all-minifier --save

# 在_config.yml文件添加配置
all_minifier: true

# 
hexo cl & hexo g 

Hexo Sitemap

据网友所言: 谷歌就xx乱爬, 百度就xx乱删, 必应就xx不收录

为了让博文能够被google或百度检索，需要先将网站收录到他们的库里面，我们可以在谷歌的站长平台里面提交我们的sitemap文件，告诉浏览器应该我们的站点有哪些页面，这样他就会去爬取收录了。

站点地图是一种文件，您可以在其中提供与您网站中的网页、视频或其他文件有关的信息，还可以说明这些内容之间的关系。Google 等搜索引擎会读取此文件，以便更高效地抓取您的网站。站点地图会告诉 Google 您认为网站中的哪些网页和文件比较重要，还会提供与这些文件有关的重要信息。例如，网页上次更新的时间和网页是否有任何备用的语言版本。

您可以使用站点地图提供与特定类型的网页内容（包括视频、图片和新闻内容）有关的信息。例如：

• 站点地图视频条目可以指定视频的时长、评分以及适合哪些年龄段的受众。
• 站点地图图片条目中可包含网页中所含图片的位置。
• 站点地图新闻条目中可包含报道标题和发布日期。

我需要站点地图吗？

如果您网站上的网页链接得当，那么 Google 通常能够发现其中的大多数网页。链接得当是指您认为重要的所有网页都可以通过某些形式的导航（例如您网站的菜单，或您放入网页中的链接）抵达。即便如此，站点地图仍有助于我们更加高效地抓取规模更大、更复杂的网站或更特殊的文件。

生成sitemap.xml

首先我们安装生成sitemao的插件

# 谷歌的
npm install hexo-generator-sitemap --save
# 百度的
npm install hexo-generator-baidu-sitemap --save

修改配置文件_config.yml增加下面这些内容

Plugins:
- hexo-generator-sitemap
- hexo-generator-baidu-sitemap

baidusitemap:
  path: baidusitemap.xml
sitemap:
  path: sitemap.xml

生成sitemap.xml文件, 重新生成网站, 在网站根目录就可以看到sitemap.xml文件

hexo cl & hexo g 

提交sitemap.xml

GoogleSearchConsole

BingWebMaster

百度资源平台

下面讲一下谷歌的

登录GoogleSearchConsole, 按照提示验证站点的所有权

打开谷歌控制台选择->索引->站点地图，在添加新的站点地图中填入你的sitemap.xml的路径, 这里直接写sitemap.xml即可。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wtf1Gqj7-1663510547997)(静态网页/image-20220918004138059.png)]

这个谷歌真是让我大无语, 一直显示无法获取, 一直没法解决这个问题, 网址检查显示没什么问题, 但是一直显示无法获取真是麻了.

求助群友后他们推荐使用 Hexo-SEO-AutoPush

收录查询

1. 通过网站管理平台的控制台去看数据

2. 搜索引擎直接搜索

site:oikiou.top

手动生成Sitemap文件

https://www.xml-sitemaps.com/

Hexo-SEO-AutoPush的使用

https://github.com/Lete114/Hexo-SEO-AutoPush

注意以下几点:

1. 由于生成的 actions 是在.github/workflows/HexoSeoAutoPush.yml，点开头的文件或文件夹都会被视为隐藏文件，所以 hexo 不会将隐藏文件部署到 pages，需要新增配置ignore_hidden

   deploy:
    ignore_hidden: false # 忽略隐藏文件及文件夹(目录)
   

2. Bing的API在登录控制台后的右上角齿轮上可以找到, 如果找不到可能是界面更新导致的, 请参考官方文档

3. 注意google的信息填写方式

   google_private_key是填写Json内的 private_key 不是private_key_id 注意区分.

   而且google_private_key 是带双引号的需要注意, 而google_client_email填写的时候是不带双引号的.

   名称	形似	说明
   google_client_email	xxx@xxx.xxx.gserviceaccount.com	【必填】Value 输入谷歌的 client_email
   google_private_key	“-----BEGIN PRIVATE KEY-----\nxxxxxx\n-----END PRIVATE KEY-----\n”	【必填】Value 输入谷歌的 private_key （注意：填写的时候需要使用双引号包起来，如: "private_key"）

在Github内点击Action->Hexo SEO Auto Push -> 查看执行情况 没有报错就是执行的没问题, 稍等片刻刷新控制台就可以看到提交的信息.

打开Home - Bing Webmaster Tools, URL提交标签

在Google Cloud Platform 中查看.

注意:

部署的时候报了下面这个错误, 当时弄这个东西的时候是半夜, 脑子不清醒(各位同学注意早睡早起, 熬夜效率是极其低下的), private_key填写错了发生了这个错误, 有相似错误的同学可以看看是不是private_key有问题.

Run npx hexoautopush *** ***
Error: error:0909006C:PEM routines:get_name:no start line
    at Sign.sign (internal/crypto/sig.js:110:29)
    at Object.sign (/xxx/node_modules/jwa/index.js:152:45)
    at Object.jwsSign [as sign] (/xxx/node_modules/jws/lib/sign-stream.js:32:24)
    at GoogleToken.requestToken (/xxx/node_modules/gtoken/build/src/index.js:225:31)
    at GoogleToken.getTokenAsyncInner (/xxx/node_modules/gtoken/build/src/index.js:163:21)
    at GoogleToken.getTokenAsync (/xxx/node_modules/gtoken/build/src/index.js:142:55)
    at GoogleToken.getToken (/xxx/node_modules/gtoken/build/src/index.js:94:21)
    at JWT.refreshTokenNoCache (/xxx/node_modules/google-auth-library/build/src/auth/jwtclient.js:171:36)
    at JWT.refreshToken (/xxx/node_modules/google-auth-library/build/src/auth/oauth2client.js:145:25)
    at JWT.authorizeAsync (/xxx/node_modules/google-auth-library/build/src/auth/jwtclient.js:152:35) {
  library: 'PEM routines',
  function: 'get_name',
  reason: 'no start line',
  code: 'ERR_OSSL_PEM_NO_START_LINE'
}

Comment 评论系统

cusdis 系统

功能较少,看起来非常轻量, 也可以私有部署,正打算私有部署的时候看到了twikoo所以就转入twikoo了,因为cusdis现阶段功能确实有些少.

twikoo 系统

https://twikoo.js.org/

私有docker部署部署半天还是不成功, 看起来像是需要HTTPS才行.

功能挺丰富的,就是半天没部署成功

部署后没有启用HTTPS
fluid 配置里面又启动了强行使用hTTPS, 
F12,看consel发现,ERR_SSL_PROTOCOL_ERROR,被重定向到了HTTPS去了

头像风格类型
404：如果没有任何图像与电子邮件哈希无关，则不加载任何图像，而是返回HTTP 404（找不到文件）响应
mp：（神秘人物）一个人的简单卡通风格的轮廓（不随电子邮件哈希值而变化）
identicon：基于电子邮件哈希的几何图案
monsterid：生成的具有不同颜色，面孔等的“怪物”
wavatar：生成的具有不同特征和背景的面孔
retro：生成的令人敬畏的8位街机风格像素化面孔
robohash：具有不同颜色，面部等的生成的机器人
blank：透明的PNG图像（以下为演示目的添加到HTML的边框）

• Twikoo我是用的docker,nginx和ssl配置可以参考DockerHub, https的端口是可以更改的, 默认的443占用了换成别的就好.

• twikoo的即时推送尝试了几个譬如 Qmsq, server酱等等发现又一系列的问题 都不尽如人意 最后选择的是最简单的邮件通知.

remark42

部署平台(托管平台)

常见静态网站托管平台使用及多节点部署方案

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-i3a97WJR-1663510547998)(静态网页/2fc062cb2.svg)]

现阶段比较好的方案是coding和github+netlify.

一些资源

字体族（font-family）

https://developer.mozilla.org/zh-CN/docs/Web/CSS/font-family

调色板灵感

https://www.webdesignrankings.com/resources/lolcolors/

ISO-8601 日期

http://momentjs.cn/docs/#/parsing/string-format/

代码高亮风格

highlightjs: https://highlightjs.org/static/demo/

prismjs: https://prismjs.com/

Logo生成器

adobe: https://www.adobe.com/express/create/logo

图床

https://postimg.cc/

壁纸

https://wallpapercrafter.com/

一些知识

Creative Commons licenses

What are Creative Commons licenses?

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sWqsinqU-1663510547999)(静态网页/licences_3bf0e9af_670x502.jpg)]

Gravatar & Cravatar

Gravatar & Cravatar的差异

Gravatar

Gravatar是一项用于提供在全球范围内使用的头像服务。只要你在Gravatar的服务器上上传了你自己的头像，你便可以在其他任何支持Gravatar的博客、论坛等地方使用它。

Cravatar (cn)

Cravatar 是 Gravatar 在中国的完美替代方案,从此你可以自由的上传和分享头像。

与 Gravatar API 兼容

为了降低你的使用成本，我们的 API 规范始终保持与 Gravatar 100% 兼容

独有的三级头像匹配机制

当访客请求自己的头像时，我们会按此顺序分三级匹配头像：Cravatar->Gravatar->QQ 头像，对于博客站，这平均可以为 70% 的访客提供准确的头像

原文链接
https://www.oikiou.top/2022/f96c3c41/