使用 Streamlit +gpt-4o实现有界面的图片内容分析

在上一篇利用gpt-4o分析图像的基础上,进一步将基于 Python 的 Streamlit 库,结合 OpenAI 的 API,构建一个简洁易用的有界面图片内容分析应用。通过该应用,用户可以轻松浏览本地图片,并获取图片的详细描述。

目录

  1. 项目简介
  2. 项目环境搭建
  3. 代码详解
  4. 运行应用
  5. 总结与扩展

项目简介

本项目旨在通过构建一个基于网页界面的应用,使用户能够:

  • 浏览本地特定目录下的所有图片文件(支持 JPG、JPEG、PNG 格式)。
  • 选择任意图片并在界面中显示。
  • 使用 OpenAI 的 GPT-4 模型对选中的图片内容进行描述和分析。

项目环境搭建

在开始编码之前,请确保您的开发环境中已安装以下软件和库:

  • Python 3.7 及以上版本
  • Streamlit:用于快速构建网页应用
  • Pillow (PIL):用于处理图像文件
  • requests:用于发送 HTTP 请求
  • OpenAI Python 库:用于与 OpenAI API 交互

安装必要的 Python 库可以使用以下命令:

pip install streamlit pillow requests openai

此外,您需要获取 OpenAI 的 API 密钥,并将其设置为环境变量 OPENAI_API_KEY

代码详解

下面我们将逐步解析实现图片内容分析应用的代码。

导入所需库

首先,导入所有需要的 Python 库:

import streamlit as st
import os
from PIL import Image
import base64
import requests
  • streamlit 用于构建网页界面。
  • os 用于文件和目录操作。
  • PIL(Python Imaging Library)用于处理图像文件。
  • base64 用于对图像进行编码。
  • requests 用于发送 HTTP 请求与 OpenAI API 交互。

列出指定目录下的图片文件

定义一个函数,用于遍历指定的根目录及其所有子目录,列出所有符合指定扩展名(JPG、JPEG、PNG)的图片文件。

