"Echec réseau" lors du téléchargement d'une image dans une page en Php

09 déc. 2021, 21:13

Bonjour
Ma 1ère question sur ce forum, merci d'avance de votre indulgence.

Mon fichier php se nomme creeimage.php et il contient ceci :

<?php
  Création d'un fichier image dans le dossier en cours (c'est un logo personnalisé)
  initialisation de la variable $nomfichier, nom du fichier image précédent
?>
<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Votre logo</title>
    </head>
    <body>
        <h1>Création de votre logo </h1>
        <p>Faites un clic droit sur l'image ci-dessous </p>        
        <img src="<?php echo($nomfichier); ?>" download="<?php echo ($nomfichier); ?>" alt="logo personnalisé" >
    </body>
</html>

L'image est au format png ou jpg située dans le même dossier que le fichier php.
Le fichier image est tout à fait normal, si je le téléverse sur mon ordinateur, je peux l'ouvrir.
La page web ainsi envoyée au navigateur s'affiche bien, l'image est normale.
Le problème : Si on clique avec le bouton droit de la souris sur l'image puis 'Enregistrer sous', le nom du fichier apparait en bas de la fenêtre mais tout de suite après on peut voir en dessous "Echec - Erreur réseau".
A noter que si je clique sur l'image et que je sélectionne "Ouvrir l'image dans un nouvel onglet", l'image apparait et on peut alors la télécharger en cliquant sur "Enregistrer sous".
Ce pb se pose avec Chrome et Edge que j'ai sous la main.
J'ai l'impression que c'est un pb de header mais ...

09 déc. 2021, 22:23

Bonjour Michel D,

Bienvenue sur le forum.

Il semble que le problème soit plus lié au langage HTML qu'au langage PHP.

En reprenant ton code html et en remplacant le code php "<?php echo $nomfichier; ?>" par une image de test "logo.jpg", je n'arrive pas à reproduire ton problème.
Est-ce que tu rencontres le même problème sur d'autres sites ou uniquement sur cette page ?
Si c'est uniquement sur cette page, quel est la valeur de l'attribut src dans le code source html (clique droit dans le navigateur puis Afficher la page source) ?

L'attribut html download ne peut pas être utilisé sur une balise <img>, cet attribut doit être utilisé sur une balise <a> pour créer un lien qui propose à l'internaute de télécharger la cible du lien (la cible étant défini par l'attribut href de la balise <a>).
Avec l'attribut download, tu peux créer un lien à coté de l'image pour proposer le téléchargement, ou inclure l'image directement dans le lien pour proposer de la télécharger en cliquant dessus :

<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Votre logo</title>
    </head>
    <body>
        <h1>Création de votre logo </h1>

        <p>Cliquer sur le lien pour télécharger le logo</p>
        <img src="logo.jpg" alt="logo personnalisé">
        <a href="logo.jpg" download>Télécharger le logo</a>

        <hr>
        
        <p>Cliquer sur le le logo pour le télécharger</p>
        <a href="logo.jpg" download title="Télécharger le logo">
            <img src="logo.jpg" alt="logo personnalisé">
        </a>
    </body>
</html>

09 déc. 2021, 23:42

Merci de votre soutien

"En reprenant ton code html et en remplacant le code php "<?php echo $nomfichier; ?>" par une image de test "logo.jpg", je n'arrive pas à reproduire ton problème."
-> Je m'en doute car ce que j'obtiens sur le navigateur en demandant à voir le code source, je me rends compte qu'il n'y a aucun pb.

"Est-ce que tu rencontres le même problème sur d'autres sites ou uniquement sur cette page ?"
-> Je n'ai pas essayé je n'ai ce besoin qu'à un seul endroit

"quelle est la valeur de l'attribut src dans le code source html"
-> Voici le code source, je ne vois rien d'anormal.


<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <meta name="description" content = "Outil de construction de votre logo professionnel personnalisé" >
        <title>Votre logo</title>
    </head>
    <body>
        <h1>Création de votre logo personnalisé</h1>
        <p>Faites un clic droit sur l'image ci-dessous puis sélectionner 'Enregistrer sous' ou 'Enregistrer l'image sous'<br>
            Saisir ensuite l'emplacement et le lieu d'enregistrement de l'image sur votre ordinateur.
        </p>        
        <img src="nomlogomichel.PNG" alt="logo personnalisé" >
    </body>
</html>

"L'attribut html download ne peut pas être utilisé sur une balise <img>"
-> ok j'ai enlevé

"Avec l'attribut download, tu peux créer un lien à coté de l'image pour proposer le téléchargement, ou inclure l'image directement dans le lien pour proposer de la télécharger en cliquant dessus "
-> c'est possible mais ça me plait moins car je voulais montrer l'image dans un contexte, dans mon cas, il y a un peu de texte avant, ça donne une idée des proportions de l'image.

Est-ce que cela pourrait provenir des options du dossier contenant les pages ? j'en doute puisque si on clique droit sur l'image puis "ouvrir dans un nouvel onglet", l'image s'affiche bien et surtout je peux faire un clic droit puis Enregister l'image (pas d'erreur). Ce n'est donc pas l'image qui est en cause, en plus c'est pareil sur Edge et chrome

