Maison >développement back-end >tutoriel php >Comment implémenter un téléchargement de fichier simple à l'aide de jQuery AJAX et PHP ?

Comment implémenter un téléchargement de fichier simple à l'aide de jQuery AJAX et PHP ?

Linda Hamilton
Linda Hamiltonoriginal
2024-12-24 03:51:09815parcourir

How to Implement a Simple File Upload Using jQuery AJAX and PHP?

Téléchargement de fichiers jQuery AJAX avec PHP

Problème : Implémentation d'un téléchargement de fichier simple avec une configuration minimale à l'aide de jQuery AJAX et PHP.

HTML et JavaScript initiaux Script :

<!-- HTML -->
<input>
<!-- JavaScript -->
$("#upload").on("click", function() {
  var file_data = $("#sortpicture").prop("files")[0];
  var form_data = new FormData();
  form_data.append("file", file_data);
  alert(form_data);
  $.ajax({
    url: "/uploads",
    dataType: 'script',
    cache: false,
    contentType: false,
    processData: false,
    data: form_data,
    type: 'post',
    success: function() {
      alert("works");
    }
  });
});

Problème rencontré :
Lors du téléchargement d'un fichier, une alerte affichant "[object FormData]" apparaît, l'alerte de réussite reste non appelée , et aucun fichier n'est présent dans les "uploads" dossier.

Solution :
Pour faciliter le téléchargement d'un fichier, un script côté serveur est requis pour gérer la relocalisation et la gestion des fichiers.

Mise à jour Script JavaScript :

$('#upload').on('click', function() {
  var file_data = $('#sortpicture').prop('files')[0];
  var form_data = new FormData();                  
  form_data.append('file', file_data);
  alert(form_data);                             
  $.ajax({
    url: 'upload.php', // Point to server-side PHP script 
    dataType: 'text',  // Expect a response from the PHP script
    cache: false,
    contentType: false,
    processData: false,
    data: form_data,                         
    type: 'post',
    success: function(php_script_response){
      alert(php_script_response); // Display response from the PHP script
    }
 });
});

Script PHP côté serveur (upload.php) :

<?php

if ( 0 < $_FILES['file']['error'] ) {
  echo 'Error: ' . $_FILES['file']['error'] . '<br>';
}
else {
  move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name']);
}

?>

Considérations supplémentaires :

  • Assurez-vous que le chemin du serveur fourni vers le répertoire de téléchargement est correct.
  • Vérifiez que le répertoire de téléchargement dispose des autorisations en écriture.
  • Ajustez le move_uploaded_file paramètres de fonction pour personnaliser l'emplacement et le nom du fichier.
  • Vérifiez les paramètres de configuration PHP pour upload_max_filesize et post_max_size pour éviter les problèmes liés à la taille.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn