上传文件这块可以分为两大类, 第一类是通过 form 表单验证进行上传, 还有一类就是通过 Ajax 上传.
- <!DOCTYPE html>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- Title
- </title>
- </head>
- <body>
- <h3>
- form 文件上传
- </h3>
- <form action="/index" method="post" enctype="multipart/form-data">
- <p>
- 请选择上传文件:
- </p>
- <input type="file" name="update_file" />
- <input type="submit" value="上传" />
- </form>
- </body>
- </HTML>
from 表单文件上传 HTML
- <!DOCTYPE HTML>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- Title
- </title>
- </head>
- <body>
- <h3>
- 文件上传, xml 方式提交
- </h3>
- <input type="file" id="img" />
- <input type="button" onclick="UpdateFile();" value="上传">
- <script>
- function UpdateFile() {
- // 获取文件对象
- var fileObj = document.getElementById('img').files[0];
- // 创建 Form 对象
- var forms = new FormData();
- forms.append("update_file", fileObj);
- var xhr = new XMLHttpRequest();
- xhr.open("post", '/index2', true);
- xhr.send(forms);
- }
- </script>
- </body>
- </HTML>
原生 xml 文件上传 HTML
- <!DOCTYPE HTML>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- Title
- </title>
- <script src="/static/jquery-1.7.1.min.js">
- </script>
- </head>
- <body>
- <h3>
- 文件上传, Ajax 方式提交
- </h3>
- <input type="file" id="img" />
- <input type="button" onclick="UpdateFile();" value="上传">
- <script>
- function UpdateFile() {
- // 获取文件对象
- var fileObj = document.getElementById('img').files[0];
- // 创建 Form 对象
- var forms = new FormData();
- forms.append("update_file", fileObj);
- $.Ajax({
- type: 'POST',
- url: '/index3',
- data: forms,
- processData: false,
- contentType: false,
- success: function(arg) {
- console.log(arg);
- }
- })
- }
- </script>
- </body>
- </HTML>
jQuery 文件上传 HTML
- <!DOCTYPE HTML>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- Title
- </title>
- <script src="/static/jquery-1.7.1.min.js">
- </script>
- <style>
- .hide{ display: none; }
- </style>
- </head>
- <body>
- <h3>
- 文件上传, iframe 方式
- </h3>
- <form id="my_form" name="form" action="/index4" method="POST" enctype="multipart/form-data">
- <div>
- <input name="update_file" id="my_file" type="file" />
- <input type="button" name="action" value="Update" onclick="redirect();"
- />
- <iframe id="my_iframe" name="my_iframe" src="" class="hide">
- </iframe>
- </div>
- </form>
- <script>
- function redirect() {
- document.getElementById('my_iframe').onload = Testt;
- document.getElementById('my_form').target = 'my_iframe';
- document.getElementById('my_form').submit();
- }
- function Testt(ths) {
- var t = $("#my_iframe").contents().find("body").text();
- console.log(t);
- }
- </script>
- </body>
- </HTML>
iframe 文件上传 HTML
- #!/usr/bin/env python
- # -*- coding: utf-8 -*-
- import tornado.ioloop
- import tornado.web
- class IndexHandler(tornado.Web.RequestHandler):
- def get(self):
- self.render('index.html')
- def post(self, *args, **kwargs):
- file_metas = self.request.files["update_file"] #获取文件信息
- for meta in file_metas:
- file_name = meta['filename'] #获取它的文件名
- import os
- with open(os.path.join("static", "img", file_name), 'wb') as up: #打开本地一个文件
- up.write(meta['body']) #body 就是文件内容, 把它写到本地
- class Index2Handler(tornado.Web.RequestHandler):
- def get(self):
- self.render('index2.html')
- def post(self, *args, **kwargs):
- file_metas = self.request.files["update_file"] #获取文件信息
- for meta in file_metas:
- file_name = meta['filename'] #获取它的文件名
- import os
- with open(os.path.join("static", "img", file_name), 'wb') as up: #打开本地一个文件
- up.write(meta['body']) #body 就是文件内容, 把它写到本地
- class Index3Handler(tornado.Web.RequestHandler):
- def get(self):
- self.render('index3.html')
- def post(self, *args, **kwargs):
- file_metas = self.request.files["update_file"] #获取文件信息
- for meta in file_metas:
- file_name = meta['filename'] #获取它的文件名
- import os
- with open(os.path.join("static", "img", file_name), 'wb') as up: #打开本地一个文件
- up.write(meta['body']) #body 就是文件内容, 把它写到本地
- class Index4Handler(tornado.Web.RequestHandler):
- def get(self):
- self.render('index4.html')
- def post(self, *args, **kwargs):
- file_metas = self.request.files["update_file"] #获取文件信息
- for meta in file_metas:
- file_name = meta['filename'] #获取它的文件名
- import os
- with open(os.path.join("static", "img", file_name), 'wb') as up: #打开本地一个文件
- up.write(meta['body']) #body 就是文件内容, 把它写到本地
- settings = {
- 'template_path': 'views', #视图模板路径
- 'static_path': 'static', #静态文件路径
- }
- #路由映射, 路由系统
- def make_app():
- return tornado.Web.Application([
- (r"/index", IndexHandler),
- (r"/index2", Index2Handler),
- (r"/index3", Index3Handler),
- (r"/index4", Index4Handler),
- ], **settings)
- if __name__ == "__main__":
- App = make_app()
- App.listen(8888)
- tornado.ioloop.IOLoop.current().start()
App.py
来源: http://www.bubuko.com/infodetail-3345474.html