Python Tornado批量上傳圖片并顯示功能

發(fā)布時間：2020-08-21 12:52:12 來源：腳本之家閱讀：142 作者：XerCis 欄目：開發(fā)技術(shù)

簡介

Tornado龍卷風(fēng)是一個開源的網(wǎng)絡(luò)服務(wù)器框架，它是基于社交聚合網(wǎng)站FriendFeed的實(shí)時信息服務(wù)開發(fā)而來的。2007年由4名Google前軟件工程師一起創(chuàng)辦了FriendFeed，旨在使用戶能夠方便地跟蹤好友在Facebook和Twitter等多個社交網(wǎng)站上的活動。結(jié)果兩年后，F(xiàn)acebook宣布收購FriendFeed，交易價格約為5000萬美元。而此時FriendFeed只有12名員工。據(jù)說這幫人后來又到了Google，搞出了現(xiàn)在的Google App Engine...

我們開發(fā)這個Web服務(wù)器的主要目的就是為了處理FriendFeed的實(shí)時功能 -- 在FriendFeed的應(yīng)用里每個活動用戶都會保持著一個服務(wù)器連接。

Tornado使FriendFeed使用的可擴(kuò)展的非阻塞Web服務(wù)器及其相關(guān)工具的開源版本，這個Web框架看起來有些像web.py或 Google的webapp，不過為了更加有效地利用非阻塞服務(wù)器環(huán)境，Tornado這個Web框架還包含了一些相關(guān)的有用工具和優(yōu)化。

區(qū)別

Tornado與現(xiàn)代主流的Web服務(wù)器框架有著明顯的區(qū)別：它使非阻塞式的服務(wù)器，速度相當(dāng)快。這得益于其非阻塞的方式和對epoll的運(yùn)用。Tornado每秒可以處理數(shù)以千計(jì)的連接，對于實(shí)時Web服務(wù)來說Tornado確實(shí)是一個理想的Web框架。

與Node.js相同的是，Tornado也采用的是單進(jìn)程單線程異步IO的網(wǎng)絡(luò)模型，它們都可以編寫異步非阻塞的程序。但由于Node.js是Google Chrome V8引擎的JS運(yùn)行環(huán)境或工具包，它屬于偏底層的抽象，擴(kuò)展了JS編寫服務(wù)器程序的能力，所以基于Node.js會由不同的Web框架。從這個角度來看Node.js和Tornado其實(shí)并不在一個層次上。

Tornado是使用Python編寫的Web服務(wù)器兼Web應(yīng)用框架，與主流Web服務(wù)器框架不同的是，Tornado是異步非阻塞式服務(wù)器，得益于非阻塞式和對epoll模型的運(yùn)用，Tornado是實(shí)時Web服務(wù)的一個理想框架，它非常適合開發(fā)長輪詢、WebSocket和需要與每個用戶建立持久連接的應(yīng)用。

特點(diǎn)

輕量級Web框架
異步非阻塞IO處理方式
Tornado采用的單進(jìn)程單線程異步IO的網(wǎng)絡(luò)模式，其高性能源于Tornado基于Linux的Epoll（UNIX為kqueue）的異步網(wǎng)絡(luò)IO。
出色的抗負(fù)載能力
不依賴多進(jìn)程或多線程
WSGI全棧替代產(chǎn)品
WSGI把應(yīng)用（Application）和服務(wù)器（Server）結(jié)合起來，Tornado既可以是WSGI應(yīng)用也可以是WSGI服務(wù)。
既是WebServer也是WebFramework

Tornado是基于Bret Taylor和其他人員為FrientFeed所開發(fā)的網(wǎng)絡(luò)服務(wù)框架，當(dāng)FriendFeed被Facebook收購后得以開源。不同于那些最多只能達(dá)到1w并發(fā)連接的傳統(tǒng)網(wǎng)絡(luò)服務(wù)器。Tornado在設(shè)計(jì)之初就考慮到了性能因素，旨在解決C10K問題，這樣的設(shè)計(jì)使其成為一個擁有高性能的框架。

正文開始

問題描述

Python Tornado批量上傳圖片并顯示，前后端都要顯示

思路

1.文件上傳

前端FormData上傳，后端BytesIO解析

2.顯示圖片

前端FileReader讀取顯示，后端matplotlib顯示

代碼

index.html

<!DOCTYPE html>
<head>
 <title>批量上傳圖片并顯示</title>
 <meta charset='utf-8'>
 <script src='https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js'></script>
</head>

<body>
<input id='send' type='file' accept="image/png, image/jpeg" multiple><br>
</body>
<script>
 $('#send').change(function () {
  var files = $('#send')[0].files;
  var form = new FormData();
  for (var i = 0; i < files.length; i++) {
   //插入form
   var file = files[i];
   console.log(file);
   form.append('files', file);
   //顯示圖片
   var fileReader = new FileReader();
   fileReader.readAsDataURL(file);
   fileReader.onloadend = function (event) {
    var src = event.target.result;
    $('body').append('<img src=' + src + ' width=200px>');
   }
  }

  //上傳
  $.ajax({
   type: 'POST',
   url: '/upload',
   data: form,
   processData: false,
   contentType: false,
   success: function (response) {
    console.log(response)
   }
  });
 })
</script>
</html>

app.py

import tornado.web
import tornado.ioloop
from PIL import Image
from io import BytesIO
import matplotlib.pyplot as plt
from tornado.options import define, options

define("port", default=8888, help="運(yùn)行端口", type=int)

class MainHandler(tornado.web.RequestHandler):
 def get(self):
  self.render("index.html")
class UploadHandler(tornado.web.RequestHandler):
 def post(self):
  files = self.request.files['files']
  for file in files:
   img = file['body']
   img = Image.open(BytesIO(img)).convert('RGB')
   plt.imshow(img)
   plt.show()

if __name__ == "__main__":
 app = tornado.web.Application(
  [
   (r"/", MainHandler),
   (r"/upload", UploadHandler),
  ],
 )
 app.listen(options.port)
 print("http://localhost:{}/".format(options.port))
 tornado.ioloop.IOLoop.current().start()

效果

前端

Python Tornado批量上傳圖片并顯示功能

后端

Python Tornado批量上傳圖片并顯示功能

總結(jié)

到此這篇關(guān)于Python Tornado批量上傳圖片并顯示功能的文章就介紹到這了,更多相關(guān)python tornado批量上傳內(nèi)容請搜索億速云以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持億速云！

向AI問一下細(xì)節(jié)

Python Tornado批量上傳圖片并顯示功能

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