Algolia DocSearch 文档内容搜索

本文地址

---

目录

目录

• 目录
• Algolia DocSearch
  • 简介
  • 基本原理
  • 申请步骤
    • 申请条件
    • 邮件内容
  • 集成步骤

Algolia DocSearch

• Algolia DocSearch
• 文档
• GitHub
• 几个文件内搜索软件对比(非开发者工具)

The easiest way to add search to your documentation.

DocSearch crawls 抓取 your documentation, pushes the content to an Algolia index and provides a dropdown 下拉 search experience on your website.

简介

相对于其它一些全文搜索方案，Algolia DocSearch 的主要优势在于，它是专门针对在线文档搜索这一需求的。不需要繁琐的配置，也不需要自己有数据库等软硬件支持，而只需在自己网站中插入少量代码就可以实现强大的文档搜索功能了。

Algolia DocSearch 可以说算是目前构建可在线搜索文档的最简单的方式之一了，你只需要关注文档本身，进行少量的配置，其它的 Algolia 全包了。

DocSearch 可以免费使用，而且不用注册，当然，也有收费的服务可供选用，差异在于技术支持和请求频率限制等方面不同。

基本原理

根据官方的说明，在你通过申请后，其服务器会定期抓取（免费用户抓取周期是 24 小时）你的网站内容并分析，对文档的各级标题、段落等内容建立索引，这样，在网站中加入搜索框之后，用户输入关键时是便可以请求 DocSearch 的接口并显示搜索结果了。这些请求、结果显示相关的逻辑都封装好了，你要做的只是要按要求插入代码、样式以及那个搜索框。

How it works?

We scrape 抓取 your documentation, configure the Algolia application and send you the snippet 片段 you'll have to integrate 集成.

• Scraping：We leverage 利用 the Algolia Crawler to index every section 部分 of your documentation.
• Configuration：You don’t need to configure any settings or even have an Algolia account. We take care of this automatically.
• Implementation：We'll send you a small snippet to integrate DocSearch to your website!

申请步骤

参考文章

1、在 apply 页面填写申请

只需要提供自己的网站地址和邮箱即可，不需要注册。同时需要确认并勾选下面的 3 个提示复选框，然后进行申请。

baiqiantao@gmail.com
https://www.cnblogs.com/baiqiantao/
https://baiqiantao.github.io/vuepressBlog/

2、收到确认邮件并确认

提交申请之后不久，你所填写的邮箱就会收到一封询问邮件。里面说明你的网站技术上是否支持写用 DocSearch。如果支持，还会询问你是否能修改源码向其中注入需要的代码。你需要回复邮件进行确认。

3、DocSearch 对你的文档网站首次爬取页面数据，并通过邮件向你发送需要注入的代码及相关操作指导

这两步都需要对方人工处理，而且根据你的网站复杂程序，需要等待的时间会有差异。我是等了 3 天才收到回复，而且还是拒绝的回复。

4、根据邮件提示修改网站代码

邮件主要包括 apiKey、indexName 等配置信息。最后根据自己的喜好及需要，调整搜索框及搜索下拉弹出框的样式。

申请条件

• 您必须是该网站的 owner (所有者)，或者至少具有更新其内容的权限。您需要在前端 包含一个 JavaScript 片段 以实现 DocSearch。
• 您的网站必须是 publicly available (公开的)。我们不托管仅在身份验证后可用或托管在专用网络上的网站的搜索索引。
• 您的网站必须是 technical documentation of an open source project or a technical blog (开源项目的技术文档或技术博客)。我们不索引商业内容。
• 您的网站必须已做好 production ready (生产准备)。我们不会索引空的网站或那些充满占位符内容的网站。请等到你写了一些文件再申请。

邮件内容

Thanks for your interest 关注! This is great news to know that you'd like to entrust 委托 your search to DocSearch.
A good search experience is key to help your users discover your content.

We had a look at the link you provided and it seems that your website is not compliant with DocSearch's policy.
We only offer DocSearch for documentations of technical projects and, unless we missed something, it seems like your website does not fit this criteria 标准.

We're really sorry to have to turn down 拒绝 your request, but we are receiving so many applications everyday that we now have to give priority 优先 to compliant 合规 websites. We hope you understand.

Nevertheless 然而, that doesn't mean that Algolia doesn't fit your needs, you could build a dedicated search experience 构建专门的搜索体验 or run DocSearch on your own with your dataset 数据集 hosted on 托管在 a free community plan 免费社区计划.

On Sun, Nov 21, 2021 at 5:42:56 CET, baiqiantao@gmail.com wrote:
https://www.cnblogs.com/baiqiantao/

集成步骤

• 集成文档
• 配置项

1、安装

npm install @docsearch/js@alpha   # 使用 npm 安装
yarn add @docsearch/js@alpha      # 使用 yarn 安装

如果不想使用包管理器，可以使用独立端点(endpoint)：

<script src="https://cdn.jsdelivr.net/npm/@docsearch/js@alpha"></script>

2、首先，您需要提供一个 container 来让您的 DocSearch 组件进入。如果您还没有，可以插入以下的一个标记：

<div id="docsearch"></div>
<!-- 确保提供一个 container (例如 div)，而不是一个 input -->

3、然后，通过调用 docsearch api 并提供 container 将 DocSearch 插入其中。它可以是 CSS selector 或 Element。

import docsearch from '@docsearch/js';
import '@docsearch/css';

docsearch({
  container: '#docsearch',
  appId: 'YOUR_APP_ID',
  indexName: 'YOUR_INDEX_NAME',
  apiKey: 'YOUR_SEARCH_API_KEY',
});

4、性能优化(可选)：Preconnect

将下面代码段添加到您网站的 head 中，可以提示浏览器该网站将从 Algolia 加载数据，并允许它预连接到 DocSearch 集群。它会使第一个查询更快，尤其是在移动设备上。

<link rel="preconnect" href="https://YOUR_APP_ID-dsn.algolia.net" crossorigin />

2018-12-10