logo

开发者热搜

手把手教你用Python+文心一言打造AI看图写诗网页

作者：宇宙中心我曹县2025.10.10 16:40浏览量：1

简介：本文将通过Python与文心一言API实现一个完整的AI看图写诗网页应用，包含前端交互、图片处理和诗歌生成全流程，提供可运行的完整代码。

手把手教你用Python+文心一言打造AI看图写诗网页

一、项目背景与核心价值

在AI技术快速发展的今天，将图像识别与自然语言处理结合的应用场景日益丰富。本项目通过Python构建网页应用，集成文心一言的文本生成能力，实现用户上传图片后自动生成对应诗歌的功能。这种跨模态的AI应用不仅展示了技术融合的魅力，更能帮助开发者理解API调用、前后端交互等关键技术点。

二、技术栈与开发准备

1. 核心组件

  • Python 3.8+：作为后端开发语言
  • Flask 2.0+：轻量级Web框架
  • 文心一言API：提供诗歌生成能力
  • HTML5/CSS3：前端页面构建
  • Pillow库：图片基础处理

2. 环境配置

  1. # 创建虚拟环境
  2. python -m venv venv
  3. source venv/bin/activate  # Linux/Mac
  4. venv\Scripts\activate     # Windows
  6. # 安装依赖
  7. pip install flask pillow requests

3. API密钥获取

访问文心一言开放平台，创建应用获取API Key和Secret Key，这是调用诗歌生成服务的凭证。

三、系统架构设计

1. 功能模块划分

  • 图片上传模块：处理用户图片输入
  • 预处理模块：调整图片尺寸和格式
  • API调用模块：与文心一言服务交互
  • 结果展示模块：呈现生成的诗歌

2. 数据流分析

用户上传图片 → 后端接收并预处理 → 调用文心一言API → 返回诗歌文本 → 前端渲染展示

四、核心代码实现

1. Flask后端搭建

  1. from flask import Flask, render_template, request
  2. import os
  3. from PIL import Image
  4. import requests
  5. import base64
  6. import json
  8. app = Flask(__name__)
  9. app.config['UPLOAD_FOLDER'] = 'uploads'
  10. os.makedirs(app.config['UPLOAD_FOLDER'], exist_ok=True)
  12. # 文心一言API配置
  13. API_KEY = 'your_api_key'
  14. SECRET_KEY = 'your_secret_key'
  15. ACCESS_TOKEN = None  # 实际项目中需实现获取token的逻辑

2. 图片处理函数

  1. def process_image(image_path):
  2.     try:
  3.         with Image.open(image_path) as img:
  4.             # 调整图片尺寸为512x512
  5.             img = img.resize((512, 512))
  6.             # 转换为RGB模式（处理PNG透明通道）
  7.             if img.mode != 'RGB':
  8.                 img = img.convert('RGB')
  9.             # 保存处理后的图片
  10.             processed_path = os.path.join('processed', os.path.basename(image_path))
  11.             os.makedirs('processed', exist_ok=True)
  12.             img.save(processed_path)
  13.             return processed_path
  14.     except Exception as e:
  15.         print(f"图片处理错误: {e}")
  16.         return None

3. 文心一言API调用

  1. def generate_poem(image_prompt):
  2.     if not ACCESS_TOKEN:
  3.         # 实际项目中需实现获取token的逻辑
  4.         pass
  6.     url = "https://aip.baidubce.com/rpc/2.0/ai_custom/v1/wenxinworkshop/chat/completions"
  7.     headers = {
  8.         'Content-Type': 'application/json',
  9.         'Authorization': f'Bearer {ACCESS_TOKEN}'
  10.     }
  12.     data = {
  13.         "messages": [
  14.             {
  15.                 "role": "user",
  16.                 "content": f"根据以下图片描述创作一首中文诗歌：{image_prompt}"
  17.             }
  18.         ]
  19.     }
  21.     try:
  22.         response = requests.post(url, headers=headers, data=json.dumps(data))
  23.         result = response.json()
  24.         return result.get('result', '')
  25.     except Exception as e:
  26.         print(f"API调用错误: {e}")
  27.         return "生成诗歌时发生错误"

