2016-06-20 22 views
0

私はビデオオブジェクトのリストを持っています、各オブジェクトはリンクと他のほとんどの属性を持っています。私はこのリストを通って、それらのリンクを介してそれらのビデオをアップロードするループを構築しました。私が現在使っているサービスは、一度に複数のビデオをアップロードすることをサポートしていません。ここでは、この責任のコードです

..etcアップロードする第二のものが必要です。

$scope.upload = function(){ 
    $scope.videoList.forEach(function(video){ 
     video.state = "Downloading" 
     $scope.msg = "The video is downloading" 
    $http.post("/download",{link : video.link,title : video.title}).then(function(resp){ 
     $scope.msg = "The video has been downloaded on the server, it will now start uploading" 
     var filen = resp.data["fn"] 
     var title = resp.data["title"] 
     video.state = "Uploading" 
     $http.get("/uploadVid?file=" + filen +"&title=" + title).then(function(resp){ 
     if (resp.data == "0002"){ 
     alert("You didn't authorize the App yet, please authorize it to be able to use it .") 
     } 
     if (resp.data == "000X"){ 
     alert("An error occured, please retry .") 
     } 
     else{ 
     $scope.msg = "the video uploaded, here's the link: " + resp.data 
     video.state = "Done" 
     video.link = resp.data 
     } 
     }) 
    }) 

    }) } 

ここ何が起こるかは、それがダウンロードされています一度、各ビデオのために、我々は、サーバー上でそれをダウンロードすることで、それがアップロードされていますビデオホスティングサービス(私たちの場合はYouTube)に転送します。これはうまくいくはずですが、$httpサービスコールの非同期性のために、それらはすべて同時にダウンロードと同時にアップロードを開始します。

ループはiterationが完了するのを待つことなく、次の反復に直接進みます。私はこれを同期させて、動画をダウンロードして1つずつアップロードする必要があります。私はプロミスインターフェイスを使用しないことを好むだろう、私は急いでいると私はそれらについて多くを知らない。あなたができるなら、できるだけ説明してください。

+1

* *同期*を要求しません。あなたはそれらを連続的にしたいと思う。 –

+0

あなたのコードですでにPromisesを使用していますが、http.postは約束を返し、その約束が解決したらあなたの関数を呼び出します。 –

+0

@ T.J.Crowderどのように順番にするのか、違いは何ですか?説明してください。 – DeltaWeb

答えて

3

あなたはではありませんを要求します。あなたはを実行しますの順番にします。 (同期 AJAXリクエストが。ユーザーエクスペリエンスの低下になりそれ。  — JavaScriptのUIスレッドを保持し、通常はブラウザのUIは、少なくともそのタブ内  —を完了するために、AJAX操作を待っているものですそれらを行う連続してを実行するということは、たとえば並列ではなく順番に順番に処理することを意味します)。

これを実行する通常の方法は、処理中のものを追跡し、処理してからその1つは、次のものに移動します。コメントを参照してください:

$scope.upload = function() { 
    // Grab the array and start with index = 0 
    var videos = $scope.videoList; 
    var index = 0; 
    if (videos.length) { 
     // Start the process 
     next(); 
    } 

    // Our handler for each video 
    function next() { 
     // Get the video 
     var video = videos[index]; 
     video.state = "Downloading" 
     $scope.msg = "The video is downloading" 
     $http.post("/download", { 
      link: video.link, 
      title: video.title 
     }).then(function(resp) { 
      $scope.msg = "The video has been downloaded on the server, it will now start uploading" 
      var filen = resp.data["fn"] 
      var title = resp.data["title"] 
      video.state = "Uploading" 
      $http.get("/uploadVid?file=" + filen + "&title=" + title).then(function(resp) { 
       if (resp.data == "0002") { 
        alert("You didn't authorize the App yet, please authorize it to be able to use it .") 
       } 
       if (resp.data == "000X") { 
        alert("An error occured, please retry .") 
       } else { 
        $scope.msg = "the video uploaded, here's the link: " + resp.data 
        video.state = "Done" 
        video.link = resp.data 

        // Do the next video now we've finished this one 
        if (++index < videos.length) { 
         next(); 
        } 
       } 
      }) 
     }) 
    } 
} 

注:オフの破線は、すべてを持っていない可能性があり、私の交差とtの点在するが、おそらくファンダメンタルズは明確です。

関連する問題