gaomingcode / jquery.fileupload
jQuery 文件上传小部件,支持多文件选择、拖放支持、进度条、验证和预览图片、音频和视频。支持跨域、分块和可续传文件上传。适用于任何支持标准HTML表单文件上传的服务器端平台(如Google App Engine、PHP、Python、Ruby on Rails、Java等)。
This package is auto-updated.
Last update: 2024-09-29 05:49:56 UTC
README
安装
Composer
composer require gaomingcode/jquery.fileupload
原始ReadMe
内容
描述
jQuery 文件上传小部件,支持多文件选择、拖放支持、进度条、验证和预览图片、音频和视频。
支持跨域、分块和可续传文件上传以及客户端图像缩放。
适用于任何支持标准HTML表单文件上传的服务器端平台(如PHP、Python、Ruby on Rails、Java、Node.js、Go等)。
演示
特性
- 多文件上传
允许一次性选择多个文件并同时上传。 - 拖放支持
允许通过从桌面或文件管理器拖放文件到浏览器窗口来上传文件。 - 上传进度条
显示进度条,指示单个文件和所有上传的组合上传进度。 - 可取消上传
可以取消单个文件的上传以停止上传进度。 - 可续传上传
如果浏览器支持Blob API,可以恢复中断的上传。 - 分块上传
如果浏览器支持Blob API,可以将大文件分成小块上传。 - 客户端图像缩放
如果浏览器支持所需的JS API,可以自动在客户端缩放图像。 - 预览图像、音频和视频
如果浏览器支持所需的API,可以在上传之前预览图像、音频和视频文件。 - 无需浏览器插件(例如Adobe Flash)
实现基于HTML5和JavaScript等开放标准,无需额外的浏览器插件。 - 对旧浏览器的优雅降级
如果支持,通过XMLHttpRequests上传文件,并为旧浏览器使用iframe作为后备。 - HTML文件上传表单降级
允许通过使用标准HTML文件上传表单作为小部件元素来渐进增强。 - 跨站文件上传
支持通过跨站XMLHttpRequests或iframe重定向将文件上传到不同的域。 - 多个插件实例
允许在同一网页上使用多个插件实例。 - 可定制和可扩展
提供API以设置单个选项并定义各种上传事件的回调方法。 - 多部分和文件内容流上传
文件可以作为标准的"multipart/form-data"或文件内容流(HTTP PUT文件上传)上传。 - 与任何服务器端应用平台兼容
适用于任何支持标准HTML表单文件上传的服务器端平台(如PHP、Python、Ruby on Rails、Java、Node.js、Go等)。
安全
⚠️ 请阅读漏洞文档,了解已修复的漏洞列表
请同时阅读安全文档,了解如何安全配置您的Web服务器以进行文件上传。
设置
jQuery File Upload可以通过NPM安装
npm install blueimp-file-upload
这允许您通过node_modules
包含jquery.fileupload.js及其扩展,例如
<script src="node_modules/blueimp-file-upload/js/jquery.fileupload.js"></script>
然后可以通过以下方式在文件上传表单上初始化小部件
$('#fileupload').fileupload();
有关更多信息,请参阅以下指南
要求
强制要求
- jQuery v1.7+
- jQuery UI小部件工厂 v1.9+(包含):基本文件上传插件所需的,但非常轻量级,不依赖于jQuery UI套件中的任何其他依赖。
- jQuery Iframe传输插件(包含):对于不支持XHR文件上传支持的浏览器是必需的。
可选要求
- JavaScript模板引擎 v3+:用于渲染选定的和上传的文件。
- JavaScript Load Image库 v2+:对于图像预览和调整大小功能是必需的。
- JavaScript Canvas to Blob polyfill v3+:对于调整大小功能是必需的。
- blueimp Gallery v2+:用于在灯箱中显示上传的图像。
- Bootstrap v3+:用于演示设计。
- Glyphicons图标集,由Bootstrap使用。
跨域要求
使用Iframe传输插件进行跨域文件上传需要将结果重定向回原始服务器以检索上传结果。示例实现使用result.html作为原始服务器的静态重定向页面。
存储库还包括jQuery XDomainRequest传输插件,该插件可在Microsoft Internet Explorer 8和9中启用有限的跨域AJAX请求(IE 10支持跨域XHR请求)。
XDomainRequest对象仅允许GET和POST请求,不支持文件上传。它用于演示以从跨域文件上传服务中删除上传的文件。
浏览器
桌面浏览器
文件上传插件定期与最新浏览器版本进行测试,并支持以下最低版本
- Google Chrome
- Apple Safari 4.0+
- Mozilla Firefox 3.0+
- Opera 11.0+
- Microsoft Internet Explorer 6.0+
移动浏览器
文件上传插件已与以下移动浏览器进行测试并支持
- Apple Safari在iOS 6.0+
- Google Chrome在iOS 6.0+
- Google Chrome在Android 4.0+
- Android 2.3+的默认浏览器
- Opera Mobile 12.0+
扩展浏览器支持信息
有关每个浏览器版本和已知操作系统/浏览器错误支持的详细信息,请参阅扩展浏览器支持信息。
测试
该项目包含三套测试
- 使用ESLint进行代码格式化。
- 使用Mocha进行单元测试。
- 使用blueimp/wdio进行端到端测试。
要运行测试,请按照以下步骤操作
- 启动Docker。
- 安装开发依赖项
npm install
- 运行测试
npm test
支持
该项目正在积极维护,但没有官方支持渠道。
如果您有一个其他开发者可能能帮助您解决的问题,请将问题发布到Stack Overflow,并在问题中使用标签blueimp jquery file upload
。
许可证
在MIT许可下发布。