LLM大语言模型(五):用streamlit开发LLM应用

目录

背景

Streamlit是一个开源Python库,可以轻松创建和共享用于机器学习数据科学的漂亮的自定义web应用程序,用户可以在几分钟内构建一个强大的数据App。

其最大的特色是直接用Python写前端页面。

对于数据分析场景,其强大的数据可视化能力和极方便简单的开发流程,极大的方便了demo展示、方案验证等工作。

随着ChatGPT的兴起,LLM方向变得炙手可热,Streamlit也顺势推出了支持LLM的新特性。

准备工作

安装

python 复制代码
pip install streamlit

python版本支持3.8~3.12.

切记

页面的每次渲染,其实都是from top to down重新执行了一次后端的py文件。

记住这个,方便理解下文的例子。

streamlit开发LLM demo

开一个新页面

python 复制代码
import streamlit as st
import random
import time

st.title("来啦,老铁")

这一行生成一个新页面,且页面顶部的标题是大大的:来啦,老铁。

初始化session

python 复制代码
# Initialize chat history
if "messages" not in st.session_state:
    st.session_state.messages = []
    st.session_state.messages.append({"role": "assistant", "content": "老铁,有什么需要帮忙的?"})

session_state是会话保持,你在页面上的各种操作,对会对应到后端的同一个session上。

要是新开了一个网页,即使是同一个用户,也会开启一个新的session,因为它并没有用户体系。

messages会存储对话的历史消息,对同一个session来讲,初始化只会执行一次。

在初始化的时候,助手会先发一条消息,跟用户打个招呼。

先渲染历史消息

python 复制代码
for message in st.session_state.messages:
    with st.chat_message(message["role"]):
        st.markdown(message["content"]) 

st.chat_message 会返回一个message container,这个container可以放streamlit的任何元素。这里放的markdown元素,也就是消息的内容。

st.chat_message 的第一个参数是消息的作者,例如userassistant ,针对不同类型的作者,streamlit会显示内置的头像和风格,当然也可以自定义。

第一次渲染时,这里会把助手说的第一句话渲染出来。

接收用户输入

python 复制代码
if prompt := st.chat_input("What is up?"):
    # Display user message in chat message container
    with st.chat_message("user"):
        st.markdown(prompt)
    # Add user message to chat history
    st.session_state.messages.append({"role": "user", "content": prompt})

st.chat_input 会在页面展示一个输入框,用户可在里面输入对话内容。

后端收到用户的输入内容后,首先要在页面的历史消息里渲染出来,这一步st.chat_message会自动帮你做。

然后将用户输入再追加到session里的的历史消息中,后续要拿着整个对话历史去调LLM,或者页面重新渲染时展示所有的历史消息。

模拟调用LLM

python 复制代码
# Accept user input
if prompt := st.chat_input("What is up?"):
    # Display user message in chat message container
    with st.chat_message("user"):
        st.markdown(prompt)
    # Add user message to chat history
    st.session_state.messages.append({"role": "user", "content": prompt})

    # Display assistant response in chat message container
    with st.chat_message("assistant"):
        message_placeholder = st.empty()
        full_response = ""
        assistant_response = random.choice(
            [
                "st.chat_input lets you display a chat input widget so the user can type in a message. The returned value is the user's input, which is None if the user hasn't sent a message yet. You can also pass in a default prompt to display in the input widget. Here's an example of how to use st.chat_input to display a chat input widget and show the user's input:",
            ]
        )
        # Simulate stream of response with milliseconds delay
        for chunk in assistant_response.split():
            full_response += chunk + " "
            time.sleep(0.1)
            # Add a blinking cursor to simulate typing
            message_placeholder.markdown(full_response + "▌")
        message_placeholder.markdown(full_response)
    # Add assistant response to chat history
    st.session_state.messages.append({"role": "assistant", "content": full_response})
  

上述demo并没有真正的去调用LLM,而是做了个效果模拟。

message_placeholder = st.empty() 创建了一个可变内容的对象,顾名思义,它的内容可以被修改,且修改完后会自动渲染到页面上。

上述demo会给出一个较长的回答。然后模拟LLM的效果,把回答渲染到页面上。

首先将回答split分词,每个split相当于LLM调用返回结果里的chunk。

每个chunk处理时,先sleep 0.1s,模拟LLM在generate,然后修改message_placeholder的内容,为了效果更逼真,每次渲染还在末尾加了指针符号。

最后将整个答案再渲染了一次。

最最后,把assistant的回答追加到session里的历史消息里。

视频演示:

llm_demo · Streamlit

效果图:

参考

LLM大语言模型(一):ChatGLM3-6B本地部署
LLM大语言模型(二):Streamlit 无需前端经验也能画web页面
LLM大语言模型(三):使用ChatGLM3-6B的函数调用功能前先学会Python的装饰器
LLM大语言模型(四):在ChatGLM3-6B中使用langchain

相关推荐
慢半拍iii3 分钟前
CANN算子开发实战:手把手教你基于ops-nn仓库编写Broadcast广播算子
人工智能·计算机网络·ai
历程里程碑10 分钟前
普通数组----合并区间
java·数据结构·python·算法·leetcode·职场和发展·tornado
weixin_3954489111 分钟前
mult_yolov5_post_copy.c_cursor_0205
c语言·python·yolo
User_芊芊君子16 分钟前
CANN数学计算基石ops-math深度解析:高性能科学计算与AI模型加速的核心引擎
人工智能·深度学习·神经网络·ai
小白|19 分钟前
CANN与联邦学习融合:构建隐私安全的分布式AI推理与训练系统
人工智能·机器学习·自动驾驶
艾莉丝努力练剑27 分钟前
hixl vs NCCL:昇腾生态通信库的独特优势分析
运维·c++·人工智能·cann
执风挽^27 分钟前
Python基础编程题2
开发语言·python·算法·visual studio code
梦帮科技27 分钟前
Node.js配置生成器CLI工具开发实战
前端·人工智能·windows·前端框架·node.js·json
程序员泠零澪回家种桔子29 分钟前
Spring AI框架全方位详解
java·人工智能·后端·spring·ai·架构
Echo_NGC223732 分钟前
【FFmpeg 使用指南】Part 3:码率控制策略与质量评估体系
人工智能·ffmpeg·视频·码率