随着AI大模型的普及，已经对我们的日常生活产生了巨大的改变，众所周知，2025年被誉为是AI大模型agent元年，而2026年则是被誉为是AI大模型应用元年。
这一判断基于技术演进路径、产业落地节奏和生态成熟度的阶段性特征。核心逻辑在于：2025年完成“能思考的智能体”技术闭环，2026年开启“大规模落地”的商业化进程。因此，基于此，我们也应该要不断的拓展自身的AI大模型应用的开发技术。
本文我将介绍如何从0到1的搭建一个基于streamlit的openai接口的模型对话的web版的助手。目标支持基本AI对话、AI文生图、AI图片理解、AI语音转文字、AI文转语音等。
核心功能模块：
[1] 支持Chat Completions API 的页面，进行文本对话
[2] 支持Vision的页面，进行图像理解
[3] 支持Image generation的页面，进行图片生成
[4] 支持语言转文本的页面
[5] 支持文本转语音的页面
其他添加的小功能：
[1] chat页面每次对话后显示耗时（配置文件中控制开关）
[2] chat页面每次对话后显示消耗的token数（配置文件中控制开关）
[3] 对whisper的输入添加违禁词过滤，包含违禁词则输出null
[4] 给chat页面增加了预设提示词，可以在配置文件中自定义
[5] 在draw页面添加了revised_prompt的显示，它保存了对你提示词的修改结果
1、搭建Python基础项目，我们这里将其命令为aichat
Python 是一种解释型、面向对象、动态数据类型的高级程序设计语言，众所周知Python是一种解释型脚本语言，可以应用于多个领域：Web 和 Internet开发、 科学计算和统计 、人工智能、 桌面界面开发、 软件开发、 后端开发 、网络接口、图形处理等， 以其语法简洁、易学易用著称 。它支持跨平台运行，拥有丰富的第三方库生态，被称为“胶水语言”，可与其他语言无缝集成 。
1.1 配置Pycharm调试Streamlit应用
开发环境 Pycharm Community Edition 2025.2.6
Win10/Win11
Streamlit 1.39.0
环境配置
库版本要求：必须安装openAI、streamlet、tiktoken和audio_record_streamlet等库，且版本需严格对应
openai>=1.3.6
streamlit==1.39.0
tiktoken
audio_recorder_streamlit==0.0.10
录音控件问题：版本不匹配会导致录音控件无法显示或报错
路径规范：项目启动文件位于src目录下的首页.py文件 这里我为了方便大家直观的了解用的是中文名称的py文件。
1.2 目录结构
目录结构:
aichat
-chatbot-app
-app.py
-README.md
-其他资源文件
资源目录说明 ：资源目录: resource，用于存放演示所需的资源文件，如图片、音频等。
2、安装streamlit
2.1 streamlit的开发文档
官方文档： https://docs.streamlit.io/
中文文档： https://blog.csdn.net/weixin_44458771/article/details/135495928
Streamlit 是一个开源 Python 库，专为数据科学家和机器学习工程师设计，用于快速构建交互式 Web 应用，无需前端知识 。截 至 2026 年 2 月，其最新版本已达 1.54.x，社区活跃且被 Snowflake 收购 。
核心功能与特点
极简开发：纯 Python 脚本编写，保存后自动热重载页面，无需回调或路由配置 。
丰富组件：内置按钮、滑块、文本输入、文件上传及侧边栏布局，支持 Pandas 数据框直接展示 。
可视化集成：无缝对接Matplotlib、Plotly、Altair等库，轻松创建交互式图表
应用场景与部署
适用场景：适合数据探索、模型演示、AI 聊天界面及内部仪表盘开发 。
部署方式：支持Streamlit Community Cloud免费托管，也可通过 Docker、Snowflake 或 Render 等平台部署 。
限制：
Streamlit 可用于正式环境，但更适合“数据驱动型”轻量应用。若项目符合以下条件，可放心使用：
并发量低（如内部团队使用）
无需复杂用户系统
核心逻辑为 Python 数据处理/可视化
否则，建议结合 Nginx 等方案增强稳定性，或选用更重型框架
2.2 Streamlit 命令行启动
pip install streamlit
2.3 安装成功后测试一下使用终端敲一下命令： streamlit
出现如上所示的图则streamlit安装成功了。
我们测试一下 streamlit 自带的界面：
2.4 在终端命令行里敲 ： streamlit hello 便会出现如下界面：
2.5 创建应用： app.py
···
import streamlit as st
st.header("hello")
st.write("这是streamlit 的一个小demo")
···
基本语法:
标题: st.header("hello")
文本: st.write("this is a streamlit demo")
按钮: st.button("确定")
Markdown: st.markdown("Streamlit is really cool.")
控件使用: 通过这些基本控件，可以实现页面标题、内容展示、按钮交互、Markdown文本渲染等功能。
3、编写代码：
3.1 创建首页：
这里我没有做国际化，直接在src路径下面创建 首页.py 界面
引入
import os
为啥要引入os
因为我们一般情况下，如果用到了OPENAI_BASE_URL和OPENAI_API_KEY，我们一般为了开发的方便不会将OPENAI_BASE_URL和OPENAI_API_KEY在每一个项目里进行配置，而是直接将OPENAI_BASE_URL和OPENAI_API_KEY直接配置在环境变量里。
import streamlit as st
直接在main方法下构建一个方法 home()
if name == "main":
home()
然后对 首页的样式进行构造
def home():
st.markdown("""
<style>
.css-12w0qz-container {
font-size: 24px !important;
}
</style>
""", unsafe_allow_html=True)
st.title("🏠芸哥AI应用智能体")
...
这里有点需要注意的地方：将OPENAI_BASE_URL和OPENAI_API_KEY放到session中。其他界面如果需要使用的话直接从session里取。为了方便更改
OPENAI_API_KEY将key直接写入到文本输入框里。然后通过输入框里的key直接存入到session里的api_key,则其他界面取api_key则直接取的是输入框里的最新的key值。
3.2 创建其他界面
在src路径下创建pages文件夹：
然后根据自己的个人需求编写界面，已经调用openai的相关接口，实现对应的功能
如图所示：
因为不同的模型，侧重的功能上有不同，所以我们这个项目的目的是集成多模态的模型于一体。这里我们分别集成了
1、文本对话类的openai模型（gpt-3.5-turbo-0125、gpt-4-0314、gpt-4-32k-0314、gpt-4-0613、gpt-4-32k-0613、gpt-4o-mini-2024-07-18、gpt-4o-2024-08-06等）、
2、图像理解类模型（GPT-4o）、
3、文本转语音模型（TTS模型（tts-1、tts-1-hd），其中有6个内置的声音（"alloy", "echo", "fable", "onyx", "nova", "shimmer"））
Alloy（合金）：一种清晰自然的中性女声，发音标准、语调平稳，适合新闻播报、知识讲解等需要专业感的场景 。
Echo（回声）：一种带有回响感的男声，音色低沉且富有空间感，适合营造氛围或用于有叙事感的内容 。
Fable（寓言）：一种温暖亲切的叙事型声音，带有讲故事般的感染力，非常适合儿童读物、有声书等情感丰富的文本 。
Onyx（黑玛瑙）：一种深沉有力的低音男声，表现力强，适合纪录片旁白、严肃主题或需要权威感的表达 。
Nova（新星）：一种明亮活泼的年轻女声，语调轻快，充满活力，适合广告宣传、教育内容或面向年轻人的产品 。
Shimmer（微光）：一种柔和甜美的女性声音，音质细腻、富有情感，适合诗歌朗诵、情感类内容或需要温柔语气的场景
4、文生图模型（DALL·E 3 ）：DALL·E 3 是OpenAI于2023年9月发布的第三代文本生成图像人工智能模型，它在图像细节、语义理解与艺术表现力方面实现了显著突破，能够根据自然语言描述生成高质量、高保真的视觉内容 。
该模型深度集成于ChatGPT，用户无需掌握复杂提示词技巧，只需输入简单想法，ChatGPT即可自动优化并生成详细提示，驱动DALL-E 3出图 。例如，输入“一只穿宇航服的猫走在月球上”，模型能精准理解每一个元素并生成富有想象力的画面 。
5、语音转文本（Whisper模型：whisper-1）音频种类分别支持："wav", "mp3", "webm", "mpeg", "mpga"
这里我们我们如果需要将语音转化为中文则需要设置 prompt="中文" ，prompt在大模型里代表的是提示语的意思。
transcript = client.audio.translations.create(
model="whisper-1",
file=audio_file,
response_format="text",
prompt="中文"
)
// 返回转录文本
return transcript
3.3 当然处理openai发布的一些大模型，我们同样的可以集成一些国产的大模型。当下比较应用广泛的科大讯飞、智谱清言、通义千问、文心一言、deepseek、kimi....
比如，当前我将项目里集成阿里的通义千问模型（"qwen-plus", "qwen-max", "qwen-turbo"）
在pages下创建一个 python文件，命名为 千问.py
import streamlit as st
from dashscope import Generation, ImageSynthesis
import dashscope
import os
import base64
from io import BytesIO
// 初始化DashScope
dashscope.api_key = os.getenv('DASHSCOPE_API_KEY', 'sk-6c3689a2aee24a2cb03c4890ff6ee6f4')
def generate_text(prompt, model="qwen-plus"):
"""使用通义千问生成文本"""
try:
response = Generation.call(
model=model,
prompt=prompt,
max_tokens=1000
)
return response.output.text if response.output else "生成失败"
except Exception as e:
return f"文本生成错误: {str(e)}"
def generate_image(prompt, n=1, size="1024*1024"):
"""使用通义千问生成图像"""
try:
response = ImageSynthesis.call(
model=ImageSynthesis.Models.wanx_v1,
prompt=prompt,
n=n,
size=size
)
if response.output and response.output.results:
return [result.url for result in response.output.results]
return []
except Exception as e:
st.error(f"图像生成错误: {str(e)}")
return []
同样的使用Streamlit对大模型进行集成。
社区热度: 在开源社区中较为火热，许多国外开源项目喜欢使用Streamlit进行大模型应用的集成。
特点适用场景:
快速开发Demo: 非常适合用于快速开发演示Demo，简化前后端开发流程。
内部工具: 可作为内部工具或演示使用，提高开发效率。
注意: 对于专门的前后端开发，仍建议使用React、Vue等框架以满足更复杂的需求。
当前AI编程工具也给大家推荐一些：
大家常用的 Cursor、Claude Code、 Trae等
这类工具已超越代码补全，进入自主规划、执行、验证的智能体阶段，能理解整个项目上下文，自动拆解需求、修改多文件、运行测试并修复Bug。使用起来程序员在一定程度上解放双手可以更加专注于逻辑、算法和业务。
4、运行
4.1 项目搭建完成后我们使用streamlit进行启动
使用控制台命令定位到首页.py所在的路径下执行
D:\pycharm\project\aichat\chatbot-app\src> streamlit run 首页.py
streamlit 默认的端口为 8501
如果想用其他的端口则可以执行命令：streamlit run 首页.py --server port 8588
切换端口；
5、效果：
6、后期经过不断扩展增加了一些提供办公效率的功能：
