Algoliaを使ったウェブサイトの全文検索
1. はじめに
私は自分のノートにローカル検索を使用していましたが、どうしても検索できない内容がありました。インターネットで検索した結果、Algolia DocSearchというサードパーティの検索サービスを見つけ、個人ウェブサイトの全文検索を実現することができました。
2. Algolia
VuePressの公式ドキュメントではAlgolia検索が使われています。Algoliaを使用する最大の利点は、その便利さです。Algoliaはウェブサイトのコンテンツを自動でクロールしてインデックスを作成します。ユーザーはAlgoliaサービスに申し込み、ウェブサイトにいくつかのコードを追加するだけで、まるで解析コードを追加するように、全文検索機能を実現できます。
3. 全文検索の実装
1. Algolia DocSearchサービスの申し込み
Algolia DocSearch Applyのウェブサイトにアクセスし、ウェブサイトのURL、メールアドレス、リポジトリのURLなどの情報を入力し、申し込みを送信します。
注: 入力するウェブサイトのURLは公開されていて、完全で安定している必要があります。サイトがテスト段階にある場合、承認される確率は低くなります。
2. 確認メールに返信
申し込みが承認されると、Algolia DocSearchから確認メールが前のステップで入力したメールアドレスに送信されます。受信した後、このウェブサイトが私たちによって開発・保守されており、ウェブサイトのコードを変更できることを確認する返信を送る必要があります。
返信内容: Thanks! I am the maintainer of the website, I can modify the code.
その後、翌日にappId、apiKey、indexNameを含むメールが届きます。これらはウェブサイトのフレームワークに設定するために必要です：
3. 検索サービスの開始
Algolia DocSearchからのメールには、ウェブサイトのフレームワークに設定するためのappId、apiKey、indexNameが含まれています。私のノートテンプレートにはすでにこの設定が含まれています。その他のフレームワークでも同様です：
メールには招待を受けるリンクも含まれています。リンクからパスワードを再設定した後（アカウントは申し込んだときのメールアドレスです）、Algoliaにログインできます。
ログイン後、対応するプロジェクトを選択します。これはindexNameと同じ名前です：
「Go To Crawler」ボタン（上図の青いボタン）をクリックして、クロールバックエンドに進みます。そこで新しいサイトへアクセスするように促されます：新しいウェブサイト：
クロールに進むにはクリックします：
上の画像の赤枠内の数字が0の場合は、次のステップを実行します：
左側のメニューで「Editor」をクリックして、クロールコードを確認・編集します。コード内のpathsToMatchパスに注意してください（画像内の白枠）。明らかに間違っています。後ろに余分なdocsがあります。それを正しいウェブサイトのパス https://biji.675222.xyz/** に変更します：
理由は、私たちのウェブサイトのホームページがhttps://biji.675222.xyz/で、検索したいコンテンツもここにあるからです。
変更が完了したらテストを実行します（画像内の赤枠部分）。データが正常に抽出されると（画像内の黄色枠のような内容）、右上の「Save」ボタンをクリックしてコードを保存します。その後、「Overview」に戻り、右上の「Restart crawling」をクリックして再度クロールを実行します。
もしデータが抽出できない場合は、以下を参照してください：https://github.com/mqyqingfeng/Blog/issues/267#issuecomment-1078620438
完了です。
