Image qui ne se charge pas

Version imprimable

Bonjour,
Je suis débutant en développement web,et j'essaye d'afficher dynamiquement une page web tout simple composé d'un texte,d'une image d'arriere plan et un gif par dessus.
J'ai écrit cette page en html et elle marche trés bien,mais quand je la génére via du javaScript et nodeJS,la page qui se charge n'affiche pas l'image...
pourquoi?problème de chemin d’accès depuis localHost?
Voici mon code js:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
var http = require('http');
var server = http.createServer(function(req, res) {
    res.writeHead(200, {"Content-Type": "text/html"});
    res.write('<!DOCTYPE html>'+
	'<html>'+
	   ' <head>'+
	        '<meta charset="utf-8" />'+
	         '<style>'+
	         ' body {'+
	           ' color:black;'+
	           'background-color:white;'+
	          '  background-image:url(\"backgroundVIT.png\");'+
	           ' background-repeat:no-repeat;'+
	           ' background-position:center center;'+
	           ' background-attachment:fixed;'+
	           ' } 	'+
	       ' IMG.loader {'+
	        '    display: block;'+
	         '   margin-left: auto;'+
	          '  margin-right: auto }'+
	    	'	h1'+
	    '		{'+
	   ' 		    font-weight: bold;'+
	   ' 		    text-align:center;'+
	'		    }'+
	  '      </style>'+
	   '     <title>IT-SHOW</title>'+
	 '   </head>'+
	'    <body>'+
	   ' 	<h1> APPLICATION LOAD...</h1>'+
	  '   <IMG class="loader" src="loader2.gif" >'+
	  '    </body> '+
	'</html>'
);
 
    res.end();
 
});
 
server.listen(8080);

01/08/2016, 15h50
sekaijin

ouvre ton navigateur
affiche la source de la page (dans le navigateur)
compare le HTML reçu par le navigateur avec le fichier statique qui marche

A+JYT
01/08/2016, 15h53
CoreDumpedped

je l'ai fait,il me génère la bonne page html, si je l’exécute comme sa,la page s'affiche correctement...
02/08/2016, 10h49
melka one

jour

indique le repertoire ou se trouve l'image
02/08/2016, 12h04
CoreDumpedped

Bonjour,
l'image se trouve dans le même répertoire que ma page web.
j'ai essayé avec ./image.png ainsi que le chemin complet:

background-image:url("C:/Users/remi/Pictures/BackGround.png");

Aucun des deux fonctionnes...
Une idée?
02/08/2016, 16h02
melka one
on peut toujour convertir l'image en base 64
Code:

1 2 3 var fs = require('fs'); var image = fs.readFileSync('/loader2.gif'); var encondedImage = new Buffer(image).toString('base64');
Code:

'<img class="loader" src="data:image/jpeg;base64,'+encondedImage+'" >'+

mais il y a peut etre plus simple
02/08/2016, 16h08
NoSmoking

Bonjour,
as tu essayé d'utiliser __dirname ?

https://nodejs.org/api/globals.html#globals_dirname