2011-03-18 95 views
6

我正在构建一个图像管理工具,我想知道如何创建类似Vimeo的体验。的需要采取什么异步处理客户端进度反馈的asp.net mvc

说明
用户将能够使用上传plupload(不重新加载页面)许多潜在的高画质图像。然后,服务器将在每个上传的图像上执行以下操作。

  • 的图像将被调整到
  • 每个副本都会有 做了一些图像处理(例如 卷积过滤器)
  • 这些调整 几个版本(如拇指,小, 中,大)副本将被上传到亚马逊S3
  • 关于每个图像的信息将被存储到数据库(宽度,高度, mimetype,文件名)
  • 然后服务器会触发某种反馈给用户

提供Asyncronous反馈
Plupload(图片上传工具)有上传文件到我的服务器时非常好的视觉反馈,但是,我想能够在服务器完成所有图像处理并上传到远程存储的同时向用户提供更多反馈。

Vimeo做得很好。当您上传视频时,会确认它已上传,但接着显示“我们正在对您的视频进行编码,请稍候”,界面提供了某种进度指示器。

我想在图像上传到我的服务器后给用户两种反馈。每个图像已被处理,并上传到S3时,我想:

  • 更新浏览器 的消息说:“5月15日的画面已经 处理”,我想
  • 有一个出现该图像的缩略图。

实例MVC控制器动作

[HttpPost] 
public virtual ContentResult Upload(Guid albumId) 
{ 
    foreach (string file in Request.Files) 
    { 
    HttpPostedFileBase f = Request.Files[file] as HttpPostedFileBase; 
    if (f.ContentLength == 0) 
     continue; 

    var uploadDir = Server.MapPath("~/uploads/"+ albumId); 
    var filePath = Path.Combine(uploadDir, Path.GetFileName(hpf.FileName)); 
    f.SaveAs(filePath); 

    // How can I trigger some async task here that would be able 
    // to trigger some sort of feedback to the browser when complete? 
    SomeAsyncImageProcessor.ProcessImage(albumId, filePath); // ??? 
    } 

    return Content("Success", "text/plain"); 
} 

约束
使用该Web应用程序将使用最新版本的Chrome的人。不需要解决跨浏览器问题。我们正在使用asp.net MVC 3和SQL Server 2005

任何人都可以指向正确的方向吗? 有没有很好的资源来展示我能如何完成这样的事情?

+0

这就是所谓的彗星(或ReverseAJAX),目前它没有大的由IIS支持。看看这个:http://stackoverflow.com/questions/2259633/how-to-implement-reverseajax-comet-in-asp-net-mvc – rsenna 2011-03-18 17:20:05

+0

你有没有设法找到一个解决办法:我试图做的正是此:图像将被调整成几个版本(如拇指,小,中,大) 每个副本都会有一些图像处理完成(如卷积过滤器) 这些调整的副本将被上传到亚马逊S3 信息有关每个图像将被存储到数据库(宽度,高度,mimetype,文件名),但我不能成功,你能帮我吗? – Marwan 2011-06-19 12:27:50

回答

3

Rsenna的评论链接到一个名为WebSync的东西,它是一个基于.NET的Comet实现。非常好,如果你完全需要实时通知,那么完成异步过程。

不过,我认为老式的投票可能会在你的情况就足够了。 SomeAsyncImageProcessor仍然是一个异步进程(所以你的应用程序不会冻结)。

但是,一旦“成功”返回到浏览器(表示上传已成功完成),您的页面开始轮询“状态”URL定期,也许1或2秒(取决于你希望多久,这些过程可走。)

对于每一个图像,按顺序状态URL进行检查。 http://mysite/imageprocessor/status?albumId=guid&stepid=3

状态URL要么返回状态应该重新检查的指示符,要么返回成功并返回一个指向亚马逊缩略图(或您网站上的URL)的URL。重新检查,直到检查完最后一步。