24

基本的に、ファイルサイズの大きさに応じて、AJAX を使用してファイルをダウンロードする必要があるかどうかを判断したいと考えています。

この質問は次のように言い換えることもできると思います: ajax リクエストのヘッダーだけを取得するにはどうすればよいですか?

編集：コメントのultima-rat0は、明らかにこれと同じである、すでに尋ねられた2つの質問について教えてくれました。それらは非常に似ていますが、どちらも jQuery を必要としています。これに対するjQuery以外のソリューションが必要です。

4

4 に答える 4

36

XHR 応答ヘッダー データを手動で取得できます。

http://www.w3.org/TR/XMLHttpRequest/#the-getresponseheader()-メソッド

この関数は、要求された URL のファイルサイズを取得します。

function get_filesize(url, callback) {
    var xhr = new XMLHttpRequest();
    xhr.open("HEAD", url, true); // Notice "HEAD" instead of "GET",
                                 //  to get only the header
    xhr.onreadystatechange = function() {
        if (this.readyState == this.DONE) {
            callback(parseInt(xhr.getResponseHeader("Content-Length")));
        }
    };
    xhr.send();
}

get_filesize("http://example.com/foo.exe", function(size) {
    alert("The size of foo.exe is: " + size + " bytes.");
});
于 2013-07-04T01:47:54.783 に答える
2

HEAD リクエストができない場合:

解決策 Ebrahim は、firefox で中止されたリクエストに対して context-length が利用できなかったため、私にとっては firefox でしか機能しませんでした。そこで、「onreadystatechange」イベントの代わりに「onprogress」イベントを使用しました。

new Promise(
  (resolve, reject) => {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.onprogress = (event) => {
      if (event.lengthComputable) {
        resolve(event.total);
      } else {
        reject(new Error('No content-length available'));
      }
      xhr.abort();
    };
    xhr.send();
  }
);
于 2019-08-19T14:57:29.480 に答える