使用Flask实现本地图片上传和显示,支持mysql存储

本文介绍了如何使用Python的Flask框架结合MySQL数据库实现图片上传功能,包括创建Flask应用、设置路由、处理上传、保存图片路径到数据库以及HTML模板的编写。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

要使用FLask框架实现图片上传和显示,首先需要创建Flask框架的项目(使用pycharm专业版)

app.py

import pymysql
from flask import Flask, request, redirect, url_for, render_template
import os

from pymysql import Error

app = Flask(__name__)
app.secret_key = 'dsdfsfdaxxx'

# 数据库连接对象
def get_db_connection():
    # 连接数据库
    db = pymysql.connect(user='root', password='Nebula@123', host='你的IP', port=3306, database='你的数据库')
    return db

# 保存图片路径到数据库
def save_to_db(filename):
    try:
        conn = get_db_connection()
        cursor = conn.cursor()
        query = "INSERT INTO images (image_path) VALUES (%s)"
        cursor.execute(query, filename)  # 修改为你的本地目录路径和文件名
        conn.commit()
        cursor.close()
        conn.close()
    except Error as e:
        print(e)

# 上传本地图片
@app.route('/')
@app.route('/upload', methods=['GET', 'POST'])
def upload():
    if request.method == 'POST':
        file = request.files['image']  # 从请求中获取文件
        filename = os.path.join(os.getcwd(),'static/uploaded_images', file.filename)  # 拼接文件绝对路径
        file.save(filename)   # 将文件保存到本地文件系统
        # save_to_db(filename)  # 将文件路径存储到数据库中
        return redirect(url_for('uploaded_file', filename=file.filename))  # 重定向到文件上传成功的页面
    return render_template('upload.html')


@app.route('/uploaded_file/<filename>')
def uploaded_file(filename):
    return render_template('index.html',filename=filename)  # 显示已上传的图片

需要在templates目录下创建两个html,一个用来上传,一个用来显示

index.html用来做显示:

注意:需要创建上传图片的路径,路径必须放在static目录下,否则框架不支持显示图片

我这里创建了uploaded_images子目录

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
   <title>图片展示页面</title>
    <style>
        input[type=submit] {
            background-color: #333;
            color: #fff;
            border: none;
            padding: 10px 20px;
            cursor: pointer;
        }
        input[type=submit]:hover {
            background-color: #555;
        }
    </style>
</head>
<body>
    <h1>图片展示页面</h1>
    <div>
        <img src='../static/uploaded_images/{{ filename }}'  alt='{{ filename }}'>
    </div>
    <a href="{{ url_for('upload') }}">上传图片</a>

</body>
</html>

uploade.html上传图片页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图片上传</title>
    <style>
        input[type=submit]{
            background-color: #333;
            color: #fff;
            border: none;
            padding: 10px 20px;
            cursor: pointer;
        }
        input[type=submit]:hover {
            background-color: #555;
        }
    </style>
</head>
<body>
    <h1>图片上传</h1>
    <form action="{{ url_for('upload') }}" method="post" enctype=multipart/form-data>
          <input type=file name=image>
          <input type=submit value=上传>
    </form>
</body>
</html>

可支持使用mysql数据库存储图片绝对路径

需要创建表

CREATE TABLE images (image_path VARCHAR(255));

之后运行访问:

选择上传

点击上传后显示如下

项目目录保存有图片

数据库使用需要打开如下注释

# save_to_db(filename)  # 将文件路径存储到数据库中

运行后可在数据库中查看到路径

 

注意:将图片直接保存到数据库可能不是最佳实践,因为这可能会导致数据库大小急剧增长,并可能影响查询性能。在大多数情况下,建议将图片保存到文件系统,并在数据库中存储图片的路径或URL。我这里选择的是后者。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

xingdiango

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

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

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

打赏作者

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

抵扣说明:

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

余额充值