Flask Web开发入门之文件上传(八)


Posted in Python onAugust 17, 2018

本章我们介绍Flask Web开发中涉及的文件上传模块

定义后台接收处理逻辑

# http://flask.pocoo.org/docs/0.12/patterns/fileuploads/
@app.route('/upload', methods=['POST'])
def upload_file():
  if request.method == 'POST':
    # check if the post request has the file part
    if 'file' not in request.files:
      logger.debug('No file part')
      return jsonify({'code': -1, 'filename': '', 'msg': 'No file part'})
    file = request.files['file']
    # if user does not select file, browser also submit a empty part without filename
    if file.filename == '':
      logger.debug('No selected file')
      return jsonify({'code': -1, 'filename': '', 'msg': 'No selected file'})
    else:
      try:
        if file and allowed_file(file.filename):
          origin_file_name = file.filename
          logger.debug('filename is %s' % origin_file_name)
          # filename = secure_filename(file.filename)
          filename = origin_file_name

          if os.path.exists(UPLOAD_PATH):
            logger.debug('%s path exist' % UPLOAD_PATH)
            pass
          else:
            logger.debug('%s path not exist, do make dir' % UPLOAD_PATH)
            os.makedirs(UPLOAD_PATH)

          file.save(os.path.join(UPLOAD_PATH, filename))
          logger.debug('%s save successfully' % filename)
          return jsonify({'code': 0, 'filename': origin_file_name, 'msg': ''})
        else:
          logger.debug('%s not allowed' % file.filename)
          return jsonify({'code': -1, 'filename': '', 'msg': 'File not allowed'})
      except Exception as e:
        logger.debug('upload file exception: %s' % e)
        return jsonify({'code': -1, 'filename': '', 'msg': 'Error occurred'})
  else:
    return jsonify({'code': -1, 'filename': '', 'msg': 'Method not allowed'})

判定文件类型

def allowed_file(filename):
  return '.' in filename and \
      filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS

前台页面代码

<div class="layui-inline">
      <label class="layui-form-label">上传文件</label>
 <div class="layui-input-inline">
   <input type="text" name="attach" id="upload_message" lay-verify="required" autocomplete="off"
   class="layui-input" readonly="readonly">
 </div>
</div>
<div class="layui-inline">
   <img id='img_delete' src="{{ url_for('static', filename='images/delete.png')}}" onclick="do_delete()"
     style="display: none;">
   <button type="button" class="layui-btn" id="upload"><i class="layui-icon"></i>上传文件</button>

</div>

上传按钮初始化及回调

layui.use(['upload', 'layer'], function () {
    var upload = layui.upload;
    var layer = layui.layer;
    upload.render({
      elem: '#upload'
      , url: '/upload'
      , accept: 'file'
      , exts: 'txt'
      , size: 2048
      , done: function (res) {
        console.log(res);
        if (res.code === 0) {
          layer.msg(res.filename + '上传成功');
          $("#upload_message").val(res.filename);
          $("#img_delete").show()
        } else {
          layer.alert('上传失败');
          $("#upload_message").val('上传失败!');
        }
      }
    });
})

当然允许上传,同时也应该允许对以删除文件进行删除

@app.route('/delete', methods=['GET'])
def delete_file():
  if request.method == 'GET':
    filename = request.args.get('filename')
    timestamp = request.args.get('timestamp')
    logger.debug('delete file : %s, timestamp is %s' % (filename, timestamp))
    try:
      fullfile = os.path.join(UPLOAD_PATH, filename)

      if os.path.exists(fullfile):
        os.remove(fullfile)
        logger.debug("%s removed successfully" % fullfile)
        return jsonify({'code': 0, 'msg': ''})
      else:
        return jsonify({'code': -1, 'msg': 'File not exist'})

    except Exception as e:
      logger.debug("delete file error %s" % e)
      return jsonify({'code': -1, 'msg': 'File deleted error'})

  else:
    return jsonify({'code': -1, 'msg': 'Method not allowed'})

删除按钮初始化及回调处理

function do_delete() {
    var filename = $("#upload_message").val();
    layui.use(['upload', 'layer'], function () {
      var layer = layui.layer;
      $.ajax({
        url: '/delete?filename=' + filename + "×tamp=" + new Date().getTime()
        , type: 'GET'
        , success: function (response) {
          console.log(response)
          if (response.code == 0) {
            layer.msg('"' + filename + '"删除成功!');
            $("#upload_message").val('')
            $("img_delete").hide()
          } else {
            layer.msg('"' + filename + '"删除失败!');
          }
        }
      })
    })
  }

