Comment puis-je vérifier le type MIME d'un fichier en JavaScript avant de le télécharger ?

Comment vérifier le type MIME d'un fichier avec JavaScript avant le téléchargement ?

JavaScript vous permet de vérifier le type MIME d'un fichier à l'aide de FileReader avant de le télécharger à un serveur. Bien que la vérification côté serveur soit préférable, la vérification côté client reste une option. Voyons comment :

Étape 1 : Récupérer les informations sur le fichier

Obtenir les détails du fichier à partir d'une entrée élément comme indiqué ci-dessous :

// Retrieve file information
var files = document.getElementById("your-files").files;

Étape 2 : Inspecter les fichiers pour le type MIME

Méthode rapide :

Utiliser Blob pour extraire le type MIME :

console.log(files[i].type);  // Outputs "image/jpeg" or similar

Bloc Méthode d'inspection d'en-tête :

Analyser l'en-tête du fichier à la recherche de « nombres magiques » spécifiques à différents types de fichiers :

var blob = files[i];  // File object
var fileReader = new FileReader();
fileReader.onloadend = function(e) {
  var arr = (new Uint8Array(e.target.result)).subarray(0, 4);
  var header = "";
  for(var i = 0; i < arr.length; i++) {
     header += arr[i].toString(16);
  }
  console.log(header);

  // Check the file signature against known types

};
fileReader.readAsArrayBuffer(blob);

Détermination du type MIME réel :

switch (header) {
    case "89504e47":
        type = "image/png";
        break;
    case "47494638":
        type = "image/gif";
        break;
    case "ffd8ffe0":
    case "ffd8ffe1":
    case "ffd8ffe2":
    case "ffd8ffe3":
    case "ffd8ffe8":
        type = "image/jpeg";
        break;
    default:
        type = "unknown";
        break;
}

En utilisant ces méthodes, vous pouvez déterminer le type MIME des fichiers côté client avant de les télécharger au serveur, réduisant ainsi l'utilisation inutile des ressources du serveur.

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!