nextjs openai doc search

next.js Openai Doc搜索入门

该启动器在pages目录中获取所有.mdx文件，并将其处理以在OpenAI文本完成提示中用作自定义上下文。

部署

将此起动器部署到Vercel。 Supabase Integration将自动设置所需的环境变量并配置数据库架构。您要做的就是设置OPENAI_KEY ，您就可以开始了！

[

技术细节

构建自己的自定义Chatgpt涉及四个步骤：

1. [？构建时间]预处理知识库（您的pages文件夹中的.mdx文件）。
2. [？构建时间]将PGVECTOR的Postgres存储嵌入。
3. [？ [运行时]执行矢量相似性搜索以查找与问题相关的内容。
4. [？ Runtime]将内容注入OpenAI GPT-3文本完成提示，并将其流向客户端。

？建立时间

步骤1和2。发生在构建时间，例如，当Vercel构建您的下一个js应用程序时。 generate-embeddings此期间

测序图
    参与者Vercel
    参与者DB（PGVECTOR）
    参与者OpenAI（API）
    循环1。预处理知识库
        vercel- >> vercel：块.mdx页面
        循环2。创建和存储嵌入
            Vercel- >> OpenAI（API）：为页面创建嵌入
            OpenAI（API） -  >> VERCEL：嵌入向量（1536）
            Vercel- >> DB（PGVECTOR）：页面部分的存储嵌入
        结尾
    结尾

除了存储嵌入式外，此脚本还为您的每个.mdx文件生成校验和存储在另一个数据库表中，以确保仅在文件更改时才能再生嵌入。

？运行时

步骤3和4。在用户提交问题时，在运行时发生。发生这种情况时，执行以下任务序列：

测序图
    参与者客户
    参与者边缘功能
    参与者DB（PGVECTOR）
    参与者OpenAI（API）
    客户端 -  >>边缘函数：{查询：lorem ispum}
    关键3。执行矢量相似性搜索
        边缘功能 -  >> OpenAI（API）：创建查询的嵌入
        OpenAI（API） -  >>边缘功能：嵌入向量（1536）
        边缘功能 -  >> db（pgvector）：向量相似性搜索
        db（pgvector） -  >>边缘功能：相关文档内容
    结尾
    关键4。将内容注入提示
        边缘功能 -  >> OpenAI（API）：完成请求提示：查询 +相关文档内容
        OpenAI（API） -  >>客户端：文本/事件流：完成响应
    结尾

有关此的相关文件是SearchDialog （client）组件和vector-search （边缘函数）。

数据库的初始化，包括pgvector扩展程序的设置，存储在supabase/migrations文件夹中，该文件夹在运行supabase start时自动应用于您的本地Postgres实例。

地方发展

配置

• cp .env.example .env
• 将您的OPENAI_KEY设置在新创建的.env文件中。
• set NEXT_PUBLIC_SUPABASE_ANON_KEY和SUPABASE_SERVICE_ROLE_KEY run：

  注意：您必须运行supabase才能检索钥匙。

启动supabase

确保您在本地安装并运行Docker。然后运行

supabase start

要检索NEXT_PUBLIC_SUPABASE_ANON_KEY和SUPABASE_SERVICE_ROLE_KEY run：

supabase status

启动next.js应用

在新的终端窗口中，运行

pnpm dev

使用您的自定义.mdx文档

1. 默认情况下，您的文档将需要以.mdx格式为.mdx。这可以通过重命名现有（或兼容）Markdown .md文件来完成。
2. 运行pnpm run embeddings到再生嵌入。

   注意：确保supabase正在运行。要检查，请运行supabase status 。如果不运行supabase start 。

3. 再次运行pnpm dev以刷新nextjs localhost：3000渲染页。

了解更多

• 阅读有关我们如何为supabase文档构建chatgpt的博客文章。
• [DOCS] PGVECTOR：嵌入和向量相似性
• 观看格雷格（Greg）在兔子综合症YouTube频道上的“我如何构建此视频”视频：

执照

Apache 2.0