langchain supabase website chatbot

Langchain＆Supabase-为您的网站创建Chatgpt聊天机器人

使用Langchain，Supabase，TypeScript，OpenAI和Next.js为您的网站创建Chatgpt聊天机器人。 Langchain是一个框架，使构建可扩展的AI/LLM应用程序变得更加容易。 Supabase是一个开源Postgres数据库，可以使用PG向量扩展名存储嵌入。

教程视频

如果您需要帮助，请通过Twitter取得联系

此存储库和教程的视觉指南在visual guide文件夹中。

发展

1. 克隆仓库

 git clone [github https url]

2. 安装软件包

 pnpm install

3. 设置您的.env文件

• 将.env.local.example复制到.env您的.env文件应该看起来像这样：

 OPENAI_API_KEY=

NEXT_PUBLIC_SUPABASE_URL=
NEXT_PUBLIC_SUPABASE_ANON_KEY=
SUPABASE_SERVICE_ROLE_KEY=

• 访问OpenAI以检索API键，然后插入.env文件中。
• 访问supabase以创建数据库并根据DOCS指令在用户仪表板中检索键

4. 在config文件夹中，用您的网站URL替换数组中的URL（脚本需要多个URL）。

5. 在utils/custom_web_loader.ts中， load函数中的title ， date和content值替换为您想从给定的网页提取的文本的CSS元素。您可以在此处了解有关如何使用Cheerio的更多信息

您可以将自定义元素添加到元数据中以满足您的需求，但是请注意，根据以下的默认加载程序格式， pageContent和metadata至少将包含source属性作为返回值的字符串：

 async load(): Promise<Document[]>{
  const $ = await this.scrape();
      const text = $("body").text();
    const metadata = { source: this.webPath };
    return [new Document({ pageContent: text, metadata })];
  }

pageContent和metadata稍后将存储在您的Supabase数据库表中。

6. 在您的supabase SQL编辑器中复制并运行schema.sql

• 交叉检查数据库中存在的documents表以及match_documents功能。

？刮擦和嵌入的说明

在scripts/scrape-embed.ts中运行刮擦和嵌入脚本。TS简单地运行：

npm run scrape-embed

该脚本将访问config文件夹中指出的所有URL，并提取您在custom_web_loader.ts文件中指定的数据。

然后，它将使用OpenAI的嵌入（ text-embedding-ada-002 ）将刮擦数据转换为向量。

运行应用程序

一旦您验证了已成功添加到Supabase表中的嵌入和内容，就可以运行应用程序npm run dev并输入一个问题以询问您的网站。

信用

此存储库的前端灵感来自Langchain-Chat-Nextjs

该回购使用生产力专家托马斯·弗兰克（Thomas Frank）网站的深入概念指南。