langgraph快速搭建agent后端和react前端

官方文檔

一、后端

1.安裝基礎依賴

pip install --upgrade "langgraph-cli[inmem]"

2.下載模版項目

在終端運行

langgraph new ./example --template new-langgraph-project-python

這里是在當前文件夾下新建文件夾example,里面是下載的langgraph模版項目文件

在這里插入圖片描述
顯示這樣就是成功。如果失敗,說明網絡問題。

3.安裝項目依賴

cd example
pip install -e .

4.配置項目環境變量

將.env.example文件修改為.env,這樣就是環境變量文件了,重要的key都放在這里,和代碼文件隔離

填寫LANGSMITH_API_KEY,需要去langsmith注冊賬號,獲取key

5.部署后端服務

langgraph dev

就會看到
在這里插入圖片描述

6.核心代碼

是src.agent.graph.py

"""LangGraph single-node graph template.Returns a predefined response. Replace logic and configuration as needed.
"""from __future__ import annotationsfrom dataclasses import dataclass
from typing import Any, Dict, TypedDictfrom langgraph.graph import StateGraph
from langgraph.runtime import Runtime# 上下文參數
class Context(TypedDict):"""Context parameters for the agent.Set these when creating assistants OR when invoking the graph.See: https://langchain-ai.github.io/langgraph/cloud/how-tos/configuration_cloud/"""my_configurable_param: str# 狀態參數,定義輸入參數
@dataclass
class State:"""Input state for the agent.Defines the initial structure of incoming data.See: https://langchain-ai.github.io/langgraph/concepts/low_level/#state"""changeme: str = "example"# 一個節點,接收state和runtime,返回output
async def call_model(state: State, runtime: Runtime[Context]) -> Dict[str, Any]:"""Process input and returns output.Can use runtime context to alter behavior."""return {"changeme": "output from call_model. "f"Configured with {runtime.context.get('my_configurable_param')}"}# 定義圖
graph = (StateGraph(State, context_schema=Context).add_node(call_model).add_edge("__start__", "call_model").compile(name="New Graph")
)

圖形化后是
在這里插入圖片描述

二、前端

官方文檔

前置條件,在本地或者云端已經部署了langgraph的服務

然后本地安裝前端項目,并啟動

git clone https://github.com/langchain-ai/agent-chat-ui.gitcd agent-chat-uipnpm install

啟動前端

pnpm dev

這樣本地就有兩個項目了
在這里插入圖片描述
如果沒有pnpm,就安裝

brew install pnpm

三、最終效果

因為前端的顯示是消息,所以要修改示例代碼,我的簡易代碼

from typing import Annotatedfrom typing_extensions import TypedDictfrom langgraph.graph import StateGraph, START, END
from langgraph.graph.message import add_messagesclass State(TypedDict):# Messages have the type "list". The `add_messages` function# in the annotation defines how this state key should be updated# (in this case, it appends messages to the list, rather than overwriting them)messages: Annotated[list, add_messages]def call_llm(state: State) -> State:return {"messages": [{"role": "assistant","content": "你好,我是小愛同學,請問你是誰?"}]}graph_builder = StateGraph(State)graph_builder.add_node("call_llm", call_llm)graph_builder.add_edge(START, "call_llm")
graph_builder.add_edge("call_llm", END)graph = graph_builder.compile()

在這里插入圖片描述

四、本地客戶端訪問langgraph服務

官方文檔
代碼

