Question

我正在尝试动态加载3个html文件：header.html，search.html和footer.html

我有一个render.js文件，可以读取view目录中的html文件。

var fs = require('fs');

function view(templateName, values, response) {
    var content = fs.readFileSync('./views/' + templateName + '.html');

    response.write(content);
}

module.exports.view = view;

然后在我的router.js我通过view方法调用html文件

var Profile = require("./profile");
var render = require('./render');

function home(request, response) {
    if(request.url === '/') {
        response.writeHead(200, {'Content-Type': 'text/plain'});
        render.view('header', {}, response);
        render.view('search', {}, response);
        render.view('footer', {}, response);
    }
}

这是启动服务器的app.js

var http = require('http');
var router = require('./router');

http.createServer(function(request, response) {
    router.home(request, response);
    router.user(request, response);
}).listen(3000);
console.log('Server is running at localhost:3000');

问题是，Node JS服务器正在冻结，并且在开发人员的网络选项卡中，它在状态列中显示为pending。

这是我在网页上遇到的错误。

localhost页面无效

localhost意外关闭了连接。

ERR_INCOMPLETE_CHUNKED_ENCODING

但是，如果我将render.view的{{1}}行替换为普通footer，那么页面加载正常。我可以看到response.end('Footer');和header.html的html内容，最后是search.html一词。

如果我完全删除第三行，则页面根本不会加载并返回初始错误。如果我只用1行试试它，它也会冻结。

不知道造成这种情况的原因。

html文件非常简单，这是Footer

header.html

这是<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Treehouse Profile</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="../../assets/css/teamtreehouse.css"> </head> <body>

search.html

这是<img src="../../assets/img/search.png" alt="Magnifying Glass" id="searchIcon"> <form action="/" method="POST"> <input type="text" placeholder="Enter a Treehouse username" id="username" name="username"> <input type="submit" value="search" class="button"> </form>

footer.html

Answer 1

只需添加response.end（）最后

节点JS服务器在动态加载HTML文件时冻结

1 个答案: