利用 AI 增強您的網站:使用 Flowise 嵌入 GPT 聊天機器人

利用 AI 增強您的網站:使用 Flowise 嵌入 GPT 聊天機器人

在本分步教學中,我將指導您在您的網站上提供聊天界面。我們將在 Hugging Face 上部署 Flowise,並使用它來創建一個聊天機器人。這個機器人將在 Pinecone 向量儲存庫中索引您網站的內容,並利用 OpenAI GPT 進行自然語言處理 (NLP)。

首先,您需要訪問 OpenAI 的 LLM 和 Pinecone 向量儲存庫。請注意,Flowise 與其他各種 LLM 兼容,例如 VerxtexAI、LocalAI 和 Hugging Face 上的某些模型,以及其他向量儲存庫,例如 Qdrant、Supabase、FAISS 或 Chroma。

要訪問 OpenAI,請創建一個帳戶並在此頁面生成一個 API 密鑰。確保安全地儲存它。

另外,請在 Pinecone 上註冊,創建一個新的 聊天應用程序 項目,並設置一個新的索引(例如,yogarkana)。

確保您的向量儲存庫配置了 1536 個維度(與 OpenAI 嵌入模型匹配)並使用餘弦距離來衡量向量相似度。

然後,從 Pinecone 管理控制台檢索您的 API 密鑰和 環境 值。

Flowise 是一個開源的、無代碼的可視化工具,它利用了 LangchainJS。它可以在本地、Docker 容器或雲平台上部署。在本指南中,我們將在 Hugging Face 空間中使用 Docker。

如果您沒有 Hugging Face 帳戶,請創建一個,然後創建一個新的空間

在本教學中,我將其命名為 Flowise,選擇了 Docker 和一個 空白 模板。

在設置菜單中,將 PORT 變量設置為 7860,並創建 FLOWISE_USERFLOWISE_PASSWORD 密鑰以確保安全訪問。

文件 視圖中,使用以下內容創建一個新的 Dockerfile:

FROM node:18-alpine
USER root

ARG FLOWISE_PATH=/usr/local/lib/node_modules/flowise
ARG BASE_PATH=/root/.flowise
ARG DATABASE_PATH=$BASE_PATH
ARG APIKEY_PATH=$BASE_PATH
ARG SECRETKEY_PATH=$BASE_PATH
ARG LOG_PATH=$BASE_PATH/logs

RUN apk add --no-cache git python3 py3-pip make g++ build-base cairo-dev pango-dev chromiumENV PUPPETEER_SKIP_DOWNLOAD=true
ENV PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium-browser

RUN npm install -g flowise

RUN mkdir -p $LOG_PATH $FLOWISE_PATH/uploads && chmod -R 777 $LOG_PATH $FLOWISE_PATH

WORKDIR /data
CMD [“npx”, “flowise”, “start”]

Hugging Face 將在幾分鐘內完成所有構建,使 Flowise 可供使用!

我們的首要任務是抓取網站內容,獲取相關的嵌入向量,並將它們存儲在 Pinecone 中。

在 Flowise UI 中,選擇並鏈接您的組件。從 Cheerio Web Scraper 開始。

注意:在示例屏幕截圖中,抓取工具配置為索引單個頁面。調整 URL鏈接限制CSS 選擇器 參數以定位特定內容。

接下來,添加一個 HtmlToMarkdown 文本拆分器 將 HTML 轉換為 Markdown 並根據 Markdown 標題拆分內容。鏈接這兩個組件。

抓取的文檔將發送到 OpenAI,返回的向量將存儲在 Pinecone 中。為此添加兩個新組件,並使用之前生成的 OpenAI 和 Pinecone 密鑰配置它們。

最後,添加一個 ChatOpenAI 代理和一個 會話檢索 QA 鏈 來激活流程。再次需要 OpenAI 密鑰。

設置並保存聊天流程後,通過從 Flowise 控制台啟動聊天來啟動更新插入。這將觸發抓取和索引過程。

在 Pinecone 控制台中檢查您的索引。

使用向量儲存庫中的嵌入,創建一個單獨的流程來與用戶進行聊天互動。

重複使用 OpenAI 嵌入ChatOpenAI 以前的組件。對於向量儲存庫,選擇 Pinecone 加載現有索引 組件,使用與更新插入流程中相同的參數。

使用基於文檔的 QA 的 會話檢索 QA 鏈 完成流程,啟用聊天回复中指向文檔的鏈接。

要改進聊天機器人,請使用 系統消息鏈選項 為一般說明設置其他參數。例如,我將我的機器人配置為使用法語進行對話。

現在聊天機器人已經可以使用了,請將其嵌入到您的網站中。Flowise 提供 API 和各種嵌入選項,以及隨時可用的代碼(shell、Python、JavaScript)。

選擇 嵌入彈出 Html 選項,然後將提供的代碼複製/粘貼到我們網站的代碼中。

導航到您修改後的網站,開始向聊天機器人提問!

通過選中 Flowise 中的 顯示嵌入聊天配置 框並修改小部件參數來自定義彈出窗口。您可以更改顏色、頭像和消息。

要進行更廣泛的定制,請在 GitHub 上 fork Flowise Chat Embed 儲存庫並修改小部件的源代碼。更新嵌入腳本以從您 fork 的儲存庫導入代碼。

總之,使用 Flowise、Pinecone 和 Hugging Face 將 GPT 驅動的聊天機器人集成到您的網站中是一種增強用戶體驗的先進方法。借助這些工具,您不僅可以自動化互動,還可以利用 AI 的力量為您的訪客提供實時、高效和個性化的回复。