Vimeo APIファイルは常に308の返答を返す

Question

私はこの問題を1週間以上抱えていましたが、Vimeoのサポートに連絡していましたが、どこにも行きませんでした。似たような問題はありましたが、修正はまだありません。このオプションは、（私はjQuery.ajaxを使用しています適用されませんので、私はjQueryのファイルアップロードプラグインを使用していないよ..but最も近い同様の投稿がVimeo API : streaming upload using HTTP PUT and blueimp's jQuery fileupload

です。

とにかく、私が使用して動画をアップロードしようとしていますHTTP PUTメソッド（https://developer.vimeo.com/api/upload/videos#resumable-http-put-uploads）

Iは、ステップ1のようにアップロードチケットを生成して、ここで、ステップ2のようにupload_link_secureにPUTリクエストを送信したリクエスト..です

Request URL:https://1511923893.cloud.vimeo.com/upload?ticket_id=9b867d91d7e7f83bb31f0690b6331ac0&video_file_id=522193134&signature=89c47a9b3bfc4a0ece830b75d1845e86&v6=1 

Accept:*/* 
Accept-Encoding:gzip, deflate, sdch 
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6 
Connection:keep-alive 
Content-Length:10498886 
Content-Type:video/mp4 
Host:1511923893.cloud.vimeo.com 
Origin:http://www.talentgapp.local 
Referer:http://www.talentgapp.local/ 
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36 

と応答...

Request URL:https://1511923893.cloud.vimeo.com/upload?ticket_id=9b867d91d7e7f83bb31f0690b6331ac0&video_file_id=522193134&signature=89c47a9b3bfc4a0ece830b75d1845e86&v6=1 
Request Method:PUT 
Status Code:200 OK 
Remote Address:54.78.176.185:443 

レスポンスヘッダ

Access-Control-Allow-Headers:Content-Type, Content-Range, X-Requested-With 
Access-Control-Allow-Methods:POST, PUT, GET, OPTIONS 
Access-Control-Allow-Origin:* 
Access-Control-Expose-Headers:Range 
Connection:close 
Content-Length:0 
Content-Type:text/plain 
Date:Thu, 28 Apr 2016 11:39:53 GMT 
Server:Vimeo/1.0 
Timing-Allow-Origin:* 
X-Backend-Server:kopiluwak 
X-Requested-With:XMLHttpRequest 

これまでのところは良い - ビデオも私のVimeoのアカウントに表示されます（ただし、「アップロード」状態にある、決して完了）

したがって、Vimeoのドキュメントで推奨されているように、私はステップ3と同じようにアップロードを検証しようとします（ファイルデータを除き、前と同じリクエストパラメータを提供し、Content-Range: bytes */*ヘッダーを追加します）：

要求：

Accept:*/* 
Accept-Encoding:gzip, deflate, sdch 
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6 
Connection:keep-alive 
Content-Length:0 
Content-Range:bytes */* 
Content-Type:video/mp4 
Host:1511923893.cloud.vimeo.com 
Origin:http://www.talentgapp.local 
Referer:http://www.talentgapp.local/ 
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36 

と応答...

Request URL:https://1511923893.cloud.vimeo.com/upload?ticket_id=9b867d91d7e7f83bb31f0690b6331ac0&video_file_id=522193134&signature=89c47a9b3bfc4a0ece830b75d1845e86&v6=1 
Request Method:PUT 
Status Code:308 Resume Incomplete 
Remote Address:54.78.176.185:443 

レスポンスヘッダ..

Access-Control-Allow-Headers:Content-Type, Content-Range, X-Requested-With 
Access-Control-Allow-Methods:POST, PUT, GET, OPTIONS 
Access-Control-Allow-Origin:* 
Access-Control-Expose-Headers:Range 
Connection:close 
Content-Length:0 
Content-Type:text/plain 
Date:Thu, 28 Apr 2016 11:39:53 GMT 
Range:bytes=0-10498886 
Server:Vimeo/1.0 
Timing-Allow-Origin:* 
X-Backend-Server:kopiluwak 
X-Requested-With:XMLHttpRequest 

あなたは、私が308応答でRange:bytes=0-10498886を取得しています見ることができるように。このリクエストを何回か繰り返しますが、Rangeヘッダーは常にbytes=0-10498886です。アップロードが完了したことを確認するための200の応答はありません。

このように、手順4で説明したようにDELETEリクエストを実行すると、error 500: Invalid stateとなります。

誰もが考えている？

Answer 1

私もこの問題を抱えていましたが、私の使用事例では解決できました。

あなたはデータを送信している形式を指定していませんが、私の場合はFormDataオブジェクトを送信しています。私は代わりに生のバイト配列を送信するように変更し、それが動作し始めた。

以前は（動作しない）：今すぐ

function getVideoFormData($fileUpload) { 
    var formData = new FormData(); 
    formData.append($fileUpload.files[0].name, $fileUpload.files[0]); 
    return formData; 
} 

$.ajax({ 
    type: "PUT", 
    /*Other relevant options...*/ 
    data: getVideoFormData($"#my-video-id"); 
}); 

（ワーキング）：readAsArrayBufferは即座配列バッファを返しません

function getVideoFormData($fileUpload) {  
    var promise = $.Deferred(); 

    var reader = new FileReader(); 
    reader.onload = function() { 
     var bytes = this.result; 
     promise.resolve(bytes); 
    }; 
    reader.readAsArrayBuffer($fileUpload.files[0]); 

    return promise; 
} 

getVideoFormData($"#my-video-id").done(function(bytes){ 
    $.ajax({ 
     type: "PUT", 
     /*Other relevant options...*/ 
     data: bytes; 
    }); 
}); 

注意。代わりに、結果をreader.onloadハンドラにロードします。これは同期的に起こらなかったので、私はjQuery Deferred objectを追加しなければならなかった。

私はreader.readAsBinaryStringを使ってみましたが、これはFormDataアプローチと同じ結果でした。 reader.readAsArrayBufferメソッドはChrome/FF/IE11では今私のために働いています。検証ステップの結果はまだ308ですが、映像が正しくアップロードされ、DELETEのステップは、今最終的に私はこの今働いている200

Answer 2

を返している

注意。

正しい方向に私を導くための@razethestrayの信用。

XHR経由で送信する前に、ファイルをFormDataオブジェクトに追加する必要はありません。

そのままファイルを送信してください。

Vimeoののマニュアルを信じるように私を欺くものです -

$.ajax({ 
      url : uploadUri, 
      method : 'PUT', 
      contentType : false, 
      crossDomain : true, 
      headers : { 
       'Content-Type' : file.type, 
       'Content-Range': "bytes " + 0 + "-" + (file.size) + "/" + file.size 
      }, 
      processData : false, 
      data : files[0] // Not a FormData object 
     }) 
     .done(function(){ 
      // complete upload 
     }) 

また、私は、検証要求がステータス200を返すことはありませんことを学びました。

Range:bytes=0-10498886ヘッダーでは、確認リクエストは常に308を返します。最初の部分は決してゼロを超えません。 2番目の部分（10498886）で、元のファイルのサイズと一致するかどうかを確認する必要があります。存在する場合は、アップロードを完了します。ファイルのアップロード中に確認リクエストを実行すると、ファイルのアップロードが完了するまで範囲の2番目の部分が増分されます。

他人に役立つことを願っています。