uppy
Uppy 4.9.0
Uppy是一个光滑的模块化JavaScript文件上传器，可与任何应用程序无缝集成。它很快，具有可理解的API，让您担心比构建文件上传器更重要的问题。
上述示例中使用的代码：
import Uppy from '@uppy/core'
import Dashboard from '@uppy/dashboard'
import RemoteSources from '@uppy/remote-sources'
import ImageEditor from '@uppy/image-editor'
import Webcam from '@uppy/webcam'
import Tus from '@uppy/tus'
const uppy = new Uppy ( )
. use ( Dashboard , { trigger : '#select-files' } )
. use ( RemoteSources , { companionUrl : 'https://companion.uppy.io' } )
. use ( Webcam )
. use ( ImageEditor )
. use ( Tus , { endpoint : 'https://tusd.tusdemo.net/files/' } )
. on ( 'complete' , ( result ) => {
console . log ( 'Upload result:' , result )
} )在线尝试或阅读文档以获取有关如何使用Uppy及其插件的更多详细信息。
npm install @uppy/core @uppy/dashboard @uppy/tus将CSS uppy.min.css添加到您的HTML页面的<head>中，或者在JS中包含在JS中，如果您选择的Bundler支持它。
另外，您还可以使用Transloadit的CDN：SMART CDN的预构建捆绑包。在这种情况下， Uppy将将自己连接到global window.Uppy 。
配x 该捆绑包由大多数Uppy插件组成，因此不建议使用此方法进行生产，因为您的用户可能只使用几个插件就必须下载所有插件。
<!-- 1. Add CSS to `<head>` -->
< link
href =" https://releases.transloadit.com/uppy/v4.9.0/uppy.min.css "
rel =" stylesheet "
/>
<!-- 2. Initialize -->
< div id =" files-drag-drop " > </ div >
< script type =" module " >
import {
Uppy ,
Dashboard ,
Tus ,
} from 'https://releases.transloadit.com/uppy/v4.9.0/uppy.min.mjs'
const uppy = new Uppy ( )
uppy . use ( Dashboard , { target : '#files-drag-drop' } )
uppy . use ( Tus , { endpoint : 'https://tusd.tusdemo.net/files/' } )
</ script > Dashboard - 通用UI，带预览，进度条，元数据编辑器以及所有酷的东西。大多数UI插件（例如网络摄像头和Instagram）所需Progress Bar - 上传进展时填补自身的最小进度栏Status Bar - 更详细的进度，暂停/简历/取消按钮，百分比，速度，上传/总尺寸（默认包含在Dashboard ）Informer - 在丢失时，请在拍照或“上传失败”之前发送诸如“微笑”之类的通知（默认包含在Dashboard ）Drag & Drop - 纯拖放区域File Input - 甚至更普通的“选择文件”按钮Webcam - 快照并记录这些自拍照？Google Drive - 从Google驱动器中导入文件Dropbox - 从Dropbox导入文件Box - 从框导入文件Instagram - Instagram的导入图像和视频Facebook - 来自Facebook的图像和视频OneDrive - 从Microsoft OneDrive导入文件Import From URL - 从网络上的任何地方导入直接URL ⓒ标记意味着@uppy/companion是一个服务器端组件，插件工作需要工作。
Tus - 可通过开放式TUS标准重新上传XHR Upload - 任何后端的常规上传（例如Apache，nginx）AWS S3 - 纯上传到AWS S3或兼容服务AWS S3 Multipart - S3风格的“ Multipart”上传到AWS或兼容服务Transloadit支持TransLoadit强大的文件上传和编码后端Golden Retriever - 浏览器崩溃后还原文件，就像什么都没有Thumbnail Generator - 生成图像预览（默认包含Dashboard ）Form - 在上传之前从<form>收集元数据，然后选择将结果附加回表单Redux满足您新兴的旅行需求我们旨在支持Chrome，Firefox和Safari的最新版本。
<input type="file"> ？没有JavaScript击败很多，所以这是一个公平的问题！运行上传和编码业务十年，尽管我们发现在情况下，文件输入还需要一些：
并非所有应用都需要所有这些功能。在许多情况下，一个<input type="file">很好。但是，这些是我们的客户击中 /询问的几件事，足以激发我们发展。
Transloadit的团队很小，我们有一个共同的野心来谋生开源。通过赠送诸如Tus.io和Uppy之类的项目，我们希望能够推进最新技术的状态，使生活对每个人的生活变得更好，并在此工作中获得有益的工作，并注重我们的商业服务：内容摄入和处理平台。
我们的想法是，如果我们的开源用户群中只有一小部分可以直接从源头上看到托管版本的吸引力，那就已经足以维持我们的工作了。到目前为止，这正在解决！我们能够将80％的时间用于开源，并且还没有破产。 ：d
是的，请查看文档以获取更多信息。
是的，无论您在后端上想要什么，都可以使用@uppy/xhr-upload插件，因为它仅POST或PUT请求。这是PHP后端示例。
如果您想要使用TUS插件的重复性，请使用TUS服务器实现之一？
而且，如果您希望用户能够从Instagram，Google Drive，Dropbox或Direct URL（将提供更多服务）从Instagram，Google Drive，Dropbox或其他服务中选择文件，则需要@uppy/companion
.github/CONTRIBUTING.md的撰稿人指南CHANGELOG.md Uppy使用：Photobox，Issuu，Law Insider，Cool Tabs，Soundoff，Sundoff，Scrumi，Crive等。
在您的项目中使用Uppy？让我们知道！
麻省理工学院许可证。