Est-ce que lorsqu'on produit du HTML avec du php, il faut indiquer le contenu de la zone header d'une autre manière qu'avec les balises traditionnelles ?

Je ne vois pas ce que je peux tester d'autre ...

10 déc. 2021, 13:45

Non le fait que le HTML soit généré avec du PHP ou un autre langage serveur ne devrait normalement pas avoir d'impact sur le comportement du code html coté client sur le navigateur.

A tester : est-ce que le problème est présent sur d'autres site (par exemple clic droit -> enregistrer sous fonctionne t-il sur le logo PHPFrance en haut de cette page ) ?
-> Si le problème se présente sur d'autres sites, le problème semble donc être lié à ton poste. Peut-être un paramètre de sécurité dans Windows ou dans les navigateurs qui pourrait expliquer ce blocage (même si il semble étonnant que ca fonctionne en passant pas "ouvrir dans un nouvel onglet").
Au hasard après une recherche rapide : https://blog.itgs-solutions.ch/correcti ... le-chrome/
-> Si le problème se présente uniquement sur ta page, le problème semble donc venir du document html et/ou de l'image.
Dans ce cas il faudrait faire d'autres tests afin de cibler par élimination la cause du problème : tester avec une autre image dans le même document html, tester avec la même image mais dans un autre fichier html minimaliste, tester avec une autre image dans un autre fichier html.

Peut-être faire des tests avec d'autres navigateurs (Firefox, Opéra, Safari...) ?
Si possible, peut-être également faire des tests depuis un autre poste et/ou depuis d'autres appareils (smartphone, tablette, TV connecté...).

10 déc. 2021, 19:36

J'ai testé avec PhpFrance et c'est ok.
J'ai testé avec un autre ordi et avec Chrome ou Edge : Le pb est toujours là, c'est donc bien la construction de ma page.
J'ai testé avec une image que j'ai déposée avec Filezilla : le pb est toujours là donc le pb ne vient pas de l'image.
J'ai essayé de réduire encore le fichier HTML produit mais difficile de faire plus simple que le mien non ?

J'ai un indice : Quand je clique sur 'Enregistrer Sous', le nom du fichier image apparaît en bas de la fenêtre de Chrome, une fenêtre s'affiche me demandant où l'enregistrer et pendant ce temps, un zigzag vert sur le nom du fichier subsiste, comme si le fichier était très long à charger (alors qu'il est ridicule).
Si par contre j'ouvre l'image dans un autre onglet et que je clique sur Enregistrer sous, le zigzag vert n'apparait pas.
Je suis de plus en plus convaincu que c'est un pb de transaction, comme si la page envoyée à mon navigateur était incomplète, comme si le navigateur attendait quelque chose de plus, comme s'il ne reconnaissait pas ma page web.
N'y aurait-il pas un header à mettre quelque part ? ou ne faut-il pas préciser des meta particuliers dans la page html produite ?
Merci encore

