javascript - 我的第一个 Node.js 服务器:加载资源失败:net::ERR_INCOMPLETE_CHUNKED_ENCODING

Question

以下服务器应该:

案例 #1:如果请求是 http://localhost:8080

，则提供 mysitename.html

CASE #2:如果请求是，则提供相关文件http://localhost:8080/mysitename.html

案例 #3 如果请求是 http://localhost:8080/contactform?name=..&..&...etc.

如果我访问 http://localhost:8080/mysitename.html 一切正常。加载 mysitename.html，然后通过它加载所有后续内容(.js、.css、.png 等)。

问题: 但是，如果我访问 http://localhost:8080，会发生以下情况:

• 我在浏览器 (Chrome) 控制台上收到加载资源失败:net::ERR_INCOMPLETE_CHUNKED_ENCODING错误。
• `mysitename.html' 在客户端上出现损坏。部分 DOM 丢失，当我尝试查看源页面时，它只是挂起而从未真正加载。鉴于此文件的所有 DOM 元素都是静态/硬编码的，因此仅加载部分 DOM 很奇怪。
• 令人困惑的是，其余内容(.js、.css 等)已加载，但由于 .html 已损坏，实际上什么也没有显示。 CASE#1 是否可能被紧随其后的 CASE#2 打断？我究竟做错了什么？

CASE#2 最初有一个错误导致了 Johnny Estilles 发现的无限循环(参见下面他的回答)。此问题已得到修复，但现在出现了上述问题。

server.js

// setting up email handler
var nodemailer = require('nodemailer');
var emailHandlerService = 'Gmail';
var emailHandlerAddress = ******;
var emailHandlerPassword = ******;
var transporter = nodemailer.createTransport({
    service: emailHandlerService,
    auth: {
        user: emailHandlerAddress,
        pass: emailHandlerPassword
    }
});

// setting up http server
var http = require('http');
var fs = require('fs');
var url = require("url");
var path = require("path");
var rootDir = __dirname + "/public";

var mimeTypes = {
    "html": "text/html",
    "jpeg": "image/jpeg",
    "jpg": "image/jpeg",
    "png": "image/png",

    /* Even though the js mime type is set as well, scripts are still sent 
    as "text/plain" according to the Chrome console. Why is that ? */
    "js": "application/javascript",

    "css": "text/css",
    "ico": "image/ico"
};

// initializing server
var httpServer = http.createServer(function (request, response)
{
    // CASE #1
    // if the user is on http://localhost:8080, load public/mysitename.html
    if (request.url === "/")
    {
        fs.readFile('public/mysitename.html', function (err, html) 
        {
            if (err)
            {
                response.writeHead(200, {'Content-Type': 'text/plain'});
                response.write('404 Not Found\n');
                throw (err);
            }
            else
            {
                response.writeHeader(200, {"Content-Type": "text/html"});  
                response.write(html); 
            }
        });
    }




    // CASE #2
    // else if this is a contact form data request
    // forward the data to my email (I'll make a more precise Regex for the request)

    else if (/contactform/.test(request.url))
    {
        var parsedURL = url.parse(request.url, true);
        var name  = parsedURL.query.name;
        var email  = parsedURL.query.email;
        var subject  = parsedURL.query.subject;
        var enquiry  = parsedURL.query.enquiry;
        var browser = parsedURL.query.browsername + " " + 
                      parsedURL.query.browserversion;

        transporter.sendMail({
            from: emailHandlerAddress,
            to: emailHandlerAddress,
            subject: subject,
            text: "|| NAME = " + name + " || EMAIL = " + 
                   email + " || BROWSER = "  + browser + " || DEVICE = " + 
                   parsedURL.query.device + " || ENQUIRY = " + enquiry
        });

        response.end(JSON.stringify(parsedURL.query));
    }




    // CASE #3
    // if none of the above is true then this is a request to serve static files
    else
    {
        var pathname = url.parse(request.url).pathname;
        var filename = path.join(rootDir, pathname);

        fs.exists(filename, function (exists) 
        {
            if (!exists) 
            {
                fs.readFile('public/404.html', function (err, html) 
                {
                    if (err)
                    {
                        response.writeHead(200, {'Content-Type': 'text/plain'});
                        response.write('404 Not Found\n');
                        throw (err);
                    }
                    else
                    {
                        response.writeHeader(200, {"Content-Type": "text/html"});  
                        response.write(html); 
                    }
                    response.end();
                });
            }
            else
            {
                    var requestedFileExtension = path.extname(filename).split(".")[1];
                var mimeType = mimeTypes[requestedFileExtension] || 'text/plain';

                // as I noted above, this doesn't seem to have any effect 
                // for my .js files
                response.writeHead(200, mimeType);

                var fileStream = fs.createReadStream(filename);
                fileStream.pipe(response);
            }
        });
    }
}).listen(8080);

Answer 1

修复问题 #1:无限循环

您在初始 if() 中缺少一个(或两个)等号。

改变

if (request.url = "/")

到

if (request.url == "/")

or 

if (request.url === "/")

修复问题 #2:无法加载资源:net::ERR_INCOMPLETE_CHUNKED_ENCODING

您在案例 #1 中缺少 response.end()。

// CASE #1
// if the user is on http://localhost:8080, load public/mysitename.html
if (request.url === "/")
{
    fs.readFile('public/mysitename.html', function (err, html) 
    {
        if (err)
        {
            response.writeHead(200, {'Content-Type': 'text/plain'});
            response.write('404 Not Found\n');
            throw (err);
        }
        else
        {
            response.writeHeader(200, {"Content-Type": "text/html"});  
            response.write(html); 
        }
        response.end(); // <-- MISSING
    });
}