from langgraph_sdk import get_client
import asyncioclient = get_client(url="http://localhost:2024")async def main():async for chunk in client.runs.stream(None,  # Threadless run"agent", # Name of assistant. Defined in langgraph.json.input={"messages": [{"role": "human","content": "hello",}],},):print(f"Receiving new event of type: {chunk.event}...")print(chunk.data)print("\n\n")asyncio.run(main())

效果
在這里插入圖片描述

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/web/94354.shtml
繁體地址,請注明出處:http://hk.pswp.cn/web/94354.shtml
英文地址,請注明出處:http://en.pswp.cn/web/94354.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

第2章:幽靈協議初現

林薇的手指剛觸碰量子控制臺的“時間錨點”按鈕,Elysium的拓撲圖突然炸開一片猩紅。0.000001秒的延遲后,屏幕中央浮現出一個10KB的幽靈協議塊——它不占任何經典內存,卻在量子態中“呼吸”。“它在……重寫協議。”林薇的BCI接口傳來低沉的嗡…

Unity其他--【MMD】如何在Unity中制作MMD

小菲搖之前學習了在Unity中使用動畫狀態機控制人物,以及用Shader去對氛圍圖形進行渲染,然后又刷到一些MMD的視頻,我就想著MMD能做的事情感覺Unity應該也都能做而且更方便的吧,所以就嘗試做了一下。當然這里主要是記錄一下自己是怎…

從技術精英到“芯”途末路:一位工程師的沉淪與救贖

作者:邱戈龍、曾建萍【長昊律所】 專注于商業秘密、軟件著作權的專業型律師事務所,擅長民事、行政、刑事多重救濟途徑,為眾多科學技術領域的商業秘密、軟件著作權類案件提供侵權維權、辯護、司法鑒定、司法審計、調查取證等高品質專項法律服務…

刷題日記0824

兩眼一睜就是刷!今日計劃5道3/5昨天遇到了幾件令人心情不好的小事,今天還要處理一下。一早上的好心情被小小的破壞了一下。1056. 易混淆數 簡單有思路,心情好。耶比耶比,算是一遍過,這次考慮很周。寫完了有一種一遍過的…

Qt c++開發中的delete QThread操作需注意

1、析構函數中,不能執行QEventLoop,會造成 重入問題:事件循環可能觸發其他事件,導致已析構的對象被再次訪問信號槽連接:正在析構的對象可能還有未斷開的信號槽連接未定義行為:對象狀態不確定,可…

Seaborn數據可視化實戰:Seaborn圖表定制與數據可視化入門

高級圖表定制 學習目標 通過本課程你將掌握如何使用Seaborn庫進行高級圖表定制,包括圖表的標題、圖例、注釋的添加,以及圖表布局和大小的調整。這些技能將幫助你更有效地展示數據,使你的數據故事更加生動和有說服力。 相關知識點 Seaborn高級…

nano命令使用方法

nano 是 Ubuntu 等 Linux 系統中常用的輕量級文本編輯器,輕量易用,特別適合適合快速編輯配置文件、腳本等。以下是其核心使用方法:一、基本操作:打開 / 創建文件bash# 打開已存在文件(若文件不存在則創建) …

C#_gRPC

6.3 gRPC:高性能跨語言服務間通信 gRPC是一個高性能、開源、通用的RPC(Remote Procedure Call)框架,由Google開發并基于其多年的內部使用經驗(Stubby)。它現在是Cloud Native Computing Foundation&#xf…

Ubuntu 多版本 librealsense 與 realsense_ros 編譯并兼容 L515 等設備

這篇博客用來記錄如何在 Ubuntu 下編譯多個版本的 librealsense 并使用 L515 和 D435i 等設備。核心在于 L515 這款設備已經停止維護,直接安裝的方案不支持這個設備,只支持 D435i 等后期產品。如果想要同時使用新老的 realsense 產品,需要單獨…

Java 泛型 T、E、K、V、?、S、U、V

目錄 一、概述 二、為什么使用泛型 三、常見泛型類型參數的含義與用途 示例一:使用 T 定義泛型類 示例二:使用 E 表示集合元素 示例三:使用 K 和 V 表示鍵值對 示例四:使用 ? 通配符處理未知類型 四、通配符 ? 的擴展用…

1688拍立淘接口數據全面解析詳細說明(item_search_img)

一、接口概述 1688拍立淘接口是阿里巴巴1688平臺提供的基于圖像識別的商品搜索服務,允許開發者通過上傳商品圖片來搜索平臺上的同款或相似商品。該接口的主要功能是接收用戶上傳的圖片(或圖片的相關信息),并通過1688平臺的圖像識…

【Docker項目實戰】使用Docker部署輕量級LetsMarkdown文本編輯器

【Docker項目實戰】使用Docker部署輕量級Markdown文本編輯器一、LetsMarkdown介紹1.1 LetsMarkdown簡介1.2 主要特點二、本次實踐介紹2.1 本地環境規劃2.2 本次實踐介紹三、本地環境檢查3.1 檢查Docker服務狀態3.2 檢查Docker版本3.3檢查docker compose 版本四、拉取容器鏡像五…

Node.js自研ORM框架深度解析與實踐

Node.js自研ORM框架深度解析與實踐 前言 在現代Web開發中,對象關系映射(ORM)框架扮演著至關重要的角色。它們為開發者提供了一層抽象,使得數據庫操作變得更加簡單和直觀。本文將深入解析一個基于Node.js和MySQL的自研ORM框架&…

匯總圖片拖進ps中 photoshop同時打開幾個文件夾

如果你有許多文件夾,你想選中一部分,然后把里面的圖片全部拖進photoshop當中,但是文件夾又不能直接拖進去,那么你可以嘗試使用一下這個工具,首先測試一下直接拖文件夾。選中你要處理的文件夾,直接拖進photo…

mysql 5.7 查詢運行時間較長的sql

開發過程遇到sql 執行時間長,又取消不了的情況 可使用 kill query ID 殺死進程獲取正在運行的sqlSELECT ID, -- 進程ID:MySQL服務器分配給每個連接的唯一標識符,用于區分不同的客戶端連接USER, …

MongoDB 從入門到實踐:全面掌握文檔型 NoSQL 數據庫核心操作

目錄 一、MongoDB 基礎準備 1. 官方資源獲取 2. 安裝步驟解析 二、MongoDB 核心指令詳解 1. 數據庫操作指令 2. 集合操作指令 3. 文檔操作指令 查詢文檔 插入文檔 修改文檔 刪除文檔 三、進階查詢技巧 1. 運算符的靈活運用 比較運算符 邏輯運算符 范圍與成員運算…

CVPR2025丨遙感領域,全模態與秒超高清遙感建模重大突破,性能提升創新點

關注gongzhonghao【CVPR頂會精選】剛入門遙感建模時,總好奇別人為什么總能提出新方法?慢慢摸索后才發現,創新點并不是硬憋出來的,而是要從數據特性、傳感器差異、地物細節以及環境變化中發現機會。不同波段、不同分辨率、不同時相…

HTML5詳篇

前端三劍客 前端三劍客是指HTML、CSS和JavaScript: HTML超文本標記語言(Hyper Text Markup Language):簡單理解描述網頁結構的;用于網頁內容的語言。它通過使用不同的HTML標簽來定義頁面中的各種元素,例如標題、段落、圖像、鏈接等【無羽毛的小鳥模型】 CSS層疊樣式表(…

【Transient-Free 3DGS】delayed densification + coarse to fine增加GS的魯棒性

25年最新連接去除場景瞬態對象工程與3DGS的pipeline,改進了spotlesssplats,已開源: [2506.02751] RobustSplat: Decoupling Densification and Dynamics for Transient-Free 3DGSAbstract page for arXiv paper 2506.02751: RobustSplat: De…

【MySQL】CRUD基礎詳解

CRUD基礎前言:數據庫的層級結構一、新增(Create)1. 單行數據 全列插入2. 單行數據的簡寫插入3. 指定列插入4. 多行數據插入二、查詢(Retrieve)1. 全列查詢2. 指定列查詢3. 查詢結果為表達式(1)…