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
完了です。