当前位置： 首页 > news >正文

2023.11.17使用flask将多个图片文件上传至服务器

news 2026/5/24 20:50:24

2023.11.17使用flask将多个图片文件上传至服务器

实现功能：
1、同时上传多个图片文件
2、验证文件扩展名
3、显示上传文件的文件名
4、显示文件上传结果
在这里插入图片描述
程序结构
在这里插入图片描述
main.py

from flask import Flask, request, jsonify, render_template
import osapp = Flask(__name__)# 设置上传文件存储目录
UPLOAD_FOLDER = 'uploads'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER# 允许上传的文件类型
ALLOWED_EXTENSIONS = {'png', 'jpg', 'jpeg', 'gif'}@app.route('/')
def index():return render_template('index.html')# 检查文件名是否合法
def allowed_file(filename):return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS# 处理文件上传
@app.route('/upload', methods=['POST'])
def upload_file():files = request.files.getlist("file")success_files = []failed_files = []for file in files:if file and allowed_file(file.filename):filename = file.filenamefile.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))success_files.append(filename)else:failed_files.append(file.filename)if failed_files:return jsonify({'message': '部分文件上传失败', 'failed_files': failed_files})else:return jsonify({'message': '所有文件上传成功', 'success_files': success_files})if __name__ == '__main__':app.run(debug=True)

index.html

<!DOCTYPE html>
<html>
<head><title>文件上传</title><link href="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/css/bootstrap.min.css" rel="stylesheet"><script src="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/js/bootstrap.bundle.min.js"></script>
</head>
<body><div class="container"><h1 class="mt-5 mb-4">文件上传</h1><form id="upload-form" action="/upload" method="post" enctype="multipart/form-data"><div class="custom-file mb-3"><input type="file" class="custom-file-input" id="fileInput" name="file" multiple><label class="custom-file-label" for="fileInput">选择文件</label></div><button type="submit" class="btn btn-primary">上传</button></form><div id="result" class="mt-3"></div></div><script>document.getElementById('upload-form').addEventListener('submit', function(e) {e.preventDefault();var formData = new FormData(this);fetch('/upload', {method: 'POST',body: formData}).then(response => response.json()).then(data => {if (data.failed_files) {document.getElementById('result').innerHTML = '<div class="alert alert-danger" role="alert">部分文件上传失败: ' + data.failed_files.join(', ') + '</div>';} else {document.getElementById('result').innerHTML = '<div class="alert alert-success" role="alert">' + data.message + '</div>';}}).catch(error => {console.error(error);});});// 更新文件选择框显示已选择的文件名document.getElementById('fileInput').addEventListener('change', function () {var files = this.files;var label = "";for (var i = 0; i < files.length; i++) {label += files[i].name + ', ';}// /，$/ 表示匹配以逗号结尾的部分。即将最后一个逗号清除label = label.replace(/, $/, "");this.nextElementSibling.innerText = label;});</script>
</body>
</html>

相关文章：

2023.11.17使用flask将多个图片文件上传至服务器

2023.11.17使用flask将多个图片文件上传至服务器 实现功能&#xff1a; 1、同时上传多个图片文件 2、验证文件扩展名 3、显示上传文件的文件名 4、显示文件上传结果 程序结构 main.py from flask import Flask, request, jsonify, render_template import osapp Flask(__n…...

编程日记 2023/11/20 5:49:06

母婴服务预约小程序的效果如何

二胎家庭增速明显&#xff0c;占比较大&#xff0c;成为市场各母婴品牌的目标&#xff0c;而随着行业发展及市场变化&#xff0c;线上互联网深入人们生活&#xff0c;各家母婴品牌开始向“数字化”靠拢。 目前母婴门店商家主要面临服务/产品线上曝光不足、宣传度不够或扩圈无门…...

编程日记 2023/11/20 5:48:06

Flask实现cookie 开发

要在Flask中实现cookie的开发&#xff0c;可以通过使用Flask提供的set_cookie()和get_cookie()函数来设置和获取cookie值。以下是一个示例&#xff0c;演示如何在Flask应用中使用cookie&#xff1a; from flask import Flask, request, make_responseapp Flask(__name__)app.…...

