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

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

news 2026/4/3 12:44:43

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

Unity零基础入门指南：借助快马AI生成你的第一个可交互3D场景

Unity零基础入门指南&#xff1a;借助快马AI生成你的第一个可交互3D场景 作为一个刚接触Unity的新手&#xff0c;我完全理解那种面对空白项目时的迷茫感。好在最近发现了InsCode(快马)平台&#xff0c;它让我这个编程小白也能快速创建出像模像样的3D交互场景。下面我就分享一下…...

编程新知 2026/4/3 12:42:35

解锁专利数据价值：Google Patents Public Data全流程应用指南

解锁专利数据价值&#xff1a;Google Patents Public Data全流程应用指南 【免费下载链接】patents-public-data Patent analysis using the Google Patents Public Datasets on BigQuery 项目地址: https://gitcode.com/gh_mirrors/pa/patents-public-data 企业如何突破…...

编程新知 2026/4/3 11:44:05

3大核心问题解决：B站视频处理全流程指南从下载到去水印的实战方案

3大核心问题解决&#xff1a;B站视频处理全流程指南从下载到去水印的实战方案 【免费下载链接】downkyi 哔哩下载姬downkyi&#xff0c;哔哩哔哩网站视频下载工具&#xff0c;支持批量下载&#xff0c;支持8K、HDR、杜比视界&#xff0c;提供工具箱&#xff08;音视频提取、去水…...

编程新知 2026/4/3 11:01:41

别再对着文档发愁了！手把手教你读懂并配置StrongSwan的ipsec.conf文件

从零到精通&#xff1a;StrongSwan的ipsec.conf实战配置指南 第一次打开ipsec.conf文件时&#xff0c;那些密密麻麻的参数确实让人望而生畏。作为一款功能强大的IPsec实现&#xff0c;StrongSwan的配置文件看似复杂&#xff0c;实则遵循着清晰的逻辑结构。本文将带你从实际应用…...

编程新知 2026/4/3 10:15:05

OpenClaw技能扩展实战：用Qwen3-32B镜像自动处理Markdown文档

OpenClaw技能扩展实战&#xff1a;用Qwen3-32B镜像自动处理Markdown文档 1. 为什么需要文档自动化处理 作为一个长期与Markdown文档打交道的技术写作者&#xff0c;我经常遇到这样的困扰&#xff1a;当积累了几百篇笔记后&#xff0c;突然发现文件命名不规范需要批量修改&…...

编程新知 2026/4/3 9:00:00

Phi-4-mini-reasoning多场景落地：K12教育智能批改、竞赛培训、教师备课助手

Phi-4-mini-reasoning多场景落地&#xff1a;K12教育智能批改、竞赛培训、教师备课助手 1. 模型介绍 Phi-4-mini-reasoning是一款3.8B参数的轻量级开源模型&#xff0c;专为数学推理、逻辑推导和多步解题等强逻辑任务设计。这款模型由微软Azure AI Foundry开发&#xff0c;主…...

编程新知 2026/4/3 8:55:30

OpenClaw自动化写作流：Phi-3-mini-128k-instruct生成技术文章+校对手册

OpenClaw自动化写作流&#xff1a;Phi-3-mini-128k-instruct生成技术文章校对手册 1. 为什么需要自动化写作流 上周我连续写了三篇技术文章后&#xff0c;突然意识到一个严重问题——每次从资料收集到最终排版&#xff0c;至少要消耗4小时。其中真正用于核心内容创作的时间不…...

编程新知 2026/4/3 8:55:30

Claude颠覆AI编程

&#x1f680; Claude 4 正式发布&#xff01;Anthropic 这次真的要颠覆 AI 编程了 今天&#xff0c;AI 领域迎来核弹级更新——Anthropic 正式发布 Claude 4 系列模型&#xff01;免费可用、7 小时自主编程&#xff0c;开发者直呼"生产力革命来了"&#xff01; 一、…...

编程新知 2026/4/3 8:47:28

基于NSGA-II多目标遗传优化算法的考虑风光火储+需求响应+P2G多能源系统多目标优化调度研究（Matlab代码实现）

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…...

编程新知 2026/4/3 8:45:27

JetBrains IDE试用期管理完全指南：从技术原理到合规使用

JetBrains IDE试用期管理完全指南&#xff1a;从技术原理到合规使用 【免费下载链接】ide-eval-resetter 项目地址: https://gitcode.com/gh_mirrors/id/ide-eval-resetter 一、问题导入&#xff1a;当试用期结束打断开发流程时 1.1 开发中断的典型场景 想象这样一个…...

编程新知 2026/4/3 7:40:37