继前言:
在这篇博客中,我们将介绍如何使用 Python 的 Flask 框架开发一个简单的图片服务应用。该应用根据用户的设备类型(PC 或移动端)动态返回横屏或竖屏的图片。应用支持通过设备的 User-Agent
头部信息来判断是 PC 设备还是移动设备,并根据设备类型提供不同的图片。
一、项目结构
假设我们的项目目录结构如下:
- app.py:Flask 应用的主程序,负责路由和逻辑实现。
- landscape/:横屏图片存放目录。
- portrait/:竖屏图片存放目录。
二、app.py代码
from flask import Flask, send_from_directory, request, abort
import os
import random
app = Flask(__name__)
# 定义图片文件夹路径
PC_IMAGE_FOLDER = './landscape' # 替换为存放横屏图片的实际路径
MOBILE_IMAGE_FOLDER = './portrait' # 替换为存放竖屏图片的实际路径
# 设备标识符
MOBILE_DEVICES = ['iphone', 'android', 'ipad']
def get_random_image(folder):
"""从指定文件夹中随机选取一张图片"""
try:
images = [f for f in os.listdir(folder) if os.path.isfile(os.path.join(folder, f))]
if not images:
return None
return random.choice(images)
except FileNotFoundError:
return None
@app.route('/')
def serve_image():
user_agent = request.headers.get('User-Agent', '').lower()
if any(mobile in user_agent for mobile in MOBILE_DEVICES):
# 移动端请求
image_folder = MOBILE_IMAGE_FOLDER
else:
# PC端请求
image_folder = PC_IMAGE_FOLDER
image_name = get_random_image(image_folder)
if image_name:
return send_from_directory(image_folder, image_name)
else:
abort(404, description="No images found")
@app.route('/pc')
def serve_pc_image():
"""返回PC端(横屏)随机图片"""
image_name = get_random_image(PC_IMAGE_FOLDER)
if image_name:
return send_from_directory(PC_IMAGE_FOLDER, image_name)
else:
abort(404, description="No images found in PC image folder")
@app.route('/mobile')
def serve_mobile_image():
"""返回移动端(竖屏)随机图片"""
image_name = get_random_image(MOBILE_IMAGE_FOLDER)
if image_name:
return send_from_directory(MOBILE_IMAGE_FOLDER, image_name)
else:
abort(404, description="No images found in Mobile image folder")
if __name__ == '__main__':
app.run(host='0.0.0.0', port=5000)
三、如何使用
1. 安装 Flask
首先,你需要安装 Flask。可以通过以下命令来安装:
pip install flask
2. 配置图片文件夹
确保你在项目根目录下有两个文件夹:landscape
和 portrait
,分别存放横屏和竖屏图片。如果没有图片,可以随便添加一些图片文件进行测试。
3. 运行 Flask 应用
在项目根目录下运行 Flask 应用:
python app.py
默认情况下,Flask 会在本地启动一个开发服务器,监听 5000 端口。
4. 测试应用
- 访问 http://localhost:5000,应用会根据你的设备类型返回图片。如果你在 PC 上访问,将返回横屏图片;如果你在移动设备上访问,将返回竖屏图片。
- 你也可以访问 http://localhost:5000/pc 或 http://localhost:5000/mobile 来分别测试 PC 和移动端图片的返回。