刚开始使用github+hexo建立blog博客。参考了不少文章，发现大部分作者采用的主题为iissan 创建的 NexT。NexT 主题默认提供了两个站内搜索解决方案：swiftype 和 tinysou，所以大都比较好配置。
对于不想使用NexT主题，然而喜欢的主题又没有提供站内搜索方案的时候，可能就比较折腾了。有人不想使用swiftype 和 tinysou方法也可能是基于某些其他原因：
- 不愿意受限于第三方服务：第三方服务随时可能完蛋，风险大受限多。原本建独立博客目的就是为了不受限，如此这般， swiftype 就是如此原因；
- 第三方服务样式单一；
- 第三方服务，需要应用第三方JS，存在安全问题；
后经过大量搜索查询，发现目前Hexo已经有比较满意的解决方法了。
1. 基本思路
- Step1： 生成索引文件；
- Step2： 有效的算法：根据用户输入的检索词，返回包含检索词的文章列表；
- Step3 ：使用 JavaScript 和 jQuery 来实现在浏览器中执行算法；
- Step4 ：在页面的合适位置展示搜索框和输出结果；
- Step5 ：美化。
2. 使用 hexo-generator-search 生成索引文件
这一步在网上大部分文章中都有提及，安装 hexo-generator-search 的生成器，在执行 hexo generate 的过程中，会按照配置生成一个 XML 文件，用于保存全站的文档数据。这个 XML 文件只是简单地做了数据的结构化存储，而完全没有考虑分词、倒排等问题。
安装 hexo-generator-search
npm install --save hexo-generator-search
在站点配置文件 _config.yml 当中写入如下配置，即可为全站的文档生成索引文件
search:
path: search.xml
field: post
hexo-generator-search 会为全站所有 post 类型的页面生成结构化的数据，并保存在本站的 /search.xml 当中。若想让 page 类型的页面也纳入索引，则可以将 field 的值修改为 all。
3. 使用 JavaScript 和 jQuery 实现检索算法
以 jQuery 的文本匹配为基础，在前端界面上运行站内搜索。文件在这里local_search.js。主要的处理流程是：
- 载入 search.xml；
- 解析 search.xml；
- 解析检索词；
- 在索引中进行字符串匹配；
- 展现结果。
search.js 依赖 jQuery。因此，你需要在引入 search.js 之前，引入 jQuery 的脚本。比如，你可以在 head 部分这样做：<script src="//cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>。
4. 在页面的合适位置展示搜索框和输出结果
<form class="site-search-form">
<input type="text" id="local-search-input" class="st-search-input" />
</form>
<div id="local-search-result" class="local-search-result-cls"></div>
local-search-input 是一个输入框，用于接收用户输入的检索词；local-search-result 是用于展现搜索结果的 div 标签。这部分代码参考： hexo-search-plugin-snippets
5. 调用函数
现在，已经有了索引文件、搜索算法和搜索框。但是，现在而言，搜索框是孤立的：用户在搜索框中输入内容，并不会触发搜索算法。换而言之，搜索函数并没有调用。因此，我们需要调用定义在 search.js 当中定义的 searchFunc。
var path = "/search.xml";
searchFunc(path, 'local-search-input', 'local-search-result');
在网上找到了两位老师分享这种方法，但是您们没告诉小白要把这个东西写到哪儿才能起到调用的做用。解答如下：在你的layout文件中script最多的地方加入这么一句话：
<script type="text/javascript" src="/js/local_search.js"></script>
/js/local_search.js是你项目文件的地址。
6. 美化
Liam0205 提供 search.stylus 的样式。样式美化，每个人想法不一样，开心就好。
参考资料
