1直接form提交给后台处理

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>form-upload</title>

 </head>

 <body>
　　注意form的enctype类型"multipart/form-data"
 <form action="/form_upload" method="post" enctype="multipart/form-data">  <input type="file" name="file"/>  <input type="submit", value="上传"/>  </form>  </body>  </html>

后台post方法统一处理代码如下：
class FormRequest_handle(tornado.web.RequestHandler):

    def get(self, *args, **kwargs):

        self.render('iframe_upload.html', status='')

    def post(self, *args, **kwargs):

        print('post')

        file_data = self.request.files['file']#读出了的文件是数组里面的是字典形式[{'filename':'xxx','body':'xxxxxxxxxxxxx'}]

        for meta in file_data:

            filename = meta['filename']

            print(filename, file_data)

            with open(os.path.join('static', filename), 'wb') as up:

                up.write(meta['body'])

        self.write('upload success')

settings = {

    'template_path':'views',

    'static_path':'static',

    # 'xsrf_cookies':True,此处测试csrf跨站伪造请求攻击请忽略

}

if __name__ == '__main__':

    application = tornado.web.Application([

        # (r'/index', Indexhandle),

        # (r'/manager', Managerdhandle),

        # (r'/csrf', Csrf_handle),

        # (r'/xml', XmlHttpRequest_handle),

        (r'/iframe',FormRequest_handle),

    ], **settings)

    application.listen(8089)

    tornado.ioloop.IOLoop.instance().start()

　　2.伪ajax(iframe) 此方法发送请求不刷新页面，利用iframe 的局部刷新特性，对浏览器兼容性更好

 <body>

 <form id="myform" action="/iframe" method="post" enctype="multipart/form-data">

     <input type="file" name="file"/>

     <input type="button" value="上传" onclick="redirect()"/>

     <iframe id="myiframe" name="my_iframe"></iframe>

 </form>

 <script src="{{static_url('jquery-3.2.1.js')}}"></script>

 <script>

     function redirect() {

 //        document.getElementById('myiframe').onload = test;#执行完iframe立即执行test函数

         $('#myiframe').onload = test;

         document.getElementById('myform').target = 'my_iframe';//此处等于IDmyframe会有不同

         document.getElementById('myform').submit();

 //        $('#myform').submit();

     }

    function test() {

         var t = $('#myiframe').contents().find('body').text();

         console.log(t)

    }

 </script>

 </body>

tornado之文件上传的几种形式form,伪ajax(iframe)的更多相关文章

  1. curl文件上传有两种方式，一种是post_fileds，一种是infile

    curl文件上传有两种方式,一种是POSTFIELDS,一种是INFILE,POSTFIELDS传递@实际地址,INFILE传递文件流句柄! );curl_setopt($ch, CURLOPT_PO ...

  2. 让nginx支持文件上传的几种模式

    文件上传的几种不同语言和不同方法的总结. 第一种模式 : PHP 语言来处理 这个模式比较简单, 用的人也是最多的, 类似的还有用 .net 来实现, jsp来实现, 都是处理表单.只有语言的差别, ...

  3. 文件上传的三种模式-Java

    文件上传的三种方式-Java 前言:因自己负责的项目(jetty内嵌启动的SpringMvc)中需要实现文件上传,而自己对java文件上传这一块未接触过,且对 Http 协议较模糊,故这次采用渐进的方 ...

  4. 第二百七十三节，Tornado框架-文件上传

    Tornado框架-文件上传 第一.普通表单上传文件 self.request.files["fafafa"] 获取上传文件信息,参数["上传文件框的name名称&quo ...

  5. 基于tornado的文件上传demo

    这里,web框架是tornado的4.0版本,文件上传组件,是用的bootstrap-fileinput. 这个小demo,是给合作伙伴提供的,模拟APP上摄像头拍照,上传给后台服务进行图像识别用,识 ...

  6. ASP.NET文件上传的三种基本方法

    ASP.NET依托.net framework类库,封装了大量的功能,使得上传文件非常简单,主要有以下三种基本方法. 方法一:用Web控件FileUpload,上传到网站根目录. <form i ...

  7. web 文件上传的几种方式

    问题 文件上传在WEB开发中应用很广泛. 文件上传是指将本地图片.视频.音频等文件上传到服务器上,可以供其他用户浏览或下载的过程. 以下总结了常见的文件(图片)上传的方式和要点处理. 表单上传 这是传 ...

  8. 利用Selenium实现图片文件上传的两种方式介绍

    在实现UI自动化测试过程中,有一类需求是实现图片上传,这种需求根据开发的实现方式,UI的实现方式也会不同. 一.直接利用Selenium实现 这种方式是最简单的一种实现方式,但是依赖于开发的实现. 当 ...

  9. Java文件上传的几种方式

    文件上传与文件上传一样重要.在Java中,要实现文件上传,可以有两种方式: 1.通过Servlet类上传 2.通过Struts框架实现上传 这两种方式的根本还是通过Servlet进行IO流的操作. 一 ...

随机推荐

  1. React翻译官网文档之JSX

    什么是JSX? 看下面的代码它被称为JSX,它既不是字符串也不是HTML,而是一种facebook公司对javascript语法的拓展.虽然写法很奇怪最终仍会会被编译为javascript代码 con ...

  2. Filter execution threw an exception 错误

    Filter execution threw an exception 错误,我在web.xml中配置了一个filter用spring来解决懒加载的问题,为什么就会包这个错 java.lang.NoS ...

  3. 使用Dubbox构架分布式服务

    第一部分:Dubbo的背景分析及工作原理 1. Dubbo是什么?Dubbo是一个来自阿里巴巴的开源分布式服务框架,致力于提供高性能和透明化的RPC远程服务调用方案,以及SOA服务治理方案. 简单的说 ...

  4. 【转】JDBC学习笔记(1)——JDBC概述

    转自:http://www.cnblogs.com/ysw-go/ JDBC JDBC API是一个Java API,可以访问任何类型表列数据,特别是存储在关系数据库中的数据.JDBC代表Java数据 ...

  5. 战斗逻辑 - demo

    创建战斗依赖的数据结构 /** * 角色属性 */ var a_data = { _id: 101, attr: { // 角色战斗属性 }, skill: [],// 技能数组 isAtk: fal ...

  6. Linux 练习（1）

    1) 新建用户natasha,uid为1000,gid为555,备注信息为"master" useradd -u 1000 -g 555 -c 'master' natasha2) ...

  7. H5前端框架推荐合集

    Ionic ionic 吧开发流程都帮你做好了,已经不再是单纯的UI框架,而是开发框架了,非常适合快速开发.基于angular2,丰富的UI组件,大大改进的编程模型, Semantic UI 中文官网 ...

  8. AspNetCore-MVC实战系列（三）之个人中心

    AspNetCore - MVC实战系列目录 . 爱留图网站诞生 . git源码:https://github.com/shenniubuxing3/LovePicture.Web . AspNetC ...

  9. 在Mvc中进行异步请求是出现（没有为该对象定义无参数的构造函数）

    解决办法就是给相应的类添加无参数的构造函数:

  10. vue.js2.0 自定义组件初体验

    理解 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能.在有些情况 ...