逐步掌握最佳Ai Agents框架-AutoGen 十 Web应用

从LangChain使用Agent的懵懵懂懂,到AutoGen的"放肆"Agents,这周的学习和写作实在太幸福了。假如您是第一次接触AugoGen,请先要查看AutoGen官方文档,或翻阅AutoGen系列的前几篇。

逐步掌握最佳Ai Agents框架-AutoGen 一

逐步掌握最佳Ai Agents框架-AutoGen 二

逐步掌握最佳Ai Agents框架-AutoGen 三 写新闻稿新方式

[逐步掌握最佳Ai Agents框架-AutoGen 四 多代理群聊实例](https://juejin.cn/post/7301948815752790054 "https://juejin.cn/post/7301948815752790054")

逐步掌握最佳Ai Agents框架-AutoGen 五 与LangChain手拉手 - 掘金 (juejin.cn)

逐步掌握最佳Ai Agents框架-AutoGen 六 语音AI代理 - 掘金 (juejin.cn)

逐步掌握最佳Ai Agents框架-AutoGen 七 低代码AI助理 - 掘金 (juejin.cn)

逐步掌握最佳Ai Agents框架-AutoGen 八 开源模型 - 掘金 (juejin.cn)

逐步掌握最佳Ai Agents框架-AutoGen 九 RAG应用 - 掘金 (juejin.cn)

AutoGen系列来到了第十篇,从入门AutoGen,到熟悉chat agent工作方式,再到深入把玩RAG文档AI助理应用。终于,我们要结合Streamlit来做智能Web应用了。

Streamlit

Streamlit是一款Web开发框架,适用于python快速完成一些大模型、数学科学计算的UI开发。

作为一位Web开发者,AutoGen系列的第十集来到Web应用开发,我们要做的就是将AutoGen的交互与反馈,在浏览器Web页面上呈现出来。

  • 最终效果

上图是项目的最终效果,它分为左右两栏。侧边栏为OpenAI的配置区域,表单的值,提供给AutoGen的config_list。 右边是类似chatgpt的聊天区域,我们在这里将message交给UserProxyAgent,之后由它与其它Agent的chat完成任务。

  • try Streamlit

首先,让我们跟着文档,将Streamlit玩起来。这里假设大家本地都安装好了python 环境。安装streamlit, 并使用streamlit 初始化hello 项目

python 复制代码
pip install streamlit
streamlit hello

上图是模板项目的效果。

  • 初始化项目

  了解hello模板项目效果,心里有数。新建我们的的autogen-streamlit项目目录,并添加app.py入口文件。文件引入streamlit, 写入如图代码,执行命令streamlit run app.py,项目启动。

  • 侧边栏
python 复制代码
selected_model = None
selected_key = None
with st.sidebar:
    st.header("OpenAI Configuration")
    selected_model = st.selectbox("Model", ['gpt-3.5-turbo', 'gpt-4'], index=1)
    selected_key = st.text_input("API Key", type="password")

定义了selected_model、selected_key 两个变量,初始值为None。 with st.sidebar 设置侧边栏。st代表streamlit, st.sidebar 代表侧边栏,从语法看,streamlit只需要了解预设模块和语法,就可以快速完成开发。 st.header("OpenAI Configuration")侧边栏标题,selected_model = st.selectbox("Model", ['gpt-3.5-turbo', 'gpt-4'], index=1),添加下拉框,并交给selected_model,用户选择后,值可在selected_model里选择。    如果大家也跟我一样,目前还没有用上gpt-4, 可以将index设置为0...悲伤的故事。

  • 主栏
python 复制代码
with st.container():
    user_input = st.chat_input("Type something...")
    if user_input:
        if not selected_key or not selected_model:
            st.warning(
                'You must provide valid OpenAI API key and choose preferred model', icon="⚠️")
            st.stop()

类chatgpt的界面,主栏提供了一个聊天输入框,它会位于界面底部。当用户按下回车键时,流程会进入if user_input分支, 此时如果用户还未提供api_key或相应模型,会输出提示,st.stop,st的逻辑也会停掉。否则,即可进行config_list配置,selected_model、selected_key的值是config_list的一项配置

python 复制代码
llm_config = {
            "request_timeout": 600,
            "config_list": [
                {
                    "model": selected_model,
                    "api_key": selected_key
                }
            ]
        }
  • 初始化两个Agent
python 复制代码
class TrackableAssistantAgent(AssistantAgent):
    def _process_received_message(self, message, sender, silent):
        with st.chat_message(sender.name):
            st.markdown(message)
        return super()._process_received_message(message, sender, silent)

这里的AssistantAgent 比之前几篇要复杂。这里定义的TrackableAssistantAgentAssistantAgent为基类,对_process_received_message做了复盖。将接收到的消息,通过chat_message,将发送者的名字和消息,以markdown的格式显示在页面上,再调用基类的方法完成工作。   UserProxyAgent也一样。

python 复制代码
class TrackableUserProxyAgent(UserProxyAgent):
    def _process_received_message(self, message, sender, silent):
        with st.chat_message(sender.name):
            st.markdown(message)
        return super()._process_received_message(message, sender, silent)

有了这两个类后,我们实例化Agents, 这是AutoGen的常规操作。

python 复制代码
assistant = TrackableAssistantAgent(
            name="assistant", llm_config=llm_config)

# create a UserProxyAgent instance named "user"
user_proxy = TrackableUserProxyAgent(
    name="user", human_input_mode="NEVER", llm_config=llm_config)
  • asyncio   我们使用了asyncio, 异步的初始化了
python 复制代码
 # Create an event loop
loop = asyncio.new_event_loop()
asyncio.set_event_loop(loop)

# Define an asynchronous function
async def initiate_chat():
    await user_proxy.a_initiate_chat(
        assistant,
        message=user_input,
    )

# Run the asynchronous function within the event loop
loop.run_until_complete(initiate_chat())

asyncio.new_event_loop()创建一个新的事件循环,asyncio.set_event_loop(loop)将新创建的事件循环设置为当前线程的事件循环,loop.run_until_complete(initiate_chat())在完成initiate_chat任务前会阻塞该线程。initiate_chat使用user_proxy开启会话,这和之前的就一样了。

  • 运行结果

在命令行中,从上图可以看出,用户代理接收到用户在输入框提出的问题(Generate a fibonacci sequence with 12 numbers and work out the sum)后, 交给assistantAgent。 assistant 生成了代码, 并完成了计算。

页面上,也显示了效果。

总结

通过Streamlist,快速完成了AutoGen AI助理的Web应用搭建, 让AutoGen 的chat work flow 更形象。

参考资料

相关推荐
lihuayong9 分钟前
RAG的工作原理以及案例列举
人工智能·rag·文本向量化·检索增强生成·语义相似度
果冻人工智能14 分钟前
Google 发布 Gemma 3 —— 你需要了解的内容
人工智能
-一杯为品-29 分钟前
【动手学深度学习】#2线性神经网络
人工智能·深度学习·神经网络
SZ17011023143 分钟前
语音识别 FireRedASR-AED模型主要特点
人工智能·语音识别
@黄色海岸43 分钟前
【sklearn 05】sklearn功能模块
人工智能·python·sklearn
@黄色海岸44 分钟前
【sklearn 02】监督学习、非监督下学习、强化学习
人工智能·学习·sklearn
境心镜1 小时前
(下一个更新)PATNAS: A Path-Based Training-Free NeuralArchitecture Search
人工智能·深度学习·nas·免训练
智驱力人工智能1 小时前
AI赋能实时安全背带监测解决方案
人工智能·安全·计算机视觉·智慧城市·智慧工地·智能巡检·安全背带识别
Elastic 中国社区官方博客1 小时前
拆解 “ES 已死“ 伪命题:Agentic RAG 时代搜索引擎的终极形态
大数据·数据库·人工智能·elasticsearch·搜索引擎·ai·全文检索
Conqueror7121 小时前
机器学习丨八股学习分享 EP1
人工智能·机器学习