Flask实现图片的上传、下载及展示示例代码


Posted in Python onAugust 03, 2018

用Flask处理图片非常容易,这一篇学习一下图片的上传、下载及展示。还是以实例代码演示为主。

首先,实现一个简单的上传(过程中未做任何处理,只是为了演示)

点击选择图片,输入李四:

Flask实现图片的上传、下载及展示示例代码

HTML代码:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
  <body>
    <div>
      <form method="post" action="http://localhost:5000/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>

点击提交信息后,通过 http://localhost:5000/up_photo,传递到后台对应的路由处理,查看控制台:

Flask实现图片的上传、下载及展示示例代码

后台接收的路由代码:

basedir = os.path.abspath(os.path.dirname(__file__))
 
@app.route('/up_photo', methods=['post'])
def up_photo():
  img = request.files.get('txt_photo')
  username = request.form.get("name")
  path = basedir+"/static/photo/"
  file_path = path+img.filename
  img.save(file_path)
  print '上传头像成功,上传的用户是:'+username
  return render_template('index.html')

此时,我们查看static/photo时,已经可以看到我们点击上传的图片了。

以上是最简单的一个文件上传示例,我们实际使用中基本不可能这样去写,通常会做一些处理。例如:上传后做图片名称唯一性的处理、限制上传文件的类型、无论上传成功或者失败,都去做一些返回提示等等。

限制上传文件类型,例如,我们希望用户上传的文件为图片类型

ALLOWED_EXTENSIONS = set(['png', 'jpg', 'JPG', 'PNG', 'gif', 'GIF'])
 
def allowed_file(filename):
  return '.' in filename and filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS

上面的代码片段通过截取上传文件的后缀名,判断是否是属于我们期望用户上传的类型。

更改上传图片名称,防止重名

这里我们使用日期加随机数生成图片名,做一个生成字符串的工具类

#-*-coding:utf-8-*-
import datetime
import random
class Pic_str:
  def create_uuid(self): #生成唯一的图片的名称字符串,防止图片显示时的重名问题
    nowTime = datetime.datetime.now().strftime("%Y%m%d%H%M%S"); # 生成当前时间
    randomNum = random.randint(0, 100); # 生成的随机整数n,其中0<=n<=100
    if randomNum <= 10:
      randomNum = str(0) + str(randomNum);
    uniqueNum = str(nowTime) + str(randomNum);
    return uniqueNum;

当我们点击图片上传,选择图片点击提交后,页面返回提示信息如下图:

Flask实现图片的上传、下载及展示示例代码

此时看我们工程下的upload文件夹,唯一名称的图片已经上传成功

Flask实现图片的上传、下载及展示示例代码

图片的下载

@app.route('/download/<string:filename>', methods=['GET'])
def download(filename):
  if request.method == "GET":
    if os.path.isfile(os.path.join('upload', filename)):
      return send_from_directory('upload', filename, as_attachment=True)
    pass

图片的展示

# show photo
@app.route('/show/<string:filename>', methods=['GET'])
def show_photo(filename):
  file_dir = os.path.join(basedir, app.config['UPLOAD_FOLDER'])
  if request.method == 'GET':
    if filename is None:
      pass
    else:
      image_data = open(os.path.join(file_dir, '%s' % filename), "rb").read()
      response = make_response(image_data)
      response.headers['Content-Type'] = 'image/png'
      return response
  else:
    pass

完整示例代码

#encoding:utf-8
#!/usr/bin/env python
from werkzeug.utils import secure_filename
from flask import Flask, render_template, jsonify, request, make_response, send_from_directory, abort
import time
import os
from strUtil import Pic_str
import base64
 
app = Flask(__name__)
UPLOAD_FOLDER = 'upload'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
basedir = os.path.abspath(os.path.dirname(__file__))
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'JPG', 'PNG', 'gif', 'GIF'])
 
def allowed_file(filename):
  return '.' in filename and filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS
 
 
@app.route('/upload')
def upload_test():
  return render_template('up.html')
 
 
# 上传文件
@app.route('/up_photo', methods=['POST'], strict_slashes=False)
def api_upload():
  file_dir = os.path.join(basedir, app.config['UPLOAD_FOLDER'])
  if not os.path.exists(file_dir):
    os.makedirs(file_dir)
  f = request.files['photo']
  if f and allowed_file(f.filename):
    fname = secure_filename(f.filename)
    print fname
    ext = fname.rsplit('.', 1)[1]
    new_filename = Pic_str().create_uuid() + '.' + ext
    f.save(os.path.join(file_dir, new_filename))
 
    return jsonify({"success": 0, "msg": "上传成功"})
  else:
    return jsonify({"error": 1001, "msg": "上传失败"})
 