编程日记 2023/11/20 5:47:05

2311rust,到60版本更新

1.54.0稳定版 属性可调用类似函数的宏 Rust1.54支持在属性中调用类似函数的宏.类似函数的宏是像基于macro_rules!宏一样调用的或像macro!(...)一样的过程宏. 注意,常见用例是,在Rust文档注解中包含其他文件中的文档.如,如果项目的README代表了一个很好的文档注释,则可用incl…...

编程日记 2023/11/20 5:46:04

【开源】基于Vue和SpringBoot的微信小程序的音乐平台

项目编号&#xff1a; S 055 &#xff0c;文末获取源码。 \color{red}{项目编号&#xff1a;S055&#xff0c;文末获取源码。} 项目编号&#xff1a;S055&#xff0c;文末获取源码。 目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块三、系统展示 四、核心代码4.1 查询单首…...

编程日记 2023/11/20 5:45:03

adb手机调试常用命令

查看手机型号 adb shell getprop ro.product.model 查看电池状况 adb shell dumpsys battery 查看分辨率 adb shell wm size 查看屏幕密度 adb shell wm density 查看显示屏参数 adb shell dumpsys window displays 查看android_id adb shell settings get secure android…...

编程日记 2023/11/20 5:44:02

IDEA常用插件合集

功能类&#xff1a; 1、Background Image Plus 换壁纸 2、Chinese(Simplified)... 中文语言包 3、Translation 代码翻译 4、Key Promoter X 快捷键提示插件 5、Rainbow bracket 彩虹括号插件 6、Code Glance 代码小地图 效率类 &#xff1a; 1、Tabnine AI Code C…...

编程日记 2023/11/20 5:43:01

【算法】滑动窗口题单——2.不定长滑动窗口（求最长/最大）

文章目录 3. 无重复字符的最长子串1493. 删掉一个元素以后全为 1 的最长子数组904. 水果成篮1695. 删除子数组的最大得分2841. 几乎唯一子数组的最大和2024. 考试的最大困扰度1004. 最大连续1的个数 III1438. 绝对差不超过限制的最长连续子数组2401. 最长优雅子数组解法1——维…...

编程日记 2023/11/20 5:42:00

电子学会C/C++编程等级考试2022年03月（一级）真题解析

C/C++等级考试（1~8级）全部真题・点这里 第1题：双精度浮点数的输入输出 输入一个双精度浮点数，保留8位小数，输出这个浮点数。 时间限制：1000 内存限制：65536输入 只有一行，一个双精度浮点数。输出 一行，保留8位小数的浮点数。样例输入 3.1415926535798932样例输出 3.1…...

编程日记 2023/11/20 5:40:59

Libvirt-Qemu-Kvm 操作手记

(持续更新~) 本文主要用于记录在操作libvirt qemu kvm过程中遇到的问题及原因分析。 Hugepage 让qemu使用大页可以减少tdp的size&#xff0c;一定程度上可以提高性能&#xff1b;使用大页可以用memfd或者file backend。 memfd 操作步骤如下&#xff1a; 在系统中reserv…...

编程日记 2023/11/20 5:38:57

代码随想录算法训练营第二十八天| 78 子集 90 子集|| 93 复原IP地址

78 子集 由题意可知数组中的元素互不相同&#xff0c;所以在dfs中我们可以将当前的path直接加入到res中。 class Solution {List<List<Integer>>res new ArrayList<>();List<Integer>path new LinkedList<>();public List<List<Integer…...

编程日记 2023/11/20 5:37:56

9 HDFS架构剖析

问题 100台服务器&#xff0c;存储空间单个200GB 20T 5T文件如何存储&#xff1f; 128MB一块 128MB81GB 1288*10241TB 5T数据分成的128MB的块数 8192 * 5 客户端(client)代表用户通过与namenode和datanode交互来访问整个文件系统。 HDFS集群有两类节点&#xff1a; 一个na…...

编程日记 2023/11/20 5:36:55

Python中的迭代器、生成器和装饰器

