IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

NodeJS Discussion :

Comment afficher deux images avec Node js ?


Sujet :

NodeJS

  1. #1
    Membre confirmé

    Profil pro
    Inscrit en
    Août 2008
    Messages
    1 191
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2008
    Messages : 1 191
    Points : 595
    Points
    595
    Par défaut Comment afficher deux images avec Node js ?
    Bonjour,
    je souhaite afficher 2 images mais la 2 ème firefox ne le trouve pas

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
     
    var http = require('http');
    var fs = require('fs');
    var ok = fs.readFileSync('ok.png');
    var no = fs.readFileSync('no.png');
     
    http.createServer(function(request, response) {
      if(request.url.indexOf('ok.png')<0) {
          response.writeHead(200, {"Content-Type": "text/html"});
          response.write('voici une image : <br/> <img src="ok.png"> <img src="no.png">  ');
          response.end();
      }
      else
      {
         response.writeHead(200, {"Content-Type": "image/png"});
         response.write(ok,no);
         response.end();
      }
    }).listen(8811);
    Comment je dois procéder ?
    il y at'il une façon plus simple de le faire ?
    merci d'avance de la réponse.

  2. #2
    Membre actif

    Profil pro
    Inscrit en
    Juillet 2012
    Messages
    183
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2012
    Messages : 183
    Points : 274
    Points
    274
    Par défaut
    Que valent les variables ok et no ?

  3. #3
    Expert éminent
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 093
    Points : 6 754
    Points
    6 754
    Par défaut
    Citation Envoyé par keokaz Voir le message
    Bonjour,
    je souhaite afficher 2 images mais la 2 ème firefox ne le trouve pas
    J'ai envie de dire RTFM (pardon ) : http://nodejs.org/api/http.html#http...chunk_encoding

    Le second paramètre de response.write c'est l'encodage. Tu peux concaténer avec + ou alors envoyer la seconde image dans un autre write.
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

  4. #4
    Membre confirmé

    Profil pro
    Inscrit en
    Août 2008
    Messages
    1 191
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2008
    Messages : 1 191
    Points : 595
    Points
    595
    Par défaut
    merci des réponse
    j'ai essayer ceci

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    var http = require('http');
    var fs = require('fs');
    var ok = fs.readFileSync('ok.png');
    var no = fs.readFileSync('no.png');
     
    http.createServer(function(request, response) {
          response.writeHead(200, {"Content-Type": "image/png"});
          response.write(ok);
          response.write(no);
          response.write(no+ok);
          response.end();
    }).listen(8811);
    je n'ai qu'une seul image ?

  5. #5
    Expert éminent
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 093
    Points : 6 754
    Points
    6 754
    Par défaut
    Ah désolé, j'ai lu ton code trop vite.

    Ma réponse précédente reste valable : tu ne peux pas envoyer deux images avec le même write. En fait c'est même pire que ça : tu ne peux pas envoyer deux fichiers dans une seule réponse HTTP.

    C'est tes premières armes avec Node pas vrai ? Je vois que tu as déjà un début d'algorithme de routage, c'est-à-dire d'appel à telle ou telle partie du script en fonction de l'adresse demandée. Il faut simplement que distingues les cas ok.png et no.png. Pour t'aider je te conseille d'utiliser le module URL et sa méthode parse.

    Quant à la raison pour laquelle ton code actuel ne permet pas de voir les deux images, je ne suis pas sûr mais j'avance une hypothèse : il est possible que readFile/readFileSync place un marqueur de fin de fichier (octet EOF) à la fin du tampon, et que write ne prenne pas en compte les données arrivant après ce marqueur. Ou bien une information sur la taille du fichier est transmise, ce qui conduit au même résultat.

    Ce qu'il faut retenir, c'est qu'avec HTTP, il y a une correspondance 1 fichier = 1 requête.

    Pour progresser : Des cours et tutoriels pour apprendre Node.js :https://nodejs.developpez.com/cours/ à commencer par Node.js : le livre du débutant : https://nodejs.developpez.com/tutori...ivre-debutant/
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

  6. #6
    Membre confirmé

    Profil pro
    Inscrit en
    Août 2008
    Messages
    1 191
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2008
    Messages : 1 191
    Points : 595
    Points
    595
    Par défaut
    oui en effet je débute ...
    j'ai pu afficher mes 2 images

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    var express = require('express');
    var fs = require('fs');
    var path = require('path');
    var app = express();
    app.use(express.static(__dirname + '/public'));
    app.set('view engine','ejs');
    app.set('views',path.join(__dirname,'vue'));
     
    app.get('/',function(req,res){
      res.render('img');
    });
     
    app.listen(8811);

    et mon fichier ejs

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    <!doctype html>
    <html lang="fr>
    <head>
    <meta charset ="utf-8">
    <title>première application avec node js</title>
    <link rel="stylesheet" type="text/css" href="/automat.css">
    </head>
    <body>
    <h1>automat</h1>
     
    <a>icone ok</a>
    <img src="/ok.png">
    <a>icone no</a>
    <img src="/no.png">
    </body>
    </html>


    Maintenant je n'arrive pas à charger le css, je l'ai mis dans

    /vue/automat.css

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. comment combiner deux images avec WIA
    Par blondelle dans le forum C++Builder
    Réponses: 0
    Dernier message: 22/05/2009, 14h33
  2. comment afficher une image avec j2me
    Par jenimed dans le forum Java ME
    Réponses: 2
    Dernier message: 16/05/2009, 20h07
  3. Comment afficher les images avec firefox ?
    Par 12monkeys dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 23/11/2006, 20h59
  4. PL/SQL - Comment afficher une image avec HTP ?
    Par patmaba dans le forum PL/SQL
    Réponses: 2
    Dernier message: 08/07/2004, 09h28

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo