Question

免责声明：我是node.js的新手，所以我认为这个问题有一个非常基本的答案。

我正在 Windows 上使用 node.js 和 http 模块来生成一个静态页面，其中包含从js文件生成的内容。 / p>

服务器文件（server.js）：

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

fs.readFile('./index.html', function (err, html) {
    if (err) {
        throw err;
    }
    http.createServer(function(request, response) {
        response.writeHeader(200, {"Content-Type": "text/html"});
        response.write(html);
        response.end();
    }).listen(8080);
});

HTML文件（index.html）：

<!DOCTYPE html>
<html>

<body>

<div id="div1">
  <p id="p1">This is a static paragraph.</p>
</div>

<p>
  <script type="text/javascript" src="start.js"></script>
</p>

</body>
</html>

JS文件（start.js）

var para = document.createElement("p");
var node = document.createTextNode("This text is loaded from a js file.");
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);

直接加载 index.html 时，得到以下输出：

这是一个静态段落。

此文本是从js文件加载的。

^^这是我想要的输出。

问题：但是，当我使用 node.js 并运行 server.js 时， start.js >内容未加载。我得到：

这是一个静态段落。

任何帮助将不胜感激。

仅供参考，我的文件夹结构

/
- node_modules
-- http
-- fs
- index.html
- server.js
- start.js

Answer 1

您添加子节点的逻辑似乎还可以。

我认为您应该尝试将src="start.js"更改为src="./start.js"或src="/start.js"只是为了确保您正确引用了该路径。在您的console.log()中添加一个start.js语句，以确保它已被加载。

编辑：确保将文件托管在服务器上。您可以添加诸如express或connect之类的内容来帮助您。

要使用connect，请在项目目录中运行npm install --save connect。

var connect = require('connect'),
directory = '/path/to/Folder'; // probably just '/' for all your files

connect()
  .use(connect.static(directory))
  .listen(80);

console.log('Listening on port 80.');

Refer to their docs，以获取完整说明和使用http的更多示例。

Answer 2

我认为它找不到js，在引用js之前，请确保它在服务器上并且可以从服务器加载它，例如：'http://127.0.0.1:8000/start.js'。我们所有的静态文件（例如img，css，js）都应放在服务器上，然后才会引用。

Answer 3

您为文件获取的每个请求URL都必须由节点服务器处理。我建议使用Express.js，因为这样可以轻松处理不同的url路径，并且可以直接提供文件。但是，如果您想要基于纯node.js的实现，请检查以下代码。

要从服务器提供文件，您必须将server.js修改为以下内容：

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

http.createServer(function(request, response) {
    if(request.url=='/'){
        fs.readFile('./index.html', function (err, html) {
             if (err) {
                  res.send(500,{error: err});
             }
             response.writeHeader(200, {"Content-Type": "text/html"});
             response.write(html);
             response.end();
        });
    } else if(request.url=='/start.js'){
        fs.readFile('./start.js', function (err, jsFile) {
             if (err) {
                  res.send(500,{error: err});
             }
             response.writeHeader(200, {"Content-Type": "text/javascript"});
             response.write(jsFile);
             response.end();
        });
    }

}).listen(8080);

希望这会有所帮助：）

JavaScript无法载入HTML文件-nodejs + http

3 个答案: