Flask web上传获取图像Image读取并使用方式
作者:loong_XL 发布时间:2021-06-14 11:37:58
Flask web上传获取图像Image读取并使用
图片上传界面
后端
@app.route('/upload')
def upload_test():
return render_template('new.html')
前端:new.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<form method="post" action="http://localhost:6600/up_photo" enctype="multipart/form-data">
<input type="file" size="30" name="photo"/>
<br>
<!-- <input type="text" class="txt_input" name="name" style="margin-top:15px;"/>-->
<input type="submit" value="提交信息" class="button-new" style="margin-top:15px;"/>
</form>
</div>
</body>
</html>
图片上传后端处理代码
后端
***stream获取图像文件,另外[‘photo’]与前端name="photo"属性对其
@app.route('/up_photo', methods=['post'])
def up_photo():
img1 = request.files['photo']
print(type(img1))
img = Image.open(img1.stream)
# 保存图片
img1.save(file_path)
Flask上传本地图片并在页面上显示
使用Flask远程上传图片到服务器,并把获取到的图片显示到前端页面上。
方法一
目录结构:
'
static/images
' 文件夹用来存放上传过来的图片'
templates
’文件夹下的两个html文件定义显示页面upload_pictures.py
是工程代码
'static/images' 文件夹用来存放上传过来的图片‘templates’文件夹下的两个html文件定义显示页面upload_pictures.py 是工程代码
upload_pictures.py 代码:
# coding:utf-8
from flask import Flask, render_template, request, redirect, url_for, make_response,jsonify
from werkzeug.utils import secure_filename
import os
import cv2
import time
from datetime import timedelta
#设置允许的文件格式
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'JPG', 'PNG', 'bmp'])
def allowed_file(filename):
return '.' in filename and filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS
app = Flask(__name__)
# 设置静态文件缓存过期时间
app.send_file_max_age_default = timedelta(seconds=1)
# @app.route('/upload', methods=['POST', 'GET'])
@app.route('/upload', methods=['POST', 'GET']) # 添加路由
def upload():
if request.method == 'POST':
f = request.files['file']
if not (f and allowed_file(f.filename)):
return jsonify({"error": 1001, "msg": "请检查上传的图片类型,仅限于png、PNG、jpg、JPG、bmp"})
user_input = request.form.get("name")
basepath = os.path.dirname(__file__) # 当前文件所在路径
upload_path = os.path.join(basepath, 'static/images', secure_filename(f.filename)) # 注意:没有的文件夹一定要先创建,不然会提示没有该路径
# upload_path = os.path.join(basepath, 'static/images','test.jpg') #注意:没有的文件夹一定要先创建,不然会提示没有该路径
f.save(upload_path)
# 使用Opencv转换一下图片格式和名称
img = cv2.imread(upload_path)
cv2.imwrite(os.path.join(basepath, 'static/images', 'test.jpg'), img)
return render_template('upload_ok.html',userinput=user_input,val1=time.time())
return render_template('upload.html')
if __name__ == '__main__':
# app.debug = True
app.run(host='0.0.0.0', port=8987, debug=True)
upload.html 文件代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flask上传图片演示</title>
</head>
<body>
<h1>使用Flask上传本地图片并显示示例一</h1>
<form action="" enctype='multipart/form-data' method='POST'>
<input type="file" name="file" style="margin-top:20px;"/>
<br>
<i>请输入你当前的心情(开心、超开心、超超开心):</i>
<input type="text" class="txt_input" name="name" value="超超开心" style="margin-top:10px;"/>
<input type="submit" value="上传" class="button-new" style="margin-top:15px;"/>
</form>
</body>
</html>
upload_ok.html文件代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flask上传图片演示</title>
</head>
<body>
<h1>使用Flask上传本地图片并显示示例一</h1>
<form action="" enctype='multipart/form-data' method='POST'>
<input type="file" name="file" style="margin-top:20px;"/>
<br>
<i>请输入你当前的心情(开心、超开心、超超开心):</i>
<input type="text" class="txt_input" name="name" value="超超开心" style="margin-top:10px;"/>
<input type="submit" value="上传" class="button-new" style="margin-top:15px;"/>
</form>
<h1>阁下的心情是:{{userinput}}!</h1>
<img src="{{ url_for('static', filename= './images/test.jpg',_t=val1) }}" width="400" height="400" alt="你的图片被外星人劫持了~~"/>
</body>
</html>
直接运行 python upload_pictures.py 就行了,定义了端口号8987,在本机上访问 '127.0.0.1:8987/upload' ,出现以下界面:
点击'浏览' 并上传后,上传的图片保存到了 ‘static/images'目录下,显示结果:
方法二
目录结构:
目录文件介绍同方法一。
upload_pictures.py 代码:
# coding:utf-8
from flask import Flask,render_template,request,redirect,url_for,make_response,jsonify
from werkzeug.utils import secure_filename
import os
import cv2
from datetime import timedelta
#设置允许的文件格式
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'JPG', 'PNG', 'bmp'])
def allowed_file(filename):
return '.' in filename and filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS
app = Flask(__name__)
# 设置静态文件缓存过期时间
app.send_file_max_age_default = timedelta(seconds=1)
@app.route('/upload', methods=['POST', 'GET']) # 添加路由
def upload():
if request.method == 'POST':
f = request.files['file']
if not (f and allowed_file(f.filename)):
return jsonify({"error": 1001, "msg": "请检查上传的图片类型,仅限于png、PNG、jpg、JPG、bmp"})
user_input = request.form.get("name")
basepath = os.path.dirname(__file__) # 当前文件所在路径
upload_path = os.path.join(basepath, 'static/images',secure_filename(f.filename)) #注意:没有的文件夹一定要先创建,不然会提示没有该路径
f.save(upload_path)
image_data = open(upload_path, "rb").read()
response = make_response(image_data)
response.headers['Content-Type'] = 'image/png'
return response
return render_template('upload.html')
if __name__ == '__main__':
# app.debug = True
app.run(host = '0.0.0.0',port = 8987,debug= True)
upload.html 文件代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flask上传图片演示</title>
</head>
<body>
<h1>使用Flask上传本地图片并显示示例二</h1>
<form action="" enctype='multipart/form-data' method='POST'>
<input type="file" name="file" style="margin-top:20px;"/>
<br>
<i>请输入你当前的心情(开心、超开心、超超开心):</i>
<input type="text" class="txt_input" name="name" value="超超开心" style="margin-top:10px;"/>
<input type="submit" value="上传" class="button-new" style="margin-top:15px;"/>
</form>
</body>
</html>
运行 python upload_pictures.py ,端口号定义的是8987,在本机上访问 '127.0.0.1:8987/upload' ,出现以下界面:
点击'浏览' 并上传后,上传的图片保存到了 ‘static/images'目录下,显示结果:
方法二显示出来的图片覆盖了整个页面。
tips: 如果是在其他机器上访问,把127.0.0.1的IP换成服务器的IP就行了。
来源:https://blog.csdn.net/weixin_42357472/article/details/122491269