当谈到Python中的迭代器、生成器和装饰器时&#xff0c;这三个概念都是与函数和数据处理密切相关的。让我们逐个深入了解它们。 1. 迭代器&#xff08;Iterators&#xff09;&#xff1a; 迭代器是一个可以逐个访问元素的对象。在Python中&#xff0c;迭代器实现了两个方法&a…...

编程日记 2023/11/20 5:35:54

【NGINX--1】基础知识

1、在 Debian/Ubuntu 上安装 NGINX 在 Debian 或 Ubuntu 机器上安装 NGINX 开源版。 更新已配置源的软件包信息&#xff0c;并安装一些有助于配置官方 NGINX 软件包仓库的软件包&#xff1a; apt-get update apt install -y curl gnupg2 ca-certificates lsb-release debian-…...

编程日记 2023/11/20 5:34:54

小米路由器AX1800降级后的SSH登录和关墙等命令

​​​​​​​​​​​​​​​​​​​​​http://192.168.31.1/cgi-bin/luci/;stok429aaa9c7f05ee7d0816a00257b8414a/api/misystem/set_config_iotdev?bssidXiaomi&user_idlongdike&ssid-h%3B%20nvram%20set%20ssh_en%3D1%3B%20nvram%20commit%3B%20sed%20-i%20s%…...

编程日记 2023/11/20 5:33:53

5-什么是猴子补丁，有什么用途？什么是反射，python中如何使用反射？http和https的区别？

1 什么是猴子补丁&#xff0c;有什么用途 **解释**1 Python猴子补丁&#xff08;Monkey Patch&#xff09;是一种在运行时动态修改代码的技术。通在不修改源代码的情况下&#xff0c;改变代码的执行方式或增加功能2 Monkey Patching是在 运行时(run time) 动态替换属性(attrib…...

编程日记 2023/11/20 5:32:52

深信服AC应用控制技术

