隨著AI大模型的普及，已經(jīng)對(duì)我們的日常生活產(chǎn)生了巨大的改變，眾所周知，2025年被譽(yù)為是AI大模型agent元年，而2026年則是被譽(yù)為是AI大模型應(yīng)用元年。
這一判斷基于技術(shù)演進(jìn)路徑、產(chǎn)業(yè)落地節(jié)奏和生態(tài)成熟度的階段性特征。核心邏輯在于：2025年完成“能思考的智能體”技術(shù)閉環(huán)，2026年開啟“大規(guī)模落地”的商業(yè)化進(jìn)程。因此，基于此，我們也應(yīng)該要不斷的拓展自身的AI大模型應(yīng)用的開發(fā)技術(shù)。
本文我將介紹如何從0到1的搭建一個(gè)基于streamlit的openai接口的模型對(duì)話的web版的助手。目標(biāo)支持基本AI對(duì)話、AI文生圖、AI圖片理解、AI語(yǔ)音轉(zhuǎn)文字、AI文轉(zhuǎn)語(yǔ)音等。
核心功能模塊：
[1] 支持Chat Completions API 的頁(yè)面，進(jìn)行文本對(duì)話
[2] 支持Vision的頁(yè)面，進(jìn)行圖像理解
[3] 支持Image generation的頁(yè)面，進(jìn)行圖片生成
[4] 支持語(yǔ)言轉(zhuǎn)文本的頁(yè)面
[5] 支持文本轉(zhuǎn)語(yǔ)音的頁(yè)面
其他添加的小功能：
[1] chat頁(yè)面每次對(duì)話后顯示耗時(shí)（配置文件中控制開關(guān)）
[2] chat頁(yè)面每次對(duì)話后顯示消耗的token數(shù)（配置文件中控制開關(guān)）
[3] 對(duì)whisper的輸入添加違禁詞過(guò)濾，包含違禁詞則輸出null
[4] 給chat頁(yè)面增加了預(yù)設(shè)提示詞，可以在配置文件中自定義
[5] 在draw頁(yè)面添加了revised_prompt的顯示，它保存了對(duì)你提示詞的修改結(jié)果
1、搭建Python基礎(chǔ)項(xiàng)目，我們這里將其命令為aichat
Python 是一種解釋型、面向?qū)ο?、?dòng)態(tài)數(shù)據(jù)類型的高級(jí)程序設(shè)計(jì)語(yǔ)言，眾所周知Python是一種解釋型腳本語(yǔ)言，可以應(yīng)用于多個(gè)領(lǐng)域：Web 和 Internet開發(fā)、 科學(xué)計(jì)算和統(tǒng)計(jì) 、人工智能、 桌面界面開發(fā)、 軟件開發(fā)、 后端開發(fā) 、網(wǎng)絡(luò)接口、圖形處理等， 以其語(yǔ)法簡(jiǎn)潔、易學(xué)易用著稱 。它支持跨平臺(tái)運(yùn)行，擁有豐富的第三方庫(kù)生態(tài)，被稱為“膠水語(yǔ)言”，可與其他語(yǔ)言無(wú)縫集成 。
1.1 配置Pycharm調(diào)試Streamlit應(yīng)用
開發(fā)環(huán)境 Pycharm Community Edition 2025.2.6
Win10/Win11
Streamlit 1.39.0
環(huán)境配置
庫(kù)版本要求：必須安裝openAI、streamlet、tiktoken和audio_record_streamlet等庫(kù)，且版本需嚴(yán)格對(duì)應(yīng)
openai>=1.3.6
streamlit==1.39.0
tiktoken
audio_recorder_streamlit==0.0.10
錄音控件問(wèn)題：版本不匹配會(huì)導(dǎo)致錄音控件無(wú)法顯示或報(bào)錯(cuò)
路徑規(guī)范：項(xiàng)目啟動(dòng)文件位于src目錄下的首頁(yè).py文件 這里我為了方便大家直觀的了解用的是中文名稱的py文件。
1.2 目錄結(jié)構(gòu)
目錄結(jié)構(gòu):
aichat
-chatbot-app
-app.py
-README.md
-其他資源文件
資源目錄說(shuō)明 ：資源目錄: resource，用于存放演示所需的資源文件，如圖片、音頻等。
2、安裝streamlit
2.1 streamlit的開發(fā)文檔
官方文檔： https://docs.streamlit.io/
中文文檔： https://blog.csdn.net/weixin_44458771/article/details/135495928
Streamlit 是一個(gè)開源 Python 庫(kù)，專為數(shù)據(jù)科學(xué)家和機(jī)器學(xué)習(xí)工程師設(shè)計(jì)，用于快速構(gòu)建交互式 Web 應(yīng)用，無(wú)需前端知識(shí) 。截 至 2026 年 2 月，其最新版本已達(dá) 1.54.x，社區(qū)活躍且被 Snowflake 收購(gòu) 。
核心功能與特點(diǎn)
極簡(jiǎn)開發(fā)：純 Python 腳本編寫，保存后自動(dòng)熱重載頁(yè)面，無(wú)需回調(diào)或路由配置 。
豐富組件：內(nèi)置按鈕、滑塊、文本輸入、文件上傳及側(cè)邊欄布局，支持 Pandas 數(shù)據(jù)框直接展示 。
可視化集成：無(wú)縫對(duì)接Matplotlib、Plotly、Altair等庫(kù)，輕松創(chuàng)建交互式圖表
應(yīng)用場(chǎng)景與部署
適用場(chǎng)景：適合數(shù)據(jù)探索、模型演示、AI 聊天界面及內(nèi)部?jī)x表盤開發(fā) 。
部署方式：支持Streamlit Community Cloud免費(fèi)托管，也可通過(guò) Docker、Snowflake 或 Render 等平臺(tái)部署 。
限制：
Streamlit 可用于正式環(huán)境，但更適合“數(shù)據(jù)驅(qū)動(dòng)型”輕量應(yīng)用。若項(xiàng)目符合以下條件，可放心使用：
并發(fā)量低（如內(nèi)部團(tuán)隊(duì)使用）
無(wú)需復(fù)雜用戶系統(tǒng)
核心邏輯為 Python 數(shù)據(jù)處理/可視化
否則，建議結(jié)合 Nginx 等方案增強(qiáng)穩(wěn)定性，或選用更重型框架
2.2 Streamlit 命令行啟動(dòng)
pip install streamlit
2.3 安裝成功后測(cè)試一下使用終端敲一下命令： streamlit
出現(xiàn)如上所示的圖則streamlit安裝成功了。
我們測(cè)試一下 streamlit 自帶的界面：
2.4 在終端命令行里敲 ： streamlit hello 便會(huì)出現(xiàn)如下界面：
2.5 創(chuàng)建應(yīng)用： app.py
···
import streamlit as st
st.header("hello")
st.write("這是streamlit 的一個(gè)小demo")
···
基本語(yǔ)法:
標(biāo)題: st.header("hello")
文本: st.write("this is a streamlit demo")
按鈕: st.button("確定")
Markdown: st.markdown("Streamlit is really cool.")
控件使用: 通過(guò)這些基本控件，可以實(shí)現(xiàn)頁(yè)面標(biāo)題、內(nèi)容展示、按鈕交互、Markdown文本渲染等功能。
3、編寫代碼：
3.1 創(chuàng)建首頁(yè)：
這里我沒有做國(guó)際化，直接在src路徑下面創(chuàng)建 首頁(yè).py 界面
引入
import os
為啥要引入os
因?yàn)槲覀円话闱闆r下，如果用到了OPENAI_BASE_URL和OPENAI_API_KEY，我們一般為了開發(fā)的方便不會(huì)將OPENAI_BASE_URL和OPENAI_API_KEY在每一個(gè)項(xiàng)目里進(jìn)行配置，而是直接將OPENAI_BASE_URL和OPENAI_API_KEY直接配置在環(huán)境變量里。
import streamlit as st
直接在main方法下構(gòu)建一個(gè)方法 home()
if name == "main":
home()
然后對(duì) 首頁(yè)的樣式進(jìn)行構(gòu)造
def home():
st.markdown("""
<style>
.css-12w0qz-container {
font-size: 24px !important;
}
</style>
""", unsafe_allow_html=True)
st.title("??蕓哥AI應(yīng)用智能體")
...
這里有點(diǎn)需要注意的地方：將OPENAI_BASE_URL和OPENAI_API_KEY放到session中。其他界面如果需要使用的話直接從session里取。為了方便更改
OPENAI_API_KEY將key直接寫入到文本輸入框里。然后通過(guò)輸入框里的key直接存入到session里的api_key,則其他界面取api_key則直接取的是輸入框里的最新的key值。
3.2 創(chuàng)建其他界面
在src路徑下創(chuàng)建pages文件夾：
然后根據(jù)自己的個(gè)人需求編寫界面，已經(jīng)調(diào)用openai的相關(guān)接口，實(shí)現(xiàn)對(duì)應(yīng)的功能
如圖所示：
因?yàn)椴煌哪Ｐ?，?cè)重的功能上有不同，所以我們這個(gè)項(xiàng)目的目的是集成多模態(tài)的模型于一體。這里我們分別集成了
1、文本對(duì)話類的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、文本轉(zhuǎn)語(yǔ)音模型（TTS模型（tts-1、tts-1-hd），其中有6個(gè)內(nèi)置的聲音（"alloy", "echo", "fable", "onyx", "nova", "shimmer"））
Alloy（合金）：一種清晰自然的中性女聲，發(fā)音標(biāo)準(zhǔn)、語(yǔ)調(diào)平穩(wěn)，適合新聞播報(bào)、知識(shí)講解等需要專業(yè)感的場(chǎng)景 。
Echo（回聲）：一種帶有回響感的男聲，音色低沉且富有空間感，適合營(yíng)造氛圍或用于有敘事感的內(nèi)容 。
Fable（寓言）：一種溫暖親切的敘事型聲音，帶有講故事般的感染力，非常適合兒童讀物、有聲書等情感豐富的文本 。
Onyx（黑瑪瑙）：一種深沉有力的低音男聲，表現(xiàn)力強(qiáng)，適合紀(jì)錄片旁白、嚴(yán)肅主題或需要權(quán)威感的表達(dá) 。
Nova（新星）：一種明亮活潑的年輕女聲，語(yǔ)調(diào)輕快，充滿活力，適合廣告宣傳、教育內(nèi)容或面向年輕人的產(chǎn)品 。
Shimmer（微光）：一種柔和甜美的女性聲音，音質(zhì)細(xì)膩、富有情感，適合詩(shī)歌朗誦、情感類內(nèi)容或需要溫柔語(yǔ)氣的場(chǎng)景
4、文生圖模型（DALL·E 3 ）：DALL·E 3 是OpenAI于2023年9月發(fā)布的第三代文本生成圖像人工智能模型，它在圖像細(xì)節(jié)、語(yǔ)義理解與藝術(shù)表現(xiàn)力方面實(shí)現(xiàn)了顯著突破，能夠根據(jù)自然語(yǔ)言描述生成高質(zhì)量、高保真的視覺內(nèi)容 。
該模型深度集成于ChatGPT，用戶無(wú)需掌握復(fù)雜提示詞技巧，只需輸入簡(jiǎn)單想法，ChatGPT即可自動(dòng)優(yōu)化并生成詳細(xì)提示，驅(qū)動(dòng)DALL-E 3出圖 。例如，輸入“一只穿宇航服的貓走在月球上”，模型能精準(zhǔn)理解每一個(gè)元素并生成富有想象力的畫面 。
5、語(yǔ)音轉(zhuǎn)文本（Whisper模型：whisper-1）音頻種類分別支持："wav", "mp3", "webm", "mpeg", "mpga"
這里我們我們?nèi)绻枰獙⒄Z(yǔ)音轉(zhuǎn)化為中文則需要設(shè)置 prompt="中文" ，prompt在大模型里代表的是提示語(yǔ)的意思。
transcript = client.audio.translations.create(
model="whisper-1",
file=audio_file,
response_format="text",
prompt="中文"
)
// 返回轉(zhuǎn)錄文本
return transcript
3.3 當(dāng)然處理openai發(fā)布的一些大模型，我們同樣的可以集成一些國(guó)產(chǎn)的大模型。當(dāng)下比較應(yīng)用廣泛的科大訊飛、智譜清言、通義千問(wèn)、文心一言、deepseek、kimi....
比如，當(dāng)前我將項(xiàng)目里集成阿里的通義千問(wèn)模型（"qwen-plus", "qwen-max", "qwen-turbo"）
在pages下創(chuàng)建一個(gè) python文件，命名為 千問(wèn).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"):
"""使用通義千問(wèn)生成文本"""
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"文本生成錯(cuò)誤: {str(e)}"
def generate_image(prompt, n=1, size="1024*1024"):
"""使用通義千問(wèn)生成圖像"""
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"圖像生成錯(cuò)誤: {str(e)}")
return []
同樣的使用Streamlit對(duì)大模型進(jìn)行集成。
社區(qū)熱度: 在開源社區(qū)中較為火熱，許多國(guó)外開源項(xiàng)目喜歡使用Streamlit進(jìn)行大模型應(yīng)用的集成。
特點(diǎn)適用場(chǎng)景:
快速開發(fā)Demo: 非常適合用于快速開發(fā)演示Demo，簡(jiǎn)化前后端開發(fā)流程。
內(nèi)部工具: 可作為內(nèi)部工具或演示使用，提高開發(fā)效率。
注意: 對(duì)于專門的前后端開發(fā)，仍建議使用React、Vue等框架以滿足更復(fù)雜的需求。
當(dāng)前AI編程工具也給大家推薦一些：
大家常用的 Cursor、Claude Code、 Trae等
這類工具已超越代碼補(bǔ)全，進(jìn)入自主規(guī)劃、執(zhí)行、驗(yàn)證的智能體階段，能理解整個(gè)項(xiàng)目上下文，自動(dòng)拆解需求、修改多文件、運(yùn)行測(cè)試并修復(fù)Bug。使用起來(lái)程序員在一定程度上解放雙手可以更加專注于邏輯、算法和業(yè)務(wù)。
4、運(yùn)行
4.1 項(xiàng)目搭建完成后我們使用streamlit進(jìn)行啟動(dòng)
使用控制臺(tái)命令定位到首頁(yè).py所在的路徑下執(zhí)行
D:\pycharm\project\aichat\chatbot-app\src> streamlit run 首頁(yè).py
streamlit 默認(rèn)的端口為 8501
如果想用其他的端口則可以執(zhí)行命令：streamlit run 首頁(yè).py --server port 8588
切換端口；
5、效果：
6、后期經(jīng)過(guò)不斷擴(kuò)展增加了一些提供辦公效率的功能：
