LangChain Streamlit 聊天機器人實作

目前 LangChain 框架盛行，搭配 Streamlit 快速建立網頁應用程式的特性，兩者結合可以開發出功能強大的聊天機器人應用。本文將逐步說明如何整合 LangChain 和 Streamlit，從設定開發環境、安裝必要套件、設計聊天介面、處理使用者輸入、串接 OpenAI GPT 模型產生回應，到最後佈署應用程式上線，提供完整開發流程與程式碼範例。同時，我們也會使用流程圖和圖表，讓讀者更容易理解每個步驟的細節和整體架構。透過本文的實作教學，讀者可以快速上手，建立自己的網頁聊天機器人應用。

資料分析函式

def data_analysis_tool(data):
    try:
        # 將資料分割並提取溫度和濕度
        temperature = int(data.split("Temperature: ")[1].split("°C")[0])
        humidity = int(data.split("Humidity: ")[1].split("%")[0])

        # 檢查溫度和濕度是否超過正常範圍
        if temperature > 25 and humidity > 50:
            return "偵測到高溫和濕度，可能需要進行調整。"
        else:
            return "溫度和濕度在正常範圍內，無需採取行動。"

    except (IndexError, ValueError):
        return "錯誤：無效的資料格式，無法進行分析。"

工具設定

tools = [
    Tool(
        name="資料分析工具",
        func=data_analysis_tool,
        description="對提供的資料進行資料分析任務。"
    )
]

決策提示設定

decision_prompt = PromptTemplate(
    input_variables=["data_insights"],
    template="""
根據資料洞察：{data_insights}，請對適合的行動進行決策。
請提供明確且簡潔的決策，以及簡短的理由。
"""
)

執行流程

1. 資料分析：使用 data_analysis_tool 函式對提供的資料進行分析，檢查溫度和濕度是否超過正常範圍。
2. 工具設定：設定 tools 列表，包含 Tool 物件，指定名稱、函式和描述。
3. 決策提示：設定 decision_prompt 物件，指定輸入變數和範本字串，用於生成決策提示。

圖表翻譯

圖表翻譯：

此流程圖描述了資料分析工具的運作流程。首先，開始進行資料分析，然後檢查溫度和濕度是否超過正常範圍。根據分析結果，生成決策提示，最終輸出結果。

建立自訂代理並應用於實時資料分析

初始化代理

首先，我們需要初始化一個代理，該代理將負責處理實時資料並根據資料分析結果做出決策。這個過程涉及到載入語言模型、定義工具以及建立決策提示。

代理 = 初始化代理(
    工具列表,
    OpenAI(溫度=0.7),
    代理="零拍反應描述",
    說明=True
)

處理實時資料並做出決策

接下來，我們定義了一個函式，負責從資料檢索工具中取得最新的實時資料，然後使用代理根據資料分析結果做出決策。

def 處理資料並做出決策():
    資料 = 資料檢索工具()
    決策 = 代理執行(決策提示格式(資料洞察=資料))
    return 決策

示例使用

以下是一個示例，展示瞭如何在無限迴圈中不斷檢索資料、做出決策並列印決策結果。

while True:
    決策 = 處理資料並做出決策()
    print("決策:", 決策)
    # 根據決策執行相應的動作
    input("按Enter鍵檢索下一批資料...")

重點摘要

在本章中，我們成功建立了一個自訂代理，並使用 LangChain 進行了實時資料分析。同時，我們探討了語言模型的載入、工具的定義、提示的建立以及代理在客戶支援自動化、個人化推薦和實時資料分析等領域的實際應用。透過玄貓的增強，代理能夠進行更自然和連貫的對話。

回顧問題

1. 建立自訂代理的第一步是什麼？ A. 定義工具 B. 載入語言模型 C. 建立提示 D. 將工具繫結到語言模型

2. 哪個函式允許代理記住之前的互動？ A. 代理動作 B. 對話緩衝記憶 C. 聊天提示範本 D. 代理執行器

3. 代理在客戶支援中的實際應用是什麼？ A. 生成隨機資料 B. 自動處理常見客戶詢問 C. 管理系統更新 D. 分析伺服器日誌

4. 哪個工具用於檢索最新的實時資料？ A. 資料分析工具 B. 資料檢索工具 C. 實時資料工具 D. 決策工具

5. 為代理新增記憶的好處是什麼？ A. 更快的回應時間 B. 增強的上下文感知互動 C. 計算準確性的提高 D. 簡化的程式碼函式庫

