离线下载任务交给爱智，轻松搞定！

leecactus0 2021-12-29 16:45:09

在我们日常使用计算机的过程中，看到喜欢的资源不可避免地想把它下载到我们的设备上保存下来，比如图片，音视频资源，文档资源等。基于这种应用场景，我们来看看在爱智设备上可以如何实现。

技术点

Task 多任务
SigSlot 异步通信
Socket.IO 订阅/发布
WebGet 下载

原型设计

需求分析

因为是离线下载，所以爱智 APP Web 端向爱智 APP Server 端发送一个请求，爱智后端启动多任务线程完成下载任务，这时候前端就可以关闭了。
需要将下载的进度实时返回到前端，使用 Socket.IO 将进度推送到前端。
下载任务和 Socket.IO 之间需要异步通信，使用 SigSlot。

什么是 SigSlot 和 WebGet

在正式开始之前，我们先来简单了解一下这个任务的两个主角，SigSlot 和 WebGet。这两个模块都是 JSRE 已经提供好的 API，直接引用。

01 SigSlot

SigSlot 是一个事件驱动的异步通信组件，支持多任务和多进程，这也是为什么我们这里选择使用 SigSlot 在 Task 中进行通信的原因。它继承自 EventEmitter，是一个典型的订阅和发布通信机制。

SigSlot 的功能还远不止于此，当应用申请开启 GSS 支持后，来自同一开发供应商的应用程序可以通过 GSS 的功能互相订阅和发布消息。

在这里，我们只在同一应用中的多个线程中使用它的异步通信功能。

02 WebGet

WebGet 模块用于获取 http 数据。它支持分段请求数据，以及断点续传等。通过调用 WebGet 上的 file 方法来将数据保存到文件中。可以在选项中指定数据的起始位置、每段数据的大小以及并行请求的数量。如果文件存在并且设置了 reload 为 true，WebGet 对象将检查日志并启动断点恢复过程。

实现过程

01 前端实现

前端部分是正常的发送请求，以及监听进度部分，这里给出大致的代码段，详细的内容可以参考文末附上的代码仓库。

我们这里在 onMounted 的生命周期中接收 Socket.IO 传递过来的下载进度的数据，然后更新到对应的 DataView 中。

02Server 端实现

Server 端部分我们主要看三个部分的内容，router 中触发下载任务：

我们在路由一开始就将下载的线程运行了起来，在其内部监听一个 download 的 Sigslot 任务。路由这里接收到下载的请求后，就将参数通过 Sigslot 发送到了 Task 线程。

接下来看一下 Task 线程中的内容：

Task 中我们只做一件事，外层 SigSlot 订阅下载任务，然后使用 WebGet.file 进行资源下载，按照需求配置分片以及断点续传等功能。WebGet.file 的回调函数返回 WebGet 对象，可以在 WebGet 对象的 data 事件中获取计算进度的数据，最后再通过 SigSlot 发布到 Socket.IO 的订阅事件中。

最后看返回给前端的下载进度：