如何使用主干更新文件上传消息？答案

【问题标题】：How to update file upload messages using backbone?如何使用主干更新文件上传消息？
【发布时间】：2013-02-18 08:42:21
【问题描述】：

我正在使用 javascript 上传多个文件。

上传文件后，我需要运行几个处理函数。

由于需要处理时间，我需要在前面有一个 UI，告诉用户整个过程的估计剩余时间。

基本上我有3个功能：

这就是我希望屏幕基本上看起来的样子。

应显示剩余百分比和剩余时间等信息。

但是，我不确定是允许服务器提供信息还是仅使用 javascript 进行粗略估计。

我还需要更新屏幕，比如告诉用户消息，例如

“正在上传”

如果我在功能 1.

“生成元数据”如果我在函数 2。

“处理中...”如果我在函数 3。

功能 2 仅在 1 成功完成后发生。

功能 3 仅在 2 成功完成后发生。

我已经在使用 q.js 承诺来处理其中的某些部分，但是代码变得非常混乱。

我最近遇到了 Backbone，它允许以结构化的方式处理单页应用程序行为，这正是我想要的。

对于端点的成功或失败，服务器端返回 json 响应没有任何问题。

我想知道使用 Backbone.js 实现这个功能的好方法是什么

【问题讨论】：

【解决方案1】：

您可以使用“进度”文件或数据库条目来存储后端进程的状态。让您的后端进程定期更新此文件。例如，将其写入文件：

{"status": "Generating metadata", "time": "3 mins left"}

在用户提交文件后，前端开始使用简单的 ajax 调用和 setTimeout ping 后端 progress 函数。 progress 函数会简单地打开这个文件，获取 JSON 格式的状态信息，然后更新前端进度条。

您可能希望将 ajax 调用附加到您的模型。让您的前端视图关注 status 的更改并相应更新（例如进度条）。

【讨论】：

谢谢。在使用主干之前你有没有实现过类似的东西？
@kimsia 我有一个正在生产中的应用程序遵循这个精确的范例。模型查询状态更新，进度模式（视图）相应更新。
感谢您的回答。顺便问一下，您是否使用除主干以外的任何其他js框架来实现这一点？例如，木偶？
@kimsia 目前没有。当我有时间时，我确定我会尝试其他人，但现在 Backbone 可以很好地为我服务。
@kimsia - 只是想指出 Marionette 只是 Backbone 之上的糖，但更重要的是，无论是否在任何框架中，实现都是相同的：基于间隔的轮询/websockets 和更新相应地显示。

【解决方案2】：

长轮询请求： Polling request for updating Backbone Models/Views

基本上，当您上传文件时，您将为每个给定文件分配一个“FileModel”。 FileModel 将每隔 N 秒启动一次长轮询请求，直到获得“完成”状态。

【讨论】：