web.js文件：
const fs = require("fs");
const hostname = "127.0.0.1";
const port = 3000;
fs.readFile("index.html", (err, html) => {
if(err){
throw err;
}
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader("Content-type", "text/html");
res.write(html);
res.end();
});
server.listen(port, hostname, () => {
console.log("Server started on: " + hostname + ":" + port);
})
});
index.html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="picture1">
<img src="image.jpg" alt="image">
</div>
</body>
</html>
即使我给img src我的完整路径，网站也永远不会加载图像。只有当我给它一个到网站上托管的图像的直接链接时，才会加载图像。
有办法解决这个问题吗？我还需要访问本地单独的js文件。
您的index.html除了html内容本身之外，还由多个资源组成。这些可以是图像、javascript文件等。浏览器将为这些资源中的每一个单独调用服务器。你可以通过放一个console.log并打印一些类似req.url.的东西来确认这一点
根据你的问题，看起来你只需要一个调用(返回index.html(，读取本地可用的所有内容，无论是图像还是js文件，并一次性返回所有内容。这不会像上面解释的那样奏效。这种逻辑存在于浏览器中，它会单独调用并整理所有内容。
因此，您需要使代码能够处理对不同资源的调用。目前，在您的代码中，无论浏览器要求什么，您都会返回index.html。
看看我刚刚在机器上试过的这个样品。这是非常初级的，但希望它能帮助你理解我想要传达的内容。
var http = require('http');
var fs = require('fs');
http.createServer(function (req, res) {
console.log("request url is:" + req.url);
var filename = req.url.substring(1);
console.log("old filename is:" + filename);
if (!filename) {
console.log('inside if');
filename = 'index.html';
}
console.log("new filename is:" + filename);
//Open a file on the server and return its content:
fs.readFile(filename, function(err, data) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.write(data);
return res.end();
});
}).listen(3000);
请注意，这可能不是实现您正在尝试的目标的最佳方式，但我正在努力了解您是如何思考或进行的，并在此基础上提供解释和答案。