uppy 搭建_免费的ES5 / ES6 JavaScript文件上传插件– Uppy

要设计的最棘手的表单输入之一是文件上载 。 它具有默认HTML样式，但这并不是世界上最漂亮的东西。

它基于ES5 / ES6代码运行 ，因此您可以使用最新JavaScript标准来构建Web应用程序。 而且，它甚至还支持从 Dropbox或Google Drive等云存储站点上传文件 ，因此它是Web的多方面文件上传脚本 。

Uppy是完全免费和开源的 ， 在GitHub上有一个仓库。 但是，安装此插件的最简单方法是通过npm或Yarn ，因此您可以像实际的package一样运行它 。

将文件添加到网站后，只需包含Uppy.js文件和CSS代码 。 然后，您可以将所需的输入字段作为目标，然后由Uppy负责其余的工作。

它具有一个独特的界面， 看起来像一个大的正方形位置，用于拖放文件。 您还可以从硬盘驱动器中选择项目，甚至可以从外部URL远程上传文件 。 太疯狂了！

您可以在文档页面上找到整个设置过程，但这至少需要对ECMAScript 6有所了解 。 该库面向脚本的未来，并不是纯香草JavaScript最容易使用的库。

但是，如果您对Web开发很认真，无论如何都值得学习ES6。 您可以在线找到大量资源进行自我教学，甚至可以将Uppy用作您的第一个“真实”项目，以开始学习。

查看“ 仪表板示例”以查看Uppy的使用情况 。 对于此页面，上载隐藏在触发按钮的后面 ，您可以在其中单击按钮以显示模式上载字段。

在这里，您可以选择是要从计算机，网络还是从网络摄像头上传图片！

“示例”页面提供了一堆内容，包括一个拖放示例以及一个国际化的演示页面 。

但是，要真正了解其工作原理，我建议浏览文档并浏览主要的GitHub存储库 。 您还可以在Twitter @transloadit上与创建者分享您的想法。

翻译自: https://www.hongkiat.com/blog/uppy-javascript-file-upload/