答案

1. B
2. B
3. B
4. B
5. B

內容解密：

以上程式碼示例展示瞭如何建立一個自訂代理並將其應用於實時資料分析。代理的初始化涉及到載入語言模型和定義工具。然後，透過一個函式不斷地檢索最新的實時資料，並使用代理根據資料分析結果做出決策。這個過程在一個無限迴圈中重複，展示了代理在實時資料分析中的應用。同時，回顧問題和答案部分幫助讀者鞏固對代理建立和應用的理解。

圖表翻譯：

此圖表展示了建立和使用自訂代理的流程，從初始化代理開始，到載入語言模型、定義工具、建立決策提示，然後處理實時資料、做出決策，最後執行相應的動作並檢索下一批資料。這個流程不斷重複，體現了代理在實時資料分析中的連續工作過程。

建立 LangChain 基礎的聊天應用程式

在這個章節中，我們將結合兩個強大的工具，LangChain 和 Streamlit，來開發一個類別似 ChatGPT 的 LangChain 基礎 UI 應用程式。具體來說，我們將從 Jupyter Notebooks 轉移到網頁應用程式，目的是建立一個不僅功能齊全，而且具有友好使用者介面的網頁介面和生產就緒的應用程式。以下是您將要做的事情的預覽：

設定開發環境

為了開始這個專案，首先需要設定適當的開發環境。這包括安裝必要的套件和函式庫，如 LangChain 和 Streamlit。確保您已經安裝了 Python 和 pip，然後使用 pip 安裝所需的套件。

安裝 LangChain 和 Streamlit

您可以使用以下命令來安裝 LangChain 和 Streamlit：

pip install langchain streamlit

設定 LangChain

安裝 LangChain 後，需要設定它以便在您的專案中使用。這包括初始化 LangChain 並設定必要的組態。

初始化 LangChain

您可以使用以下程式碼來初始化 LangChain：

import langchain

# 初始化LangChain
llm = langchain.llms.BaseLLM()

設定 Streamlit

安裝 Streamlit 後，需要設定它以便在您的專案中使用。這包括建立一個新的 Streamlit 應用程式並設定必要的組態。

建立 Streamlit 應用程式

您可以使用以下程式碼來建立一個新的 Streamlit 應用程式：

import streamlit as st

# 建立一個新的Streamlit應用程式
st.title("LangChain基礎的聊天應用程式")

建立聊天介面

現在，讓我們建立一個聊天介面來與使用者互動。這包括建立一個文字輸入框和一個按鈕來觸發對話。

建立文字輸入框

您可以使用以下程式碼來建立一個文字輸入框：

# 建立一個文字輸入框
user_input = st.text_input("請輸入您的問題或詢問")

建立按鈕

您可以使用以下程式碼來建立一個按鈕：

# 建立一個按鈕
if st.button("提交"):
    # 處理使用者輸入
    pass

處理使用者輸入

現在，讓我們處理使用者輸入。這包括使用 LangChain 來生成回應。

使用 LangChain 生成回應

您可以使用以下程式碼來使用 LangChain 生成回應：

# 使用LangChain生成回應
response = llm(user_input)

顯示回應

您可以使用以下程式碼來顯示回應：

# 顯示回應
st.write(response)

佈署應用程式

最後，讓我們佈署應用程式。這包括使用 Streamlit 來執行應用程式。

執行應用程式

您可以使用以下命令來執行應用程式：

streamlit run app.py

這樣就完成了！現在，您已經建立了一個類別似 ChatGPT 的 LangChain 基礎 UI 應用程式。

圖表翻譯：

以下是上述程式碼的 Plantuml 圖表：

這個圖表顯示了建立 LangChain 基礎 UI 應用程式的步驟。

建立 LangChain Q&A 核心功能及 Streamlit 網頁介面

在開始構建 LangChain Q&A 核心功能和 Streamlit 網頁介面之前，讓我們先設定好開發環境。這包括安裝 Streamlit 和其他必要的依賴項。

設定開發環境

要執行 Streamlit，您需要確保 Python 已經安裝在您的桌面環境中。您可以透過以下步驟安裝 Streamlit：

1. 安裝 Streamlit：使用 pip 安裝 Streamlit，命令如下：

   pip install streamlit
   

   如果您尚未安裝 pip，可能會看到錯誤訊息。您可以從官方網站下載 get-pip.py 指令碼來安裝 pip。

