欢迎访问我的新博客:
内容持续更新 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 crc32rep: hex    # 进制：dec(default) and hex

hexo 图片链接问题

hexo本地图片显示问题

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

将图片放入source/images目录下,每次generate都会生成图片,在使用相对或绝对路径进行引用
配置hexo的_config.yml文件, 将 post_asset_folder 设置为true, 这样每次new 生成一个文章时都会同步生成一个同名的文件夹,然后设置相对或绝对路径.
使用hexo官方的解决方案,使用模版变量, {% asset_img slug [title] %}
!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

修改_config.yml

post_asset_folder: true
marked:prependRoot: truepostAsset: true

修改文件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 Windowsif (asset) href = asset.path.replace(/\\/g, '/');}href = url_for.call(hexo, href);}

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: atompath: atom.xmllimit: 20hub:content:content_limit:content_limit_delim: ' 'order_by: -dateicon: /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 插件，该插件有以下几个问题：

各种打印信息输出一大串，并且还不能去掉打印信息，而且还向编译后的文件加入私有注释 rebuild by neat，不太爽！

npm包跟 github 包不统一，github 的 README 有 logger 配置选项，npm 包却没有这配置。

每次执行 npm run build html 都被重新构建，不能启用 hexo 缓存优化，看不到最新的 html 构建信息。

包长久不维护。

基于以上放弃了这个插件

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-sitemapbaidusitemap: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

收录查询

通过网站管理平台的控制台去看数据
搜索引擎直接搜索

site:oikiou.top

手动生成Sitemap文件

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

Hexo-SEO-AutoPush的使用

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

注意以下几点:
由于生成的 actions 是在.github/workflows/HexoSeoAutoPush.yml，点开头的文件或文件夹都会被视为隐藏文件，所以 hexo 不会将隐藏文件部署到 pages，需要新增配置ignore_hidden
deploy:ignore_hidden: false # 忽略隐藏文件及文件夹(目录)
Bing的API在登录控制台后的右上角齿轮上可以找到, 如果找不到可能是界面更新导致的, 请参考官方文档

注意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"）

名称	形似	说明
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 lineat 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/

Hexo 静态博客我的新博客相关推荐

Z05 - 034、访客分析 - 每日新访客
初学耗时:0.5h 注:CSDN手机端暂不支持章节内链跳转,但外链可用,更好体验还请上电脑端. 一.访客分析 - 每日新访客记忆词: 每日新访客 Z05 - 999.网站流量日志分析ギ舒 ...
【新博客】个人新博客地址-[NDASH - 蘇小沐学习圈 (writebug.com)]
[个人新博客地址:NDASH - 蘇小沐学习圈 (writebug.com)] 以后电子取证相关的博客会优先在新平台发布,CSDN这边可能会慢一些,感兴趣的可以移驾关注下-[蘇小沐] 名称时间开始 ...
python博客下载本地文件_Linux CentOS6安装Git、Node.js及Hexo静态博客安装和使用方法...
有些时候,我们有听到或者看到某个技术很希望自己也能尝试一下,即便我们没有项目需求,但接触过后以后还可以跟别人吹嘘这个技术我玩过,具体能否玩的精通都无所谓,至少我们可以体验到其中的乐趣.这不,这几天有接 ...
在gitcafe下用hexo建的新博客
看到别人用hexo建的静态博客,感觉还不错,也就跟着建了一个,似乎有跟风的嫌疑,主题也是用别人的,太懒了,有兴趣的时候再慢慢改变它吧,所以这个博客也许就冻结在这一刻了,又或许某天新博客蹦了,我还会回来 ...
Hexo静态博客视频播放
如何实现Hexo静态博客视频播放? 其实并不难,说一下我的想法: 博客文章一般是用Markdown来写的 Markdown 是一种用来写作的轻量级标记语言 Markdown 优点 1.专注你的文字内 ...
hexo静态博客修改侧边栏
hexo主题默认的侧边栏只有首页.归档.标签这几项.调研了几个比较优秀的博客之后发现,还需要添加关于.搜索.阅读.旅行等等几个侧边栏项目,那么如何在博客里面添加新的侧边栏项目呢? 原文:小宇的博客添 ...
从零开始使用GitHub Pages搭建Hexo静态博客
本文主要讲述如何使用GitHub Pages/Coding/Vercel搭建Hexo静态博客,以及如何使用jsDelivr加速静态资源.如何使用LeanCloud国际版搭载博客评论,和如何使用PicG ...
使用Hexo＋ github快速搭建自己的博客网站(一)
Hexo简介 Hexo 是一个简单地.轻量地.基于Node.js的一个静态博客框架.通过Hexo我们可以快速创建自己的博客,仅需要几条命令就可以完成. Hexo特性: - Hexo基于Node.js, ...
启用新博客域名 www.qiuchengjia.cn
博客搬家到github和coding 用hexo搭建了一个新的静态博客,hexo静态博客的搭建教程传送门 1,个人博客域名地址:戎码人生 http://www.qiuchengjia.c ...

Hexo 静态博客 我的新博客

静态网页

静态网页生成器

Hexo

Jekyll

Hugo

Hexo

Hexo 部署

Hexo CMD

Init 初始化

new 新建

generate 生成

publish 草稿

server 服务器

deploy 部署

render

migrate

clean 清理

list

Hexo _Config.yml

Home page setting

Hexo Theme

Fluid

自带的内置图标库

Hexo Note

Hexo Permalink简化

hexo 图片链接问题

注意

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

hexo 开启RSS订阅 feed atom

RSS阅读器

hexo 静态网页压缩

1. hexo-neat

集成插件 hexo-neat

2. gulp

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

3. Hexo-all-minifier

Hexo Sitemap

生成sitemap.xml

提交sitemap.xml

收录查询

手动生成Sitemap文件

Hexo-SEO-AutoPush的使用

注意:

Comment 评论系统

cusdis 系统

twikoo 系统

remark42

部署平台(托管平台)

一些资源

一些知识

Creative Commons licenses

Gravatar & Cravatar

Gravatar

Cravatar (cn)

Hexo 静态博客 我的新博客相关推荐

最新文章

热门文章

Hexo 静态博客我的新博客

生成`sitemap.xml`

提交`sitemap.xml`

Hexo 静态博客我的新博客相关推荐