4. 路由与视图函数

  1. @app.route('/', methods=['GET', 'POST'])
  2. def index():
  3.     poem = None
  4.     if request.method == 'POST':
  5.         if 'image' not in request.files:
  6.             return render_template('index.html', error="请选择图片文件")
  8.         file = request.files['image']
  9.         if file.filename == '':
  10.             return render_template('index.html', error="未选择文件")
  12.         if file:
  13.             # 保存上传的图片
  14.             image_path = os.path.join(app.config['UPLOAD_FOLDER'], file.filename)
  15.             file.save(image_path)
  17.             # 处理图片并生成描述（简化版，实际需实现图像描述生成）
  18.             processed_path = process_image(image_path)
  19.             image_prompt = "一幅美丽的自然风景图，有山有水"  # 实际项目中应通过图像识别API获取
  21.             # 生成诗歌
  22.             poem = generate_poem(image_prompt)
  24.     return render_template('index.html', poem=poem)
  26. if __name__ == '__main__':
  27.     app.run(debug=True)

五、前端页面开发

1. HTML基础结构

  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>AI看图写诗</title>
  7.     <link rel="stylesheet" href="static/style.css">
  8. </head>
  9. <body>
  10.     <div class="container">
  11.         <h1>AI看图写诗</h1>
  12.         <form method="POST" enctype="multipart/form-data">
  13.             <div class="form-group">
  14.                 <label for="image">选择图片：</label>
  15.                 <input type="file" id="image" name="image" accept="image/*" required>
  16.             </div>
  17.             <button type="submit">生成诗歌</button>
  18.         </form>
  20.         {% if poem %}
  21.         <div class="poem-container">
  22.             <h2>生成的诗歌：</h2>
  23.             <pre>{{ poem }}</pre>
  24.         </div>
  25.         {% endif %}
  27.         {% if error %}
  28.         <div class="error">{{ error }}</div>
  29.         {% endif %}
  30.     </div>
  31. </body>
  32. </html>

2. CSS样式设计

  1. body {
  2.     font-family: 'Microsoft YaHei', sans-serif;
  3.     line-height: 1.6;
  4.     color: #333;
  5.     max-width: 800px;
  6.     margin: 0 auto;
  7.     padding: 20px;
  8.     background-color: #f5f5f5;
  9. }
  11. .container {
  12.     background-color: white;
  13.     padding: 30px;
  14.     border-radius: 8px;
  15.     box-shadow: 0 0 10px rgba(0,0,0,0.1);
  16. }
  18. h1 {
  19.     color: #2c3e50;
  20.     text-align: center;
  21. }
  23. .form-group {
  24.     margin-bottom: 20px;
  25. }
  27. button {
  28.     background-color: #3498db;
  29.     color: white;
  30.     border: none;
  31.     padding: 10px 20px;
  32.     border-radius: 4px;
  33.     cursor: pointer;
  34.     font-size: 16px;
  35. }
  37. button:hover {
  38.     background-color: #2980b9;
  39. }
  41. .poem-container {
  42.     margin-top: 30px;
  43.     padding: 20px;
  44.     background-color: #f8f9fa;
  45.     border-radius: 4px;
  46. }
  48. .error {
  49.     color: #e74c3c;
  50.     margin-top: 20px;
  51. }

六、项目部署与优化

1. 本地测试流程

  1. 启动Flask应用：python app.py
  2. 访问http://localhost:5000
  3. 上传图片测试功能

2. 生产环境部署建议

  • 使用Nginx + Gunicorn部署
  • 配置HTTPS证书
  • 实现图片上传大小限制
  • 添加用户认证机制

3. 性能优化方向

  • 实现图片缓存机制
  • 添加API调用频率限制
  • 实现异步任务处理（Celery）
  • 添加前端加载动画

七、完整项目源码获取

完整项目源码已整理至GitHub仓库：
[项目GitHub地址]（示例链接，实际使用时替换）

包含以下内容：

  • 所有Python后端代码
  • 完整HTML/CSS前端文件
  • 依赖要求文件
  • 部署说明文档

八、扩展功能建议

  1. 多风格诗歌生成：通过参数控制诗歌风格（古典/现代/浪漫等）
  2. 图片描述增强：集成图像识别API自动生成图片描述
  3. 诗歌历史记录：添加数据库存储用户生成的诗歌
  4. 社交分享功能：实现诗歌一键分享到社交平台

九、常见问题解决方案

  1. API调用失败：检查密钥是否正确，网络连接是否正常
  2. 图片处理错误：确保安装了Pillow库，检查图片格式
  3. 跨域问题：开发时添加@app.after_request装饰器处理CORS
  4. 中文乱码：确保HTML文件保存为UTF-8编码

本项目完整实现了从图片上传到诗歌生成的全流程，开发者可以通过修改API调用部分适配不同的文本生成服务。实际部署时建议添加错误处理和日志记录机制，提升系统稳定性。

相关文章推荐

发表评论

最热文章

关于作者

  • 被阅读数
  • 被赞数
  • 被收藏数
活动
咨询