2017-06-04 85 views
1

我正在使用Node v6.10.2。我試圖用一個簡單的NodeJS程序來提供靜態元素。當我運行下面提到的代碼並轉到http://localhost:3000/時,我收到了。如何在沒有Express的情況下從節點服務器提供圖像?

enter image description here

的圖像不會在這裏得到恢復。但是當我去http://localhost:3000/img/logo.jpg,我得到的形象。我該如何解決這個問題?

這是服務器代碼

var http = require('http'); 
var fs = require('fs'); 

function serveStaticFile(res, path, contentType, responseCode) { 
    if(!responseCode) responseCode = 200; 

    // __dirname will resolve to the directory the executing script resides in. 
    // So if your script resides in /home/sites/app.js, __dirname will resolve 
    // to /home/sites. 

    console.log(__dirname + path); 

    fs.readFile(__dirname + path, function(err, data) { 
     if(err) { 
      res.writeHead(500, { 'Content-Type' : 'text/plain' }); 
      res.end('500 - Internal Error'); 
     } 
     else { 
      res.writeHead(responseCode, { 'Content-Type' : contentType }); 
      res.end(data); 
     } 
    }); 
} 

http.createServer(function (req, res) { 
    var path = req.url.replace(/\/?(?:\?.*)?$/, '').toLowerCase(); 
    switch(path) { 
     case '': 
      serveStaticFile(res, '/public/home.html', 'text/html'); 
      break; 
     case '/about': 
      serveStaticFile(res, '/public/about.html', 'text/html'); 
      break; 
     case '/img/logo.jpg': 
      serveStaticFile(res, '/public/img/logo.jpg', 'image/jpeg'); 
      break; 
     default: 
      serveStaticFile(res, '/public/404.html', 'text/html', 404); 
      break; 
    } 
}).listen(3000); 

console.log('Server started on localhost:3000; press Ctrl-C to terminate...'); 

這是HTML文件 - home.html的

<!DOCTYPE html> 
<html> 
<head> 
    <title>Home</title> 
</head> 
<body> 
    Welcome Home!!! 
    <img href="localhost:3000/img/logo.jpg" alt="logo"> 
</body> 
</html> 
+3

多德是' evilSnobu

+0

@evilSnobu也嘗試過。還是一樣。 – Shashank

+2

您錯過了圖片網址前面的'http://'。 –

回答

2

你缺少從img SRC的http://。我還會注意到,@Shashank指出你應該使用src而不是href

把所有這些組合起來:

<img src="http://localhost:3000/img/logo.jpg" alt="logo"> 
相關問題