blueimp/jquery-file-upload

jQuery 文件上传小部件。

资助包维护!
blueimp

安装量: 1,250,048

依赖项: 25

建议者: 0

安全: 1

星标: 13

关注者: 3

分叉: 7,960


README

内容

描述

jQuery 文件上传小部件支持多文件选择、拖放、进度条、验证和预览图像、音频和视频。
支持跨域、分块和可恢复文件上传,以及客户端图片缩放。
与任何支持标准 HTML 表单文件上传的服务器端平台(PHP、Python、Ruby on Rails、Java、Node.js、Go 等)兼容。

演示

演示文件上传

特性

  • 多文件上传
    允许一次性选择多个文件并同时上传。
  • 拖放支持
    允许您通过从桌面或文件管理器拖动文件并将其拖放到浏览器窗口来上传文件。
  • 上传进度条
    显示进度条,指示单个文件和所有上传的进度。
  • 可取消上传
    可以取消单个文件上传以停止上传进度。
  • 可恢复上传
    已中断的上传可以通过支持 Blob API 的浏览器恢复。
  • 分块上传
    支持使用支持 Blob API 的浏览器将大文件分块上传。
  • 客户端图片缩放
    支持浏览器支持所需 JS API 的情况下,客户端自动调整图片大小。
  • 预览图片、音频和视频
    支持在浏览器支持所需 API 的情况下,在上传前显示图片、音频和视频文件的预览。
  • 无需浏览器插件
    实现基于 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();

有关更多信息,请参阅以下指南

要求

必需要求

可选要求

跨域要求

使用Iframe Transport插件进行跨域文件上传需要重定向回原始服务器以检索上传结果。示例实现使用result.html作为原始服务器的静态重定向页面。

存储库还包括jQuery XDomainRequest Transport插件,该插件在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 on iOS 6.0+
  • Google Chrome on iOS 6.0+
  • Google Chrome on Android 4.0+
  • Android 2.3+上的默认浏览器
  • Opera Mobile 12.0+

扩展浏览器支持信息

有关每个浏览器版本支持的详细功能和已知的操作系统/浏览器错误,请查看扩展浏览器支持信息

测试

该项目包含三套测试

  1. 使用ESLint进行代码检查。
  2. 使用 Mocha 进行单元测试。
  3. 使用 blueimp/wdio 进行端到端测试。

运行测试的步骤如下

  1. 启动 Docker
  2. 安装开发依赖
    npm install
  3. 运行测试
    npm test

支持

此项目正在积极维护,但没有任何官方支持渠道。
如果您有其他开发者可能帮助您解决的问题,请将问题发布在 Stack Overflow 上,并在问题中添加标签 blueimp jquery file upload

许可

MIT 许可证 下发布。