注：本文已发布超过一年，请注意您所使用工具的相关版本是否适用

在 hexo 中通过 algolia 实现全文搜索

问题

The latest version of the Hexo-Algolia plugin removes the content indexing feature, given Algolia’s free account limitation.

通过主题官方的文档我们发现，全文索引的功能已经被移除了，原因是因为会出现Record Too Big的报错，查阅 algolia 的文档我们可以发现免费账号，单条索引的上限为10kB, 商业版用户的索引上限为20KB

解决

请先按照上文提到的主题配置说明配置之后进行如下操作

1. 替换插件

   在package.json中替换下面这一行

   1	"hexo-algolia": "https://github.com/mohuishou/hexo-algolia"

2. 修改主题文件themes\next\source\js\algolia-search.js

   将instantsearch.widgets.hits方法中, item 对应的返回值替换为以下内容

   1 2 3 4 5 6 7 8 9 10 11 12

   return ( '<a href="' + link + '" class="algolia-hit-item-link">' + '<div class="algolia-hit-item-title">' + data._highlightResult.title.value + "</div>" + '<div class="algolia-hit-item-content">' + data._snippetResult.raw.value + "</div>" + "</a>" );

   这两步做完其实就已经完成的了全文索引，但是搜索结果会把所有内容返回，我们其实只需要匹配关键词附近的结果

3. 开启 Attributes to snippet 特性

   如下图所示点击索引->配置， 然后再到左侧列表中选中Snippeting

   

   然后如图所示添加字段raw, 右侧为显示的字符数，可以根据需求修改

   

   到这里就大功告成了，但是关键词还不够突出，可以再做一些美化

4. 美化搜索结果

   在source/_data中新增styles.styl文件

   1 2 3 4 5 6 7 8 9 10 11 12 13

   em { color: red; font-style: normal; } .algolia-hit-item-title { font-weight: bold; } .algolia-hit-item-content { font-size: 0.8em; color: #555; }

   修改_config.yml

   1 2 3

   theme_config: custom_file_path: styles: source/_data/styles.styl

   ok! 大功告成

效果

1. 优化前:

   随意找了一个博客的截图，显示只有标题，没有的高亮以及详情
   

2. 优化后:
   

原理

原理其实很简单，获取文章原始markdown内容，判断大小如果超过指定大小(默认 8K)就进行截断

1
2
3
4
5
6
7
8
9
10
11

// 获取原始内容
var rawBuf = new Buffer(data.raw);
// 获取大小限制
var rowSize = options.maxRawSize * 1024;
if (rawBuf.length > rowSize) {
  // 超出限制，进行截断
  storedPost.raw = rawBuf.toString("utf8", 0, rowSize);
  // 去除最后一个字符
  // 由于截断是按照字节截断的，但是一个中文字符不止一个字节，可能会导致最后一个字符乱码
  storedPost.raw = storedPost.raw.substring(0, storedPost.raw.length - 1);
}

详情可以查看 PR: Feature/add raw max len

关注我获取更新

猜你喜欢

• 给博客添加章节目录
• 使用 Notion Database 管理静态博客文章
• Gin源码阅读 从0.1开始
• go generate and ast
• Go Struct 初始化风格的抉择