引入algolia并自定义crawler爬虫

Jack原创大约 2 分钟

本文介绍，在Vuepress中实现自定义algolia crawler爬虫来实现网站全文搜索功能。

背景介绍

网站的全文搜索功能是必备利器。经过对比选中algolia

建议有特殊需求可以寻求Pro版本，本实践是使用algolia提供的免费服务来实现全文搜索。

本实践针对本网站实现全文搜索功能。其他网站可以参考本文档修改配置文件来实现。

实践步骤

1.创建algolia账号

访问 https://www.algolia.com/ 输入你的邮箱，创建账号。
创建项目Application name 索引名称 Index name
记录应用的id和访问key。

algolia账号索引

2.在docker中自定义爬虫

docker运行命令

docker run -itd --env-file=.env -e "CONFIG=$(cat config.json | jq -r tostring)" \
	--name aloglia-scraper algolia/docsearch-scraper

.env 文件内容如下

APPLICATION_ID=MXXXXXXXX
API_KEY=972xxxxxxxxxxxxxxxxxxxxxxx

config.json 文件内容如下
example.com 请适当替换成你的网站地址

{
  "index_name": "example.com",
  "start_urls": [
    "https://example.com/"
  ],
  "sitemap_urls": [
    "https://example.com/sitemap.xml"
  ],
  "stop_urls": [],
  "selectors": {
    "lvl0": {
      "selector": "p.sidebar-heading.open",
      "global": true,
      "default_value": "Documentation"
    },
    "lvl1": "main h1",
    "lvl2": "main h2",
    "lvl3": "main h3",
    "lvl4": "main h4",
    "lvl5": "main h5",
    "text": "main p, main li",
    "lang": {
      "selector": "/html/@lang",
      "type": "xpath",
      "global": true,
      "default_value": "zh-CN"
    }
  },
  "strip_chars": " .,;:#",
  "custom_settings": {
    "attributesForFaceting": [
      "lang"
    ]
  },
  "conversation_id": [
    "1585404165"
  ],
  "scrape_start_urls": false,
  "nb_hits": 40079
}

3.查看日志

docker logs -f aloglia-scraper
aloglia-scraper 为容器名称

......
> DocSearch: https://xxxxx/20240227_ReLU.html 16 records)
> DocSearch: https://xxxx/20240226_tanh%E5%87%BD%E6%95%B0.html 18 records)
> DocSearch: https://xxxx/20240226_sigmoid%E5%87%BD%E6%95%B0.html 17 records)
> DocSearch: https://xxxx/20240225_%E5%87%BD%E6%95%B0%E6%B1%82%E5%AF%BC.html 58 records)
> DocSearch: https://xxxx/20240225_e.html 20 records)
> DocSearch: https://xxxx_%E7%BB%93%E6%9E%84%E5%8C%96%E7%9A%84Prompts.html 43 records)
> DocSearch: https://xxxxxx.html 109 records)

Nb hits: 37,682

4.后台查看数据

records 37,682 # events 19 avg. record size 694.72B

5.Vueepress配置

docsearch: {
      appId: 'xxxxxxxx',
      apiKey: '0xxxxxxxxxxxxxxxx',
      indexName: 'indexName',
      locales: {
        '/': {
          placeholder: '搜索文档',
          translations: {
            button: {
              buttonText: '搜索文档',
            },
          },
        }
      },
    }

注意安装 npm i -D @vuepress/plugin-docsearch

6.部署检查

通过浏览器访问你的网站，输入关键词，查看搜索结果。

algolia搜索结果

参考资料

algolia官网
algolia DocSearch configurations开源库
***** This repository is not maintained anymore in favor of our new infrastructure.
自定义抓取官方说明
参考配置文件