Comment puis-je télécharger un fichier à l'aide de l'API Client-Side Fetch ?

Comment télécharger un fichier à l'aide de la récupération côté client

Lors du développement d'une application Web ou mobile, vous devrez peut-être télécharger des fichiers à partir d'un serveur distant sur l'appareil de l'utilisateur. Avec l'introduction de l'API Fetch, le téléchargement de fichiers côté client est devenu beaucoup plus facile.

Considérez l'extrait de code suivant :

<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(...);
}</code>

Dans ce scénario, vous avez une requête Fetch défini qui récupère un fichier de Google Drive. La question se pose : que devez-vous faire dans le bloc then pour télécharger le fichier ?

Une approche plus propre et plus efficace du téléchargement de fichiers est présentée ci-dessous, en utilisant l'API Fetch sans recourir à des bibliothèques supplémentaires.

<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>

Cet extrait de code initialise une requête Fetch avec l'URL et l'en-tête d'autorisation appropriés. Il utilise ensuite la méthode res.blob() pour récupérer les données binaires du fichier. Ensuite, il crée une URL d'objet temporaire pour le fichier et l'attribue au window.location pour déclencher le téléchargement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!