2. **安裝 Python**：如果您的桌面環境中尚未安裝 Python，可能會出現錯誤。您可以從 Microsoft Store 安裝 Python：
   - 開啟新的命令提示符視窗。
   - 輸入 `python --version` 並按 Enter。如果 Python 已經正確安裝，將顯示版本號碼。否則，您需要先安裝 Python。

3. **安裝 pip**：如果您已經安裝了 Python 但缺少 pip，可以從官方 pip 網站下載 get-pip.py 指令碼：
   - 將 get-pip.py 檔案儲存到電腦上的某個位置（例如，C:\Users\abc\get-pip.py）。
   - 開啟命令提示符視窗，導航到儲存 get-pip.py 檔案的目錄。
   - 執行以下命令來安裝 pip：
     ```bash
python get-pip.py

4. 將 Python 和 pip 新增到系統的 PATH：

   • 開啟「開始」選單，搜尋「環境變數」。
   • 點選「編輯系統環境變數」。
   • 在「系統屬性」視窗中，點選「環境變數」按鈕。
   • 在「系統變數」下，滾動並找到「Path」變數，然後點選「編輯」。
   • 點選「新建」，新增 Python 安裝目錄的路徑（通常為 C:\Python39 或類別似）。
   • 再次點選「新建」，新增 Scripts 目錄的路徑（通常為 C:\Python39\Scripts）。
   • 點選「確定」以儲存更改。

5. 驗證安裝：

   • 開啟新的命令提示符視窗。
   • 輸入 pip --version 並按 Enter。如果 pip 已經安裝並可存取，將顯示版本號碼。

完成這些步驟後，您應該可以成功執行 pip install streamlit 命令。

安裝所需依賴項

接下來，您需要安裝所需的依賴項（streamlit、openai、langchain、pinecone）：

pip install streamlit openai langchain pinecone-client

確保您具有安裝套件所需的必要許可權，並且您的網際網路連線穩定。如果仍然遇到問題，可以嘗試以管理員身份執行命令提示符。

建立 Streamlit LangChain UI 應用程式

現在，您已經設定好了開發環境，是時候開始構建 Streamlit LangChain UI 應用程式了。

Streamlit 應用程式組成部分

典型的 Streamlit 應用程式由一個名為 app.py 的 Python 指令碼組成，該指令碼包含構建 Streamlit 應用程式的程式碼。它定義了您的 Streamlit 應用程式的結構、佈局和功能。在我們的案例中，這個檔案被命名為 LangChainUI.py。LangChainUI.py 檔案是主入口點，您在其中匯入必要的函式庫，定義使用者介面元件，並指定應用程式的邏輯和互動。

要執行這個 Streamlit 應用程式，使用以下命令：

streamlit run LangChainUI.py

內容解密：

上述過程涉及設定開發環境、安裝 Streamlit 和其他必要的依賴項，以及建立 Streamlit LangChain UI 應用程式。每一步驟都對於成功執行 LangChain Q&A 核心功能和 Streamlit 網頁介面至關重要。

圖表翻譯：

以下是使用 Plantuml 語法建立的流程圖，用於視覺化展示設定開發環境和安裝所需依賴項的過程：

這個流程圖展示了設定開發環境和建立 Streamlit LangChain UI 應用程式的步驟順序。

建立互動式網頁應用程式

Streamlit 提供了豐富的元件和功能，讓您可以建立互動式網頁應用程式，包括小工具、圖表、表格、地圖等。LangChainUI.py 檔案是定義和組織這些元件的中央位置，讓您可以建立所需的應用程式。

建立應用程式的步驟

以下是建立應用程式的一些步驟：

1. 匯入必要的函式庫：首先，匯入必要的函式庫，包括 os、streamlit 和 langchain 的各個元件。

import os
import streamlit as st
from langchain.chains import LLMChain
from langchain.prompts import ChatPromptTemplate, HumanMessagePromptTemplate
from langchain.chat_models import ChatOpenAI

這些行匯入了必要的函式庫，包括 os 用於環境變數、streamlit 用於網頁介面，以及 langchain 的各個元件用於與語言模型互動。

2. 設定 API 金鑰：接下來，設定 OpenAI API 金鑰為環境變數。

os.environ["OPENAI_API_KEY"] = "your_openai_api_key_here"

這設定了 OpenAI API 金鑰為環境變數，將被用於與語言模型互動。

3. Streamlit UI 設定：建立 Streamlit UI 的標題和輸入框。

st.title("ChatGPT-like Q&A App")
user_query = st.text_input("Enter your question:")

這建立了應用程式的標題和輸入框，讓使用者可以輸入問題。

4. 聊天記錄初始化：初始化聊天記錄，如果它不存在於會話狀態中。

if 'chat_history' not in st.session_state:
    st.session_state['chat_history'] = []

這初始化了聊天記錄，如果它不存在於會話狀態中。

5. 顯示聊天記錄：顯示聊天記錄中的每個問題和答案。

for chat in st.session_state['chat_history']:
    st.write(f"Q: {chat['question']}")
    st.write(f"A: {chat['answer']}")

這顯示了聊天記錄中的每個問題和答案。

內容解密：

上述程式碼建立了基本的 Streamlit UI 和聊天記錄功能。st.title 和 st.text_input 用於建立標題和輸入框，而 st.session_state 用於儲存聊天記錄。for 迴圈用於顯示聊天記錄中的每個問題和答案。

圖表翻譯：

這個圖表顯示了使用者輸入問題、建立聊天記錄、顯示聊天記錄和更新聊天記錄的流程。

使用 Streamlit 和 OpenAI 建立聊天機器人

1. 初始化聊天機器人

首先，我們需要初始化聊天機器人，並設定好聊天記錄的儲存方式。這可以透過 Streamlit 的st.session_state來實作。

if 'chat_history' not in st.session_state:
    st.session_state['chat_history'] = []

2. 顯示聊天記錄

接下來，我們需要顯示所有之前的問題和答案。這可以透過迴圈遍歷聊天記錄來實作。

for chat in st.session_state['chat_history']:
    st.write(f"Q: {chat['question']}")
    st.write(f"A: {chat['answer']}")

3. 處理使用者輸入

當使用者輸入問題並點選提交按鈕時，我們需要檢查使用者輸入是否有效，並建立一個新的問題。

user_query = st.text_input("請輸入您的問題")
if user_query and st.button("提交"):
    # 處理使用者輸入
    pass

4. 建立和使用語言模型

接下來，我們需要建立一個 OpenAI 語言模型的例項，並設定好提示範本。

llm = ChatOpenAI(temperature=0.7, model_name='gpt-3.5-turbo')
prompt = ChatPromptTemplate.from_messages([
    HumanMessagePromptTemplate.from_template("{query}")
])
chain = LLMChain(llm=llm, prompt=prompt)

5. 生成回應

然後，我們需要使用語言模型生成一個回應。

response = chain.run(query=user_query)

6. 更新和顯示回應

最後，我們需要更新聊天記錄，並顯示生成的回應。

st.session_state['chat_history'].append({"question": user_query, "answer": response})
st.write("Answer:")
st.write(response)

7. 預設訊息

如果使用者沒有輸入問題或沒有點選提交按鈕，我們需要顯示一個預設訊息。

else:
    st.write("請輸入您的問題")

內容解密：

以上程式碼展示瞭如何使用 Streamlit 和 OpenAI 建立一個簡單的聊天機器人。首先，我們初始化了聊天記錄，並設定好聊天記錄的儲存方式。然後，我們顯示了所有之前的問題和答案。接下來，我們處理了使用者輸入，建立了一個新的問題，並使用 OpenAI 語言模型生成了一個回應。最後，我們更新了聊天記錄，並顯示了生成的回應。

圖表翻譯：

以下是程式流程圖：

此圖表展示了聊天機器人的程式流程，從初始化聊天記錄到顯示回應。每個步驟都對應到上述程式碼中的某個部分。

建立簡單的網頁聊天介面

為了建立一個簡單的網頁聊天介面，我們需要使用 Streamlit 來建立一個基本的網頁應用程式。首先，我們需要匯入必要的函式庫和初始化 Streamlit。

import streamlit as st

# 初始化 Streamlit
st.title("簡單聊天介面")

接下來，我們需要建立一個輸入框讓使用者輸入問題，並且新增一個提交按鈕。

# 建立輸入框和提交按鈕
question = st.text_input("請輸入問題")
if st.button("提交"):
    # 處理使用者輸入的問題
    if question:
        # 使用 OpenAI GPT 模型生成回應
        response = "這是對你的問題的回應"
        st.write(response)
    else:
        st.write("請輸入問題")

處理縮排錯誤

在編寫 Python 程式碼時，縮排錯誤可能會導致程式碼無法正常執行。為了避免這種情況，需要確保程式碼中的縮排是一致的。通常，Python 使用 4 個空格作為一級縮排。

# 範例：正確的縮排
if 'my-index' not in pc.list_indexes().indexes:
    pc.create_index(
        name='my-index',
        dimension=1536,
        metric='cosine'
    )

執行 Streamlit 應用程式

要執行 Streamlit 應用程式，需要開啟終端或命令提示符，導航到 LangChainUI.py 檔案所在的目錄，然後執行以下命令：

streamlit run LangChainUI.py

這將啟動 Streamlit 伺服器並執行 LangChainUI.py 檔案。

檢視 Streamlit 應用程式

執行 streamlit run LangChainUI.py 命令後，Streamlit 會顯示一個訊息，指出應用程式正在執行。複製顯示的 URL 並貼上到網頁瀏覽器中，以檢視和與你的 Streamlit 應用程式互動。

內容解密：

上述程式碼展示瞭如何使用 Streamlit 建立一個簡單的網頁聊天介面。首先，我們匯入必要的函式庫並初始化 Streamlit。然後，我們建立一個輸入框和提交按鈕，用於處理使用者輸入的問題。最後，我們使用 OpenAI GPT 模型生成回應並顯示給使用者。

圖表翻譯：

@startuml
skinparam backgroundColor #FEFEFE
skinparam componentStyle rectangle

title LangChain Streamlit 聊天機器人實作

package "機器學習流程" {
    package "資料處理" {
        component [資料收集] as collect
        component [資料清洗] as clean
        component [特徵工程] as feature
    }

    package "模型訓練" {
        component [模型選擇] as select
        component [超參數調優] as tune
        component [交叉驗證] as cv
    }

    package "評估部署" {
        component [模型評估] as eval
        component [模型部署] as deploy
        component [監控維護] as monitor
    }
}

collect --> clean : 原始資料
clean --> feature : 乾淨資料
feature --> select : 特徵向量
select --> tune : 基礎模型
tune --> cv : 最佳參數
cv --> eval : 訓練模型
eval --> deploy : 驗證模型
deploy --> monitor : 生產模型

note right of feature
  特徵工程包含：
  - 特徵選擇
  - 特徵轉換
  - 降維處理
end note

note right of eval
  評估指標：
  - 準確率/召回率
  - F1 Score
  - AUC-ROC
end note

@enduml

此圖表展示了使用者與聊天介面的互動過程。首先，使用者輸入問題並點選提交按鈕。然後，系統檢查輸入內容，如果有問題，則生成回應並顯示給使用者。

從使用者經驗視角來看，本文逐步講解了如何結合 LangChain 和 Streamlit 建立一個互動式網頁聊天應用程式。透過拆解程式碼、流程圖以及「內容解密」的說明，有效降低了讀者理解門檻，即使是初學者也能循序漸進地掌握核心概念。文章涵蓋了開發環境設定、程式碼撰寫、錯誤處理、應用程式佈署和執行等關鍵步驟，提供了一個完整的實作。

然而，文章在技術深度上仍有提升空間。例如，對於 LangChain 和 Streamlit 的整合方式，可以更深入地探討不同元件的選擇和組態策略，以及如何最佳化效能。此外，針對錯誤處理的部分，僅以縮排錯誤為例略顯單薄，可以擴充套件更多常見錯誤型別和除錯技巧。對於 OpenAI API 金鑰的設定，僅以 your_openai_api_key_here 作為範例，缺乏更實際的操作說明，可能會造成讀者在實作過程中產生困惑。

展望未來，隨著 LangChain 和 Streamlit 的持續發展，這類別應用程式的開發效率和使用者經驗將會進一步提升。預期未來會有更多更便捷的工具和框架出現，簡化開發流程，並提供更豐富的互動功能。開發者應持續關注相關技術的發展趨勢，並積極探索新的應用場景，例如整合更進階的語言模型、支援多語言、加入語音互動等，以創造更具吸引力和實用價值的聊天應用程式。對於注重使用者經驗的開發者而言，深入理解 LangChain 和 Streamlit 的整合技巧將成為未來開發互動式網頁應用程式的關鍵能力。建議開發者參考官方檔案和社群資源，持續學習和精進相關技術。