拓扑图 目录 拓扑图 一.上班时间不允许使用qq(假设上班时间是上午9到12&#xff0c;下午14到18) 1.新增上班时间不允许使用qq访问权限策略 2.将策略应用到组&#xff0c;例如修仙部 3.验证 上班时间发现登录不了 下班时间可以登录 二.上班时间不允许访问视频网站(假设上班时…...

编程日记 2023/11/20 5:31:50

全新云开发工具箱：融合多项功能的微信小程序源码解决方案

全新云开发工具箱&#xff1a;融合多项功能的微信小程序源码解决方案 这款微信小程序源码提供了超过40个功能&#xff0c;集合了各种实用工具&#xff0c;成为一款全能工具箱。这些功能包括证件照制作、垃圾分类查询、个性签名制作、二维码生成、文字九宫格、手持弹幕、照片压…...

编程日记 2023/11/20 5:30:49

Android跨进程通信，IPC，RPC，Binder系统，C语言应用层调用

文章目录 Android跨进程通信&#xff0c;IPC&#xff0c;RPC&#xff0c;Binder系统&#xff0c;C语言应用层调用&#xff08;&#xff09;1.概念2.流程3.bctest.c3.1 注册服务&#xff0c;打开binder驱动3.2 获取服务 4.binder_call Android跨进程通信&#xff0c;IPC&#xf…...

编程日记 2023/11/20 5:29:48

数据结构【DS】栈

共享栈 共享栈的目的是什么&#xff1f; 目的:有效利用存储空间。 共享栈的存取数据时间复杂度为&#xff1f; 存取数据时间复杂度为O(1) 共享栈如何判空&#xff1f;如何判满&#xff1f; 两个栈的栈顶指针都指向栈顶元素&#xff0c;&#x1d461;&#x1d45c;&#x1d45d;…...

编程日记 2023/11/20 5:28:45

【DeepSeek数据隐私保护终极指南】：20年安全专家亲授5大合规落地实践与3大避坑红线

更多请点击&#xff1a; https://codechina.net 第一章&#xff1a;DeepSeek数据隐私保护的核心理念与演进脉络 DeepSeek自诞生以来&#xff0c;将“数据主权归用户、模型能力不以隐私让渡为前提”确立为不可妥协的底层信条。其隐私保护理念并非静态规范&#xff0c;而是随技术…...

编程新知 2026/5/24 20:33:49

为Hermes Agent自定义Provider并接入Taotoken服务

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 为Hermes Agent自定义Provider并接入Taotoken服务 Hermes Agent 是一个流行的智能体开发框架&#xff0c;它支持通过配置不同的模型…...

编程新知 2026/5/24 20:31:40

飞算JavaAI：Java专属AI助手，是“工程提效”还是“新坑”？

先说结论 飞算JavaAI最大的价值是“完整工程生成”&#xff0c;而不是片段补全&#xff0c;适合从零搭建CRUD项目 自定义开发规范功能很实用&#xff0c;但需要投入前期规则编写成本 SQL Chat等附加功能对日常运维有帮助&#xff0c;但智能引导对复杂业务场景可能不够灵活 作…...

编程新知 2026/5/24 20:27:39

深入解析中兴光猫工厂模式：解锁隐藏网络管理权限的技术探索

深入解析中兴光猫工厂模式&#xff1a;解锁隐藏网络管理权限的技术探索 【免费下载链接】zteOnu A tool that can open ZTE onu device factory mode 项目地址: https://gitcode.com/gh_mirrors/zt/zteOnu 在当今的网络设备管理中&#xff0c;中兴光猫作为广泛部署的终端…...

编程新知 2026/5/24 20:17:16

3大止损策略拯救你的交易：backtrader实战指南

3大止损策略拯救你的交易&#xff1a;backtrader实战指南 【免费下载链接】backtrader Python Backtesting library for trading strategies 项目地址: https://gitcode.com/gh_mirrors/ba/backtrader 作为一名量化交易者&#xff0c;你是否经常面临这样的困境&#xff…...

编程新知 2026/5/24 19:08:11

终极鸣潮优化指南：3分钟解锁120FPS与专业抽卡分析

终极鸣潮优化指南&#xff1a;3分钟解锁120FPS与专业抽卡分析 【免费下载链接】WaveTools &#x1f9f0;鸣潮工具箱 项目地址: https://gitcode.com/gh_mirrors/wa/WaveTools 你是否还在为《鸣潮》的60FPS帧率限制而烦恼&#xff1f;是否想科学分析自己的抽卡概率&#…...

编程新知 2026/5/24 18:30:26

港中文+深大：你吃的其实是假螃蟹！？

背景 贝类过敏是重大健康风险，影响全球约2%的人群。受交叉反应影响，开展跨物种的全面致敏蛋白谱分析对优化诊断与治疗至关重要。本研究旨在鉴定并比较６种广泛食用蟹类的致敏蛋白谱。 kahouchu@cuhk.edu.hk xiaojun1985918@szu.edu.cn christineyywai@cuhk.edu.hk #过敏…...

编程新知 2026/5/24 18:02:42

使用正则表达式str.split(“\\W+“)拆分句子

正则表达式 String sentence "The quick brown fox... jumps over the lazy dog?"; String[] words sentence.split("\\W"); // \\W怎么理解&#xff1f;/*打印words会输出&#xff1a; The quick brown fox jumps over the lazy dog */在 Java 中&am…...

编程新知 2026/5/24 18:02:36

3步搞定Mac Boot Camp驱动自动化部署：Brigadier完全指南

3步搞定Mac Boot Camp驱动自动化部署&#xff1a;Brigadier完全指南 【免费下载链接】brigadier Fetch and install Boot Camp ESDs with ease. 项目地址: https://gitcode.com/gh_mirrors/bri/brigadier 还在为Mac电脑安装Windows系统后的驱动问题头疼吗&#xff1f;Br…...

编程新知 2026/5/24 17:28:58

GitHub中文界面终极汉化指南：5分钟告别英文困扰

GitHub中文界面终极汉化指南&#xff1a;5分钟告别英文困扰 【免费下载链接】github-chinese GitHub 汉化插件&#xff0c;GitHub 中文化界面。 (GitHub Translation To Chinese) 项目地址: https://gitcode.com/gh_mirrors/gi/github-chinese 还在为GitHub复杂的英文界…...

编程新知 2026/5/24 17:14:29