Maison  >  Article  >  développement back-end  >  Amélioration de l'expérience : guide de développement de l'interface utilisateur pour le téléchargement HTTP asynchrone PHP de plusieurs fichiers

Amélioration de l'expérience : guide de développement de l'interface utilisateur pour le téléchargement HTTP asynchrone PHP de plusieurs fichiers

WBOY
WBOYoriginal
2023-09-11 11:51:241342parcourir

提升体验:PHP 异步 HTTP 下载多个文件的用户界面开发指南

Améliorer l'expérience : guide de développement d'interface utilisateur pour le téléchargement HTTP asynchrone PHP de plusieurs fichiers

Introduction :
Dans les applications Web modernes, le téléchargement de fichiers est l'une des fonctions les plus courantes. Cependant, lorsque plusieurs fichiers doivent être téléchargés, la méthode de téléchargement synchrone traditionnelle peut amener les utilisateurs à attendre trop longtemps. Afin d'améliorer l'expérience utilisateur, nous pouvons utiliser la fonction de requête HTTP asynchrone de PHP pour réaliser le téléchargement simultané de plusieurs fichiers. Cet article vous fournira un guide détaillé pour vous aider à développer une fonction de téléchargement asynchrone avec une bonne interface utilisateur.

1. Comprendre le téléchargement HTTP asynchrone
Le téléchargement HTTP synchrone traditionnel télécharge les fichiers un par un dans l'ordre, tandis que le téléchargement HTTP asynchrone lance plusieurs requêtes HTTP en même temps et télécharge plusieurs fichiers en parallèle. Cela peut réduire considérablement le temps d’attente des utilisateurs et améliorer la vitesse de téléchargement et l’expérience utilisateur.

2. Préparation
Avant de commencer le développement, nous devons nous assurer que l'extension cURL est installée dans votre environnement PHP. Vous pouvez vérifier s'il est installé en exécutant la commande suivante :

$ php -m | grep curl

Si le nom de l'extension curl n'est pas affiché, elle doit être installée. Sur les systèmes Ubuntu, vous pouvez utiliser la commande suivante pour installer :

$ sudo apt-get install php-curl

3. Développer une fonction de téléchargement asynchrone

  1. Créer un formulaire de téléchargement :
    Tout d'abord, nous devons fournir une interface permettant aux utilisateurs de sélectionner les fichiers à télécharger et soumettez une demande de téléchargement. Un formulaire simple peut être créé en HTML :
<form action="download.php" method="POST">
    <input type="checkbox" name="files[]" value="file1">
    <input type="checkbox" name="files[]" value="file2">
    <input type="checkbox" name="files[]" value="file3">
    <button type="submit">下载</button>
</form>
  1. Créez un script de traitement de téléchargement asynchrone :
    Ensuite, nous devons créer un script PHP pour gérer la demande de téléchargement. Dans le fichier download.php, nous pouvons utiliser la fonction curl_multi_init pour initialiser une conversation curl en traitement parallèle :
<?php
$files = $_POST['files']; // 获取用户选择的文件

$mh = curl_multi_init(); // 初始化curl多个句柄

foreach ($files as $file) {
    $ch = curl_init(); // 初始化curl句柄
    curl_setopt($ch, CURLOPT_URL, "http://example.com/files/$file"); // 设置要下载的文件URL
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); // 设置返回结果为字符串
    curl_multi_add_handle($mh, $ch); // 添加curl句柄到并行处理中
}

do {
    $status = curl_multi_exec($mh, $running); // 执行并行处理
} while ($status === CURLM_CALL_MULTI_PERFORM || $running);

foreach ($files as $file) {
    $ch = curl_multi_getcontent($ch); // 获取文件内容
    file_put_contents($file, $content); // 将文件内容写入本地文件
    curl_multi_remove_handle($mh, $ch); // 移除curl句柄
}

curl_multi_close($mh); // 关闭curl多句柄
?>
  1. Ajouter une barre de progression de téléchargement asynchrone :
    Afin d'offrir une meilleure expérience utilisateur, nous pouvons ajouter une barre de progression à la barre de l'interface utilisateur pour afficher la progression de chaque téléchargement de fichier. Ceci peut être réalisé en utilisant l'élément progress de HTML5 :
<progress id="progress" value="0" max="100"></progress>

En JavaScript, nous pouvons utiliser l'objet XMLHttpRequest pour obtenir la progression du téléchargement et mettre à jour la valeur de la barre de progression :

var progress = document.getElementById('progress');

var xhr = new XMLHttpRequest();

xhr.addEventListener('progress', function(e) {
    if (e.lengthComputable) {
        var percent = (e.loaded / e.total) * 100;
        progress.value = percent;
    }
});

xhr.open('GET', 'download.php', true);
xhr.send();

4. Résumé
Téléchargez plusieurs fichiers de manière asynchrone via PHP HTTP, nous pouvons grandement améliorer l'expérience utilisateur et accélérer les téléchargements de fichiers. Pendant le processus de développement, nous devons nous assurer que l'extension cURL a été installée dans l'environnement PHP et suivre les étapes pour créer le formulaire de téléchargement, le script de traitement de téléchargement asynchrone et ajouter une barre de progression du téléchargement. Avec le développement d'applications Web, l'amélioration de l'expérience utilisateur deviendra la priorité des développeurs, et la fonction de téléchargement HTTP asynchrone deviendra un outil important pour atteindre cet objectif. Amusons-nous à créer de meilleures interfaces utilisateur !

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