Comment créer des miniatures réactives à partir d'images téléchargées tout en conservant la qualité d'origine ?

Susan Sarandon
Libérer: 2024-11-06 21:10:03
original
233 Les gens l'ont consulté

How to Create Responsive Thumbnails from Uploaded Images While Maintaining Original Quality?

Création de miniatures réactives à partir d'images téléchargées

Lorsque vous travaillez avec des images téléchargées par les utilisateurs, la création de miniatures réactives est cruciale pour améliorer l'expérience utilisateur et maintenir les performances du site. Ce guide relève le défi de générer des vignettes tout en préservant la qualité de l'image d'origine.

Générer des vignettes avec PHP

PHP fournit une gamme de fonctions de manipulation d'images, notamment imagecopyresized(). Pour créer une vignette à partir d'une image téléchargée, suivez ces étapes :

  1. Récupérez l'image originale : Utilisez getimagesize() pour obtenir les dimensions et le type MIME de l'image originale.
  2. Calculez les dimensions de la vignette : Déterminez la taille de la vignette souhaitée (par exemple, 100 x 100 pixels).
  3. Créez une nouvelle ressource d'image : Établissez une nouvelle ressource d'image à l'aide de imagecreatetruecolor ().
  4. Redimensionnez l'image : Utilisez imagecopyresized() pour redimensionner l'image originale afin de l'adapter aux dimensions de la vignette.
  5. Enregistrez la vignette : Utilisez imagejpeg() ou imagepng() pour enregistrer la vignette à l'emplacement souhaité.

Préserver la qualité de l'image d'origine

Pour conserver la qualité de l'image d'origine, utilisez un paramètre $quality plus élevé dans imagejpeg() ou imagepng(). Ce paramètre va de 0 à 100, avec une valeur plus élevée indiquant une meilleure qualité.

Utilisation d'ImageMagick

ImageMagick est une bibliothèque de manipulation d'images plus robuste. S'il est installé sur votre serveur, vous pouvez tirer parti de sa classe Imagick pour générer des vignettes :

  1. Installer ImageMagick : Assurez-vous qu'ImageMagick est installé sur votre serveur.
  2. Créer un objet Imagick : Instancier un objet Imagick en utilisant le chemin de l'image d'origine.
  3. Définir les propriétés de l'image : Configurer le format, la compression et la qualité de l'image à l'aide de méthodes de classe.
  4. Redimensionnez l'image : Utilisez thumbnailImage() pour redimensionner l'image.
  5. Enregistrez la vignette : Utilisez file_put_contents() pour écrire l'image redimensionnée dans un nouveau fichier .

Exemple de code avec création de vignettes

Voici un exemple de fichier imageupload.php modifié pour inclure la génération de vignettes :

...
if(isset($_FILES['image_data'])){
       if(is_uploaded_file($_FILES['image_data']['tmp_name'])) {

            // Original image processing
            $imgData =addslashes (file_get_contents($_FILES['image_data']['tmp_name']));

            // Thumbnail generation
            if (generateThumbnail($_FILES['image_data']['tmp_name'], 100, 100, 90)) {
                $thumbData = addslashes (file_get_contents($_FILES['image_data']['tmp_name'] . '_thumb.jpg'));

                // Insert original and thumbnail images into the database
                $sql = "UPDATE users SET user_pic='".$imgData."', user_pic_small='".$thumbData."' WHERE>
Copier après la connexion

Ce code utilise generateThumbnail() pour créez une vignette de dimensions 100x100 et d'une qualité de 90%. La vignette est ensuite enregistrée avec un suffixe "_thumb.jpg".

En mettant en œuvre ces techniques, vous pouvez réaliser à la fois la création de vignettes réactives et la préservation de la qualité d'image originale.

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal