javascript - 如何使用tus-client恢复和上传文件上传

Question

我想暂停和恢复文件上传，如本例所示https://tus.io/demo.html

我正在使用这个 https://github.com/tus/tus-js-client 插件

我找遍了所有地方，但没有找到任何解决方案

问题:我想为多个文件暂停和恢复 fileupload

这是我的完整代码: https://codepen.io/eabangalore/pen/dwXEMM?editors=1010

请帮助我提前谢谢!!

Answer 1

乌比

您可以使用 Uppy File Uploader 进行可续传上传。它包装了 tus-js-client.js 并提供了一个简化的接口(interface)。

您可以找到它的文档 here和实例 here

在您的网页上导入 Uppy JS 和 CSS 文件后，您需要执行一些类似于以下的脚本:

<script type="text/javascript">
  var uppy = new Uppy.Core({ debug: true, autoProceed: false });
  uppy.use(Uppy.Dashboard, {
    trigger: '.UppyModalOpenerBtn',
    inline: true,
    target: '.DashboardContainer'
});
  uppy.use(Uppy.Tus10, { endpoint: 'http://localhost:1080/files/' });
  uppy.run();
</script>

一些 HTML:

<div class="DashboardContainer"></div>

希望这会有所帮助。如果没有，请随时进一步讨论该问题。

TUS 协议(protocol)^(编辑)

如评论中所述，您想使用 tus-client-js 而不是 Uppy 上传多个文件。为此，您可以查看这篇文章来处理多个上传场景: https://github.com/tus/tus-js-client/issues/115

该帖子是关于在第一个文件成功完成后启动另一个文件上传。

编辑

根据 documentation tus-js-client库，你需要调用文件上传对象的abort方法来暂停和start方法来暂停/恢复上传:

3. Optionally pause the upload if the user/application wishes to do so using Upload#abort. This will cause any currently running transfers to be immediately stopped.

4. Optionally resume the previously paused upload by called Upload#start again. This will resume the upload at the point at whichit had stopped before. You can also use this approach to continue theupload after an error has occurred.

要了解更多关于引擎盖下发生的事情，请访问此 link .