个人独立站接入 Algolia 搜索（NotionNext）

type

status

date

slug

summary

📝 背景介绍

在信息密度不断上升的内容网站中，高效、快速的站内搜索功能已成为提升用户体验的关键要素。

对于许多使用静态网站生成器（如 Next.js、Hugo、NotionNext 等）构建的个人独立站点来说，如何在不引入复杂后端的前提下提供强大的搜索能力，是一个常见需求。

Algolia 是一个托管型搜索即服务（Search-as-a-Service）解决方案，提供了超快的搜索响应、 typo 容错、实时索引等强大功能，非常适合中小型独立站点快速集成。

本篇以 NotionNext 为例介绍如何快速集成 Algolia 搜索。

在最后一步导入数据时，可以先选择跳过：

在左侧菜单栏下方，找到 Data sources, 点击进入后，再点击 Indices → Create Index

输入索引名称，这里记住在后面配置 NotionNext 环境变量时需要。

创建完应用的索引之后，我们再到设置中查看应用的 API Keys，点击左侧菜单栏最下方的Settings，再点击 API Keys。

到这里 Algolia 已经配置完了，接下来回到我们 NotionNext 配置环境变量。

环境变量描述如下：

变量名	描述
NEXT_PUBLIC_ALGOLIA_APP_ID	应用ID
NEXT_PUBLIC_ALGOLIA_INDEX	数据库名，Algolia可创建多个数据库，这里配置要关联的Index
NEXT_PUBLIC_ALGOLIA_SEARCH_ONLY_APP_KEY	客户端搜索文章用的秘钥，会暴露给浏览器
ALGOLIA_ADMIN_APP_KEY	管理端秘钥，后台上传文章内容会用到。