ホームページ > ウェブフロントエンド > jsチュートリアル > window.fetch() を使用してファイルをダウンロードするにはどうすればよいですか?

window.fetch() を使用してファイルをダウンロードするにはどうすればよいですか?

Linda Hamilton
リリース: 2024-10-23 07:29:01
オリジナル
584 人が閲覧しました

How to Download Files Using window.fetch()?

window.fetch() を使用したファイルのダウンロード

window.fetch() API を使用してファイルをダウンロードする場合は、then( ) 応答を処理するために fetch() 呼び出しをブロックします。その方法は次のとおりです。

<code class="javascript">function downloadFile(token, fileId) {
  let url = `https://www.googleapis.com/drive/v2/files/${fileId}?alt=media`;
  return fetch(url, {
    method: 'GET',
    headers: {
      'Authorization': token
    }
  }).then(res => {
    // Handle the response here
  });
}</code>
ログイン後にコピー

then() ブロックでは、通常、次の手順を使用してファイルをダウンロードできます。

  1. 応答を BLOB に変換する: res.blob().then(blob => {});
  2. BLOB の URL を作成します: var file = window.URL.createObjectURL(blob);
  3. ダウンロードをトリガーする window.location への URL: window.location.assign(file);

フェッチ API のみを使用する、より短くて効率的な代替方法があります:

<code class="javascript">const url ='http://sample.example.file.doc'
const authHeader ="Bearer 6Q************" 

const options = {
  headers: {
    Authorization: authHeader
  }
};
fetch(url, options)
  .then(res => res.blob())
  .then(blob => {
    var file = window.URL.createObjectURL(blob);
    window.location.assign(file);
  });</code>
ログイン後にコピー

以上がwindow.fetch() を使用してファイルをダウンロードするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート