python tornado 图片base64、流的两种方式上传到前端界面。

最新推荐文章于 2024-05-14 14:11:15 发布

后青春诗ing

最新推荐文章于 2024-05-14 14:11:15 发布

阅读量4.7k

点赞数 3

分类专栏： python tornado

本文链接：https://blog.csdn.net/weixin_42812527/article/details/86530467

版权

python 同时被 2 个专栏收录

37 篇文章 2 订阅

订阅专栏

tornado

2 篇文章 0 订阅

订阅专栏

写这篇文章是因为涉及到大量的图片上传，两种不通的方式和其效果，代码如下：

base64上传前端显示图片

代码结构如下：
在这里插入图片描述
只是简单的测试莫嫌弃代码low。
前端界面代码base64.html 的展示

<!DOCTYPE html>
<html>
<head><title>index</title></head>
<body>
{% for each_img in total_img%}
<img src="https://img-blog.csdnimg.cn/2022010615445631668.jpg">
{% end %}
</body>
</html>

后端逻辑代码work.py的展示

import os
import base64
import tornado.web
import tornado.ioloop
from tornado.web import RequestHandler
from tornado.options import define, options, parse_command_line

define('port', default=9951, type=int, )


def base64_img():
    """
    获取所有的文件的base64,以列表的形式返回
    :return:
    """
    img_base64 = []
    source_path = r'D:\dir'
    img_name_list = os.listdir(source_path)
    for each_img in img_name_list:
        each_img_name = os.path.join(source_path, each_img)
        with open(each_img_name, 'rb') as f:
            base64_data = base64.b64encode(f.read())
            img_base64.append(base64_data)
    return img_base64


class Base64Handler(RequestHandler):
    def get(self):
        total_img = base64_img()
        self.render("base64.html", total_img=total_img)


if __name__ == '__main__':
    parse_command_line()
    app = tornado.web.Application(
        [(r"/base64", Base64Handler), ],
        debug=True,
        default_host="0.0.0.0",
        template_path=os.path.join(os.path.dirname(__file__), "templates")
    )
    app.listen(options.port)
    tornado.ioloop.IOLoop.instance().start()

很简单的上传方式，但是在实际开发中，大量的图片是不可采取这类方法的，因为前端源码中占的资源太多了，毕竟base64的方式，看源码如下：
在这里插入图片描述
这还仅仅是一张图片的路径，可想而知在实际开发中，加载就费不少时间。不可采取。

流的方式上传图片

前端界面代码show.html 的展示

<!DOCTYPE html>
<html>
<head><title>index</title></head>
<body>
{% for each_img in total_img%}
<img src="./pic?id={{ each_img }}">
{% end %}
</body>
</html>

后端逻辑代码work.py的展示

import os
import base64
import tornado.web
import tornado.ioloop
from tornado.web import RequestHandler
from tornado.options import define, options, parse_command_line

define('port', default=9951, type=int, )


def img_list():
    """
    获取所有的文件名，以列表的形式返回。
    :return:
    """
    source_path = r'D:\dir'
    img_name_list = os.listdir(source_path)
    return img_name_list


class PictureHandler(RequestHandler):
    def get(self):
        source_path = r'D:\dir'
        id = self.get_argument('id')
        if id.endswith('.jpg'):
            pic = open(source_path + r'\\' + id, 'rb')
            pics = pic.read()
            self.write(pics)
            self.set_header("Content-type", "image/png")


class GetPictureHandler(RequestHandler):
    def get(self):
        total_img = img_list()
        self.render("show.html", total_img=total_img)


if __name__ == '__main__':
    parse_command_line()
    app = tornado.web.Application(
        [
            (r"/pic", PictureHandler),
            (r"/getPic", GetPictureHandler),
        ],
        debug=True,
        default_host="0.0.0.0",
        template_path=os.path.join(os.path.dirname(__file__), "templates")
    )
    app.listen(options.port)
    tornado.ioloop.IOLoop.instance().start()

以流的方式上传还是很快的毕竟前端源码只加载了路径而已，看源码如下图：
在这里插入图片描述
两种方法的效果展示

以上只是简单的使用介绍，实际开发中代码可能复杂的多，以上仅仅是提供思路而已。

后青春诗ing

关注

3
点赞
踩
8

收藏

觉得还不错? 一键收藏
1
评论
python tornado 图片base64、流的两种方式上传到前端界面。

写这篇文章是因为涉及到大量的图片上传，两种不通的方式和其效果，我们知道简单的图片上传我们可以借助于，tornado自带的模板来上传，今天暂时不用模板来上传，代码如下：base64上传前端显示图片代码结构如下：只是简单的测试莫嫌弃代码low。前端界面代码base64.html 的展示&amp;amp;lt;!DOCTYPE html&amp;amp;gt;&amp;amp;lt;html&amp;amp;gt;&amp;amp;lt;he
复制链接

扫一扫