实现效果

Flask Web开发入门之文件上传(八)

源码参考:flask-sqlalchemy-web   

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

Python 相关文章推荐
Python新手实现2048小游戏
Mar 31 Python
python使用wmi模块获取windows下的系统信息 监控系统
Oct 27 Python
Python遍历目录并批量更换文件名和目录名的方法
Sep 19 Python
pandas中去除指定字符的实例
May 18 Python
Selenium定时刷新网页的实现代码
Oct 31 Python
python-opencv 将连续图片写成视频格式的方法
Jan 08 Python
Python3.5文件读与写操作经典实例详解
May 01 Python
Python编译成.so文件进行加密后调用的实现
Dec 23 Python
pytorch中tensor张量数据类型的转化方式
Dec 31 Python
Python基于类路径字符串获取静态属性
Mar 12 Python
Opencv图像处理:如何判断图片里某个颜色值占的比例
Jun 03 Python
python 逆向爬虫正确调用 JAR 加密逻辑
Jan 12 Python
python操作excel的方法
Aug 16 #Python
python3调用百度翻译API实现实时翻译
Aug 16 #Python
Python用于学习重要算法的模块pygorithm实例浅析
Aug 16 #Python
Python pygorithm模块用法示例【常见算法测试】
Aug 16 #Python
Python使用pickle模块报错EOFError Ran out of input的解决方法
Aug 16 #Python
Python使用pickle模块储存对象操作示例
Aug 15 #Python
Linux下多个Python版本安装教程
Aug 15 #Python
You might like
浅谈thinkphp的实例化模型
2015/01/04 PHP
Laravel学习教程之request validation的编写
2017/10/25 PHP
javascript jscroll模拟html元素滚动条
2012/12/18 Javascript
zTree插件之多选下拉菜单实例代码
2013/11/06 Javascript
Eclipse配置Javascript开发环境图文教程
2015/01/29 Javascript
javascript Array 数组常用方法
2015/04/05 Javascript
基于JS+Canves实现点击按钮水波纹效果
2016/09/15 Javascript
jQuery Validate插件自定义验证规则的方法
2016/12/27 Javascript
jQuery代码实现实时获取时间
2017/01/29 Javascript
深入理解angular2启动项目步骤
2017/07/15 Javascript
详解jQuery中关于Ajax的几个常用的函数
2017/07/17 jQuery
vue组件学习教程
2017/09/09 Javascript
jQuery操作attr、prop、val()/text()/html()、class属性
2019/05/23 jQuery
vue+element tabs选项卡分页效果
2020/06/29 Javascript
nuxt配置通过指定IP和端口访问的实现
2020/01/08 Javascript
简单了解常用的JavaScript 库
2020/07/16 Javascript
vue 导航菜单刷新状态不消失,显示对应的路由界面操作
2020/08/06 Javascript
微信小程序自定义yPicker组件实现省市区三级联动功能
2020/10/29 Javascript
用Python实现一个简单的多线程TCP服务器的教程
2015/05/05 Python
Python中常见的异常总结
2018/02/20 Python
Pandas实现数据类型转换的一些小技巧汇总
2018/05/07 Python
Django model update的多种用法介绍
2020/03/28 Python
python创建与遍历List二维列表的方法
2019/08/16 Python
Python numpy.zero() 初始化矩阵实例
2019/11/27 Python
Python使用扩展库pywin32实现批量文档打印实例
2020/04/09 Python
英国最大的婴儿监视器网上商店:Baby Monitors Direct
2018/04/24 全球购物
大学生个人实习的自我评价
2014/02/15 职场文书
阳光体育活动方案
2014/02/16 职场文书
成立公司计划书
2014/05/07 职场文书
廉洁校园实施方案
2014/05/25 职场文书
企业法人授权委托书
2014/09/25 职场文书
2014年基层党建工作总结
2014/11/11 职场文书
酒店辞职书范文
2015/02/26 职场文书
出纳岗位职责范本
2015/03/31 职场文书
大学生支教感言
2015/08/01 职场文书
TypeScript 使用 Tuple Union 声明函数重载
2022/04/07 Javascript