def list_files_in_all_directories(root_directory, extensions):
    files = []
    for dirpath, _, filenames in os.walk(root_directory
能不能帮我优化这段代码,让streamlit界面更加美观好看合理,有一问一答,更像个只能聊天系统 import streamlit as st from langchain_community.graphs import Neo4jGraph from langchain.chains import GraphCypherQAChain from langchain.prompts import PromptTemplate from langchain_openai import ChatOpenAI from langchain_ollama import ChatOllama # 连接 Neo4j 数据库 graph = Neo4jGraph( url="neo4j+s://bf0befc9.databases.neo4j.io", # 替换为你的 URL username="neo4j", password="Hl7FXJhH1azmgC34YhaweYyigcKwQK3wiRfNVNeWru8", database="neo4j" ) # DeepSeek 负责生成 Cypher qa_llm = ChatOllama( base_url="http://223.109.239.9:20006", model="deepseek-r1:70b", # system_prompt=cypher_prompt ) cypher_llm = ChatOpenAI( base_url="https://api.chatanywhere.tech/v1", api_key='sk-hZEb9uq0085t1EFFIm4RoXAvH4ktKshUFgWwDv3BneS0SIZp', model="gpt-4o-mini" ) # 构建 Cypher 生成和查询链 cypher_chain = GraphCypherQAChain.from_llm( graph=graph, cypher_llm=cypher_llm, qa_llm=qa_llm, validate_cypher=True, verbose=True, allow_dangerous_requests=True ) # Streamlit 页面 st.title("Meta 智能聊天助手") # 用户输入查询 user_query = st.text_input("💬 请输入你的问题:") # 提交按钮 if st.button("提交查询"): if user_query: try: # response = cypher_chain.invoke(user_query) # 提取最终的回答,去除多余部分 response = cypher_chain.invoke(user_query) print("\n🤖 机器人:", response) st.write("🤖 机器人:", response) except Exception as e: st.write("⚠️ 发生错误:", str(e)) else: st.write("请输入有效的问题。")
03-29
<think>好的,我需要帮助用户优化他们的Streamlit代码,让界面更美观、合理,并且实现一问一答的智能聊天系统。首先,我得仔细看看用户提供的代码,了解现有结构和功能。 用户当前的代码连接了Neo4j数据库,使用了LangChain的组件来处理Cypher查询和生成回答,界面部分比较简单,只有一个标题、输入框和提交按钮。结果显示在页面上,但可能缺乏聊天式的交互体验。 用户希望优化界面,使其更美观,更像一个智能聊天系统,具备一问一答的形式。所以需要改进的地方可能包括:消息历史记录、更自然的对话展示、样式美化、输入和响应的处理方式等。 首先,考虑使用Streamlit的session_state来保存聊天历史,这样每次提交问题后,都能保留之前的对话记录。这需要初始化一个messages列表在session_state中,每次用户输入问题后,将用户的问题和机器人的回答添加进去,然后遍历显示所有消息。 接下来,优化界面元素。当前的输入框和按钮布局可能不够直观,可以换成使用st.chat_input在底部固定输入栏,这样更符合常见聊天应用的布局。同时,按钮可以去掉,改为实时响应输入(比如按回车发送),或者保留按钮但调整位置。 然后,美化消息的显示样式。使用st.chat_message组件来区分用户和机器人的消息,添加头像和不同的背景颜色,使对话看起来更自然。比如,用户的消息显示在右侧,机器人在左侧,或者使用不同的颜色区分。 错误处理方面,当前代码在捕获异常后直接显示错误信息,可能需要更友好的提示,比如用emoji或颜色高亮错误信息,避免用户感到困惑。 另外,加载状态提示也很重要。当处理查询时,显示一个加载中的指示器,比如spinner,让用户知道系统正在处理,提升用户体验。 代码结构方面,可能需要将部分逻辑封装成函数,比如处理用户输入和生成响应的部分,使代码更清晰易读。同时,添加必要的注释,方便后续维护。 关于样式调整,可以自定义Streamlit的主题,或者使用CSS注入来调整字体、颜色、间距等。例如,通过st.markdown添加自定义CSS样式,美化聊天框的外观。 最后,确保功能逻辑正确,比如检查Neo4j连接是否稳定,处理空输入的情况,以及优化响应生成的效率,避免界面卡顿。 现在,综合这些点,我需要逐步修改代码,实现上述优化。首先处理session_state存储消息,然后调整输入和消息显示方式,添加样式美化,最后测试功能是否正常。</think>我帮您从以下几个方面优化代码,实现更专业的聊天界面: $$改进点示意图$$ 1. 消息历史管理 → 增加session_state存储对话 2. 界面布局优化 → 使用聊天式布局 3. 交互体验提升 → 添加加载状态提示 4. 样式美化 → 自定义CSS样式 $$优化后代码$$ ```python import streamlit as st from langchain_community.graphs import Neo4jGraph from langchain.chains import GraphCypherQAChain from langchain_openai import ChatOpenAI from langchain_ollama import ChatOllama # ---------- 样式配置 ---------- st.set_page_config(page_title="Meta 智能助手", page_icon="🤖", layout="centered") st.markdown(""" <style> .stChatInput {position: fixed; bottom: 2rem; width: 85%;} .stChatMessage {padding: 1rem; border-radius: 15px; margin: 0.5rem 0;} .user-message {background-color: #f0f2f6; margin-left: 20%;} .assistant-message {background-color: #e6f4ff; margin-right: 20%;} </style> """, unsafe_allow_html=True) # ---------- 系统初始化 ---------- @st.cache_resource def init_resources(): # 数据库连接 graph = Neo4jGraph( url="neo4j+s://bf0befc9.databases.neo4j.io", username="neo4j", password="Hl7FXJhH1azmgC34YhaweYyigcKwQK3wiRfNVNeWru8", database="neo4j" ) # 模型初始化 qa_llm = ChatOllama( base_url="http://223.109.239.9:20006", model="deepseek-r1:70b" ) cypher_llm = ChatOpenAI( base_url="https://api.chatanywhere.tech/v1", api_key='sk-hZEb...', model="gpt-4o-mini" ) return GraphCypherQAChain.from_llm( graph=graph, cypher_llm=cypher_llm, qa_llm=qa_llm, validate_cypher=True, verbose=True, allow_dangerous_requests=True ) # ---------- 页面主体 ---------- st.title("🤖 Meta 知识图谱助手") st.caption("您好!我是基于知识图谱的智能助手,请问有什么可以帮您?") # 初始化对话历史 if "messages" not in st.session_state: st.session_state.messages = [] # 显示历史消息 for msg in st.session_state.messages: with st.chat_message(msg["role"], avatar=msg["avatar"]): st.write(msg["content"]) # 用户输入处理 if prompt := st.chat_input("请输入您的问题..."): # 添加用户消息 st.session_state.messages.append({"role": "user", "content": prompt, "avatar": "👤"}) with st.chat_message("user", avatar="👤"): st.write(prompt) # 生成响应 with st.spinner("正在思考中,请稍候..."): try: chain = init_resources() response = chain.invoke(prompt)["result"] # 添加助手响应 st.session_state.messages.append({"role": "assistant", "content": response, "avatar": "🤖"}) with st.chat_message("assistant", avatar="🤖"): st.write(response) except Exception as e: error_msg = f"⚠️ 处理请求时发生错误:{str(e)}" st.session_state.messages.append({"role": "assistant", "content": error_msg, "avatar": "❌"}) with st.chat_message("assistant", avatar="❌"): st.error(error_msg) ``` $$主要优化说明$$ 1. **消息历史管理** - 使用`session_state`存储完整对话记录 - 支持消息持久化(刷新页面保留历史) 2. **交互体验提升** - 固定底部输入栏(`position: fixed`) - 添加加载状态提示(`st.spinner`) - 错误消息特殊标识(红色❌图标) 3. **视觉优化** - 自定义CSS样式(圆角边框、颜色区分) - 消息气泡左右布局(用户右,助手左) - 添加系统图标(页面图标+角色头像) 4. **代码结构优化** - 资源初始化使用`@st.cache_resource` - 分离配置、初始化、界面逻辑 - 增强异常处理机制 建议部署时可添加: 1. 侧边栏配置项(调整模型参数) 2. 对话历史导出功能 3. 支持Markdown/LaTeX渲染 4. 打字机效果输出 需要进一步优化特定功能可以告诉我,我可以提供针对性改进方案。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

风翔

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值