10 déc. 2021, 20:39

Et j'ai un autre indice : Si je demande à voir le source de la page que le php a généré, que je sélectionne le tout, je le copie, je recrée un fichier html en collant . Je dépose ce fichier dans mon dossier sur le serveur. Si j'appelle cette page directement http:... , c'est bon, je peux sauvegarder l'image ...
Je ne sais pas quelle est la conclusion à en tirer mais ça me semble être un bon indice.

11 déc. 2021, 11:48

D'après les tests le problème semble bien venir de ton fichier source.
Est-ce que tu pourrais partager ce fichier (avec un site comme cjoint.com par exemple) ?

Pas trop de rapport, mais peut-être un problème sur l'encodage du fichier source si celui-ci n'est pas en UTF8 sans BOM ?

Je ne vois pas quelle meta html pourrait avoir un impact à ce sujet, d'autant plus que le problème ne se présente pas lorsque tu copies uniquement le code html dans un autre fichier donc le problème ne semble pas venir de là.

Du coté des entêtes HTTP avec la fonction php header(), je ne vois pas non plus quelle entêtes pourrait causer ou corriger ce bug. Les entêtes HTTP sont normalement gérées par le serveur web (Apache ou autre).
Si on utilise la fonction php header() dans le fichier source qui génère le html, on pourrais modifier les entêtes HTTP de la requête correspondant au chargement de la page (c-a-d la requête qui cible la page html/php lorsqu'on saisie l'URL de la page dans la barre d'adresse du navigateur).
Néanmoins, lorsqu'on fait "clic droit -> enregistrer sous" dans le navigateur, il s'agit alors d'une autre requête HTTP qui cible directement l'image défini dans l'attribut src sans passer par un fichier php. La fonction php header() ne pourra donc pas être utilisée pour cette requête.

Peut-être regarder dans la console du navigateur et/ou dans les outils de développement du navigateur pour voir si tu trouves plus de détails sur l'erreur réseau rencontrée ?
Peut-être aussi regarder dans les logs du serveur web si le problème ne viendrait pas du serveur qui ne comprend pas ou ne gère pas correctement la requête de téléchargement vers l'image ?

11 déc. 2021, 15:10

Je vous remercie de vos efforts, voici ce que j'ai testé dans un premier temps :

<?php
header("Content-type: image/png;charset=utf-8");
... création du fichier image sur le serveur ...
?>

et c'est tout. Quand j'appelle ce fichier php, une page web s'affiche avec uniquement mon image et là on peut télécharger l'image par un "Enregistrer sous". Il va falloir que je potasse le truc parce que je ne comprends même pas que cela puisse être accepté, encore beaucoup de mystère.

Le problème est que je voulais que l'on puisse visualiser l'image dans un contexte, avec du texte avant et après.
Donc j'ai suivi les conseils de ynx, à savoir montrer l'image et ajouter un lien hypertexte permettant le téléchargement.

<?php        
    ...création du fichier...
function ilestpret($nomfic) {    
    if (file_exists($nomfic)) {
        echo "<p><a href=$nomfic download=logoperso.jpg>";
        echo "<img src=$nomfic alt=logo personnalisé></a></p>";
        echo "<p>Si celui-ci vous convient, il ne vous reste plus qu'à le <a href=$nomfic download=logoperso.jpg>télécharger";
        echo "</a></p>";        
    }
    else {
        echo "Fichier $nomfic n'a pas été trouvé";        
    }
}

?>

<!DOCTYPE html>
<html lang="fr">
	<head>
	<meta charset="utf-8">
        <title>Votre logo</title>
    </head>
    <body>
        <h1>Création de votre logo</h1>
        <p>Voici votre logo</p>
        <?php ilestpret($nomfichier); ?>
    </body>
</html>

Le problème de départ reste sans explication, mais je l'ai contourné. Comme j'y ai passé beaucoup de temps, trop de temps, j'arrête mes recherches.
Merci encore

"Echec réseau" lors du téléchargement d'une image dans une page en Php

Qui est en ligne