【学习笔记】flask将服务器端的图片资源，暴露给外网访问

烟花节

已于 2024-08-01 18:59:59 修改

阅读量373

点赞数 7

分类专栏：学习笔记文章标签：学习笔记 flask python

于 2024-08-01 18:54:16 首次发布

本文链接：https://blog.csdn.net/2202_75832991/article/details/140854648

版权

学习笔记专栏收录该内容

5 篇文章 0 订阅

订阅专栏

需求

服务器通过模型生成的模型我放在了一个文件夹里面。希望前端能访问这些图片，并展示给用户

解决方案

我是用flask制作的后端

from flask import Flask,jsonify,send_from_directory
app = Flask(__name__)
#用来解决跨域问题的，今天的主体不是这个就不详细说了
from flask_cors import CORS
CORS(app)

#存放图片的文件夹的路径
IMAGE_FOLDER = r'C:\Users\ASUS\Desktop\save_img'
@app.route('/image/<filename>')
def serve_image(filename):
    # 检查文件是否存在以及是否是安全的文件名（防止路径遍历攻击）
    file_path = os.path.join(IMAGE_FOLDER, filename)
    if '..' in filename or not os.path.isfile(file_path):
        return "Error: File not found or invalid filename", 404
    # 返回图片文件
    return send_from_directory(IMAGE_FOLDER, filename)

if __name__ == '__main__':
    app.run(debug=True)

这就是我后端实现图片传输功能的主要代码。

在本机可以使用

http://localhost:5000/image/<filename>

来获取图片，其中 <filename> 是你想要访问的图片文件名。比如，你的图片名称为img.jpg ，那么你在浏览器里面输入这个url，就会打开你的目标图片

http://localhost:5000/image/img.jpg

实际使用过程中，还得做一个内网穿透，才能实现在不一样的网络环境访问本机的图片

做好内网穿透，把localhost:5000换成你自己的域名和端口就行了

这里附一段前端代码用以思考（PS：我这里的域名是假的，举例子用，你们就不用去试着访问我这个了）

<view class="imgcontainer">
			<image v-for="index in 5" :key="index" :src="`http://1008611.gnway.cc:8000/image/img${index}.png`"
				class="image-item" mode="aspectFit" />
		</view>

这段代码的作用是从后端获取五张文件名为img（1-5）.png的图片，展示在页面上