@app.route('/download/<string:filename>', methods=['GET'])
def download(filename):
  if request.method == "GET":
    if os.path.isfile(os.path.join('upload', filename)):
      return send_from_directory('upload', filename, as_attachment=True)
    pass
  
  
# show photo
@app.route('/show/<string:filename>', methods=['GET'])
def show_photo(filename):
  file_dir = os.path.join(basedir, app.config['UPLOAD_FOLDER'])
  if request.method == 'GET':
    if filename is None:
      pass
    else:
      image_data = open(os.path.join(file_dir, '%s' % filename), "rb").read()
      response = make_response(image_data)
      response.headers['Content-Type'] = 'image/png'
      return response
  else:
    pass
 
 
if __name__ == '__main__':
  app.run(debug=True)

基本示例就以上这些了!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
跨平台python异步回调机制实现和使用方法
Nov 26 Python
用Python编写生成树状结构的文件目录的脚本的教程
May 04 Python
Python实现的HTTP并发测试完整示例
Apr 23 Python
举例区分Python中的浅复制与深复制
Jul 02 Python
python清除字符串中间空格的实例讲解
May 11 Python
在Python运行时动态查看进程内部信息的方法
Feb 22 Python
python全栈要学什么 python全栈学习路线
Jun 28 Python
python函数局部变量、全局变量、递归知识点总结
Nov 15 Python
python 贪心算法的实现
Sep 18 Python
python3实现飞机大战
Nov 29 Python
解决Pycharm 运行后没有输出的问题
Feb 05 Python
python可视化分析绘制带趋势线的散点图和边缘直方图
Jun 25 Python
python使用opencv驱动摄像头的方法
Aug 03 #Python
python 简单照相机调用系统摄像头实现方法 pygame
Aug 03 #Python
Python判断字符串是否为字母或者数字(浮点数)的多种方法
Aug 03 #Python
OpenCV2从摄像头获取帧并写入视频文件的方法
Aug 03 #Python
python中copy()与deepcopy()的区别小结
Aug 03 #Python
Python爬取个人微信朋友信息操作示例
Aug 03 #Python
python opencv人脸检测提取及保存方法
Aug 03 #Python
You might like
写php分页时出现的Fatal error的解决方法
2011/04/18 PHP
利用PHP实现智能文件类型检测的实现代码
2011/08/02 PHP
利用yahoo汇率接口实现实时汇率转换示例 汇率转换器
2014/01/14 PHP
PHP中16个高危函数整理
2019/09/19 PHP
laravel实现一个上传图片的接口,并建立软链接,访问图片的方法
2019/10/12 PHP
JSON 编辑器实现代码
2009/12/06 Javascript
前端开发的开始---基于面向对象的Ajax类
2010/09/17 Javascript
JavaScript对象和字串之间的转换实例探讨
2013/04/21 Javascript
巧用局部变量提升javascript性能
2014/02/24 Javascript
Javascript基础教程之变量
2015/01/18 Javascript
javascript 兼容各个浏览器的事件
2015/02/04 Javascript
JS判断字符串包含的方法
2015/05/05 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
JS数组返回去重后数据的方法解析
2017/01/03 Javascript
深入研究jQuery图片懒加载 lazyload.js使用方法
2017/08/16 jQuery
JavaScript页面加载事件实例讲解
2019/09/01 Javascript
Vue3.0数据响应式原理详解
2019/10/09 Javascript
django简单的前后端分离的数据传输实例 axios
2020/05/18 Javascript
Python选择排序、冒泡排序、合并排序代码实例
2015/04/10 Python
深入理解python对json的操作总结
2017/01/05 Python
浅谈python的dataframe与series的创建方法
2018/11/12 Python
Python 通过微信控制实现app定位发送到个人服务器再转发微信服务器接收位置信息
2019/08/05 Python
关于Keras模型可视化教程及关键问题的解决
2020/01/24 Python
如何基于windows实现python定时爬虫
2020/05/01 Python
Python结合Window计划任务监测邮件的示例代码
2020/08/05 Python
Python实现敏感词过滤的4种方法
2020/09/12 Python
在Python中字典按值排序的实现方法
2020/11/12 Python
CSS3实现文字波浪线效果示例代码
2016/11/20 HTML / CSS
HTML5+Canvas+CSS3实现齐天大圣孙悟空腾云驾雾效果
2016/04/26 HTML / CSS
巴西服装和鞋子购物网站:Marisa
2018/10/25 全球购物
优秀导游先进事迹材料
2014/01/25 职场文书
幼儿园家长安全责任书
2014/07/22 职场文书
2014年文员工作总结
2014/11/18 职场文书
2015年重阳节主持词
2015/07/04 职场文书
推荐六本经典文学奖书籍:此生必读
2019/08/22 职场文书
CSS浮动引起的高度塌陷问题
2022/08/05 HTML / CSS