python 实现Flask中返回图片流给前端展示
更新时间：2020年01月09日 10:36:31 作者：DHogan
今天小编就为大家分享一篇python 实现Flask中返回图片流给前端展示，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
场景需求：需要在Flask服务器的本地找一张图片返回给前端展示出来。
问题疑点：通常前端的<img>标签只会接受url的形式来展示图片，没试过在返回服务器本地的一张图片给前端。
因此写个记录一下这个看起来有点奇葩的场景（通常个人博客，个人网站没有钱用第三方的服务都会采用存储在服务器本地的方法啦。）
项目目录：
dyy_project
|
|----static (新建flask项目时自动建的，没有任何文件)
|----templates
|-----index.html (前端页面)
|----dyy_project.py (flask项目启动文件)
文件内容：dyy_project.py
#!/usr/bin/env python
# coding=utf-8
from flask import Flask
from flask import render_template
app = Flask(__name__)
"""
这是一个展示Flask如何读取服务器本地图片, 并返回图片流给前端显示的例子
"""
def return_img_stream(img_local_path):
"""
工具函数:
获取本地图片流
:param img_local_path:文件单张图片的本地绝对路径
:return: 图片流
"""
import base64
img_stream = ''
with open(img_local_path, 'r') as img_f:
img_stream = img_f.read()
img_stream = base64.b64encode(img_stream)
return img_stream
@app.route('/')
def hello_world():
img_path = '/home/hogan/Googlelogo.png'
img_stream = return_img_stream(img_path)
return render_template('index.html',
img_stream=img_stream)
if __name__ == '__main__':
app.run(debug=True, port=8080)
文件内容：index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flask Show Image</title>
</head>
<body>
<img style="width:180px" src="data:;base64,{{ img_stream }}">
</body>
</html>
注意：在img标签中的src一定要按照 data:;base64,{{img_stream}} 的形式添加，否则显示不出图片。
然后启动你的Flask程序，访问http://127.0.0.1:8080 你就可以看到你的图片了。
以上这篇python 实现Flask中返回图片流给前端展示就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要为大家介绍了GCN图卷积神经网络原理及代码解析，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-05-05
这篇文章主要为大家详细介绍了如何在Python中引入其他文件夹里的.py文件,并探讨几种常见的实现方式,有需要的小伙伴可以根据需求进行选择2025-03-03
今天的这篇文章呢，小编来介绍一下如何通过Python来创建各种形式的文件，这里包括了：文本文件、CSV文件、Excel文件、压缩文件、XML文件、JSON文件和PDF文件，需要的可以参考一下2023-01-01
水仙花数也被称为超完全数字不变数、自恋数、自幂数、阿姆斯壮数或阿姆斯特朗数，水仙花数是指一个3位数，本文就给大家简单聊聊如何使用Python找出水仙花数，感兴趣的同学可以参考阅读2023-07-07
这篇文章主要介绍了详解python之简单主机批量管理工具，具有一定的参考价值，有兴趣的可以了解一下。2017-01-01
这篇文章主要介绍了如何升级python包到指定版本问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
python pytest进阶之xunit fixture详解
这篇文章主要介绍了python pytest进阶之xunit fixture详解,了解unittest的同学应该知道我们在初始化环境和销毁工作时，unittest使用的是setUp，tearDown方法，那么在pytest框架中同样存在类似的方法，今天我们就来具体说明,需要的朋友可以参考下2019-06-06
这篇文章主要介绍了Python接口测试环境搭建过程详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-06-06
本文主要介绍了python实现矩阵的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
后唐李煜曾说道，樱花落尽春将困，秋千架下归时。漏暗斜月迟迟，花在枝。樱花落尽的时候春天也将过去了，秋千架下归去时。天上的斜月姗姗来迟，花还在枝头。本文将用Python+Turtle绘制一颗樱花树，感兴趣的可以尝试一下2022-04-04
最新评论