猜你喜欢
- 1、准备工作ide:pycharmpython:3.7三方包:pygame、pyinstaller、mutagen几首mp3格式的歌2、开始
- 最近没事刚好联系下vue+springboot前段后分离的项目、用上了图片上传功能、记录一下。前端待提交的表单部分代码<el-form
- 快速上手我们都知道go语言没有原生的注解,但是做业务开发有些时候没有注解确实不方便。go-doudou通过go语言标准库ast/parser
- 前言:饼状图是用来呈现一个数据系列中各项的大小与各项占项总和的百分比,Matplotlib 提供了plt.pie()方法绘制柱状图,语法格式
- 控制流实现控制流这部分代码主要涉及下面几条字节码指令,下面的所有字节码指令都会有一个参数:JUMP_FORWARD,指令完整条指令会将当前执
- 在项目文件中新建文件.env .env.pro 两个文件其中.env 是默认设置 .env.pro 为正式环境设置1、设置.env中的内容信
- 本文实例讲述了Python模块结构与布局操作方法。分享给大家供大家参考,具体如下:#coding=utf8#起始行#!/usr/bin/en
- 本文实例讲述了Python设计模式之备忘录模式原理与用法。分享给大家供大家参考,具体如下:备忘录模式(Memento Pattern):不破
- 容我废话一下最近几个月,毒教材被曝光引发争议,那些编写度教材的人着实可恶。咱程序员也没有手绘插画能力,但咱可以借助强大的深度学习模型将视频转
- 如何下载:我先去MySQL首页下载最新版本的MySQL-链接:https://www.mysql.com/downloads/进入此界面下载
- 1.什么是Hilbert矩阵矩阵下面分别列举了1*1;2*2;3*3大小的矩阵; 通过观察,我们发现其规律性极强,那第三列举个例子
- 如何用Perl脚本操作系统环境变量呢?想必很多朋友马上就会想到Perl中提供的$ENV这个特殊的哈希变量,对,在$ENV中完全可以获取到一些
- 在python中,总的来说有三种大的模式打开文件,分别是:a, w, r当以a模式打开时,只能写文件,而且是在文件末尾添加内容。当以a+模式
- 串口简述异步串行是指UART(Universal Asynchronous Receiver/Transmitter),通用异步接收/发送。
- 通过在File->setting->File and Code Templates设置模板代码,这样就可以在新建python文件
- 码农在囧途最近这段时间来经历了太多东西,无论是个人的压力还是个人和团队失误所带来的损失,都太多,被骂了很多,也被检讨,甚至一些不方便说的东西
- 1.cURL介绍 cURL 是一个利用URL语法规定来传输文件和数据的工具,支持很多协议,如HTTP、FTP、TELNET等。最爽的是,PH
- 理解 pandas 的函数,要对函数式编程有一定的概念和理解。函数式编程,包括函数式编程思维,当然是一个很复杂的话题,但对今天介绍的 app
- 一. 安装 Beautiful Soup首先,您需要安装 Beautiful Soup。在终端或命令提示符中运行以下命令:pip insta
- import cv2 as cvimport numpy as npimport matplotlib.pyplot as plt# 设置兼