0

因此,我使用 Node.js 将以下 HTML 发送到了我的浏览器:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <form action="/upload" method="post">
        <textarea name="text" rows="20" cols="60"></textarea>
        <input type="submit" value="Submit text" />
    </form>
</body>
</html>

但是浏览器显示的是一个完全白色的空白页面。然而,当我查看源代码时,我看到的正是您在上面看到的内容,我只是从 Chrome 的“查看源代码”实用程序中复制并粘贴了这些内容。为什么 Chrome 将该 HTML 呈现为空白页面?我在下面有一个截图。

这是我用来将 HTML 发送到浏览器的 Node.js 代码:

function start(response) {
    console.log("Request handler 'start' was called.");
    var body = '<!DOCTYPE html>\n'+
               '<html>\n'+
               '<head>\n'+
               '    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />\n'+
               '</head>\n'+
               '<body>\n'+
               '    <form action="/upload" method="post">\n'+
               '        <textarea name="text" rows="20" cols="60"></textarea>\n'+
               '        <input type="submit" value="Submit text" />\n'+
               '    </form>\n'+
               '</body>\n'+
               '</html>\n';

    response.writeHead(200, {"Content-Type": "text/html"});
    response.write(body);
    response.end();
}

空白页——尽管 Chrome 可以向我展示很好的 HTML...

====================================

这是作为对原始帖子的编辑所包含的答案,因为该主题已关闭(不幸的是,未回答的主题可以被海报以外的其他人关闭)。无论如何,以防万一原始发布者遵循此问题,我研究了这个问题,因为我遇到了完全相同的问题,没有人回答他的问题,我发现了解决方案:

我刚刚解决了将代码片段从 Kindle 书复制到您选择的文本/源代码编辑器的问题。在 stackoverflow.com 上的一篇题为“为什么 Chrome 将这个 HTML 呈现为一个完全空白的页面?来自 Node.js,遵循 Node Beginner Book [关闭]”的帖子中讨论了相同的主题。该特定帖子描述了我遇到的完全相同的问题(相同的 Kindle 书,相同的代码片段,相同的代码症状!)。不幸的是,在任何受访者能够提供确切答案之前,该帖子已过早关闭,否则我会回复该帖子。

然而,我更深入地研究了这个问题,并在从 Kindle 书籍复制代码片段时发现了问题的根本原因:当您从 Kindle 应用程序复制文本时,它使用十六进制代码 0xA0 来表示空格字符,而不是 0x20。十六进制代码 0xA0 是不间断空格的扩展 ASCII。好吧,当您期望复制和粘贴 HTML 文字字符串时,这不起作用,就像上述帖子中的情况一样。

因此,这解释了上述帖子中的行为:原始发布者表示他可以通过手动重新输入所有文本来解决问题。这是因为手动重新输入使用了正确的 0x20。

这还有其他一些我起初不理解但现在解释的症状:我的文本编辑器(Notepad++)没有正确识别我的源代码中的保留关键字。同样,这是因为关键字由 0xA0 分隔,而不是 0x20。Notepad++ 中的关键字解析器必须对 0x20 进行标记。

解决方案:从 Kindle 粘贴文本后,在源代码编辑器中使用正则表达式搜索功能执行搜索和替换。搜索正则表达式 \xA0 并将其替换为 \x20 (或者,根据您的编辑器,只需在“替换”字段中输入一个空格键字符 [这就是 Notepad++ 的工作方式])。

4

3 回答 3

2

使用来自nodejs.org的服务器示例代码,您的 html 在 Chrome 版本 23.0.1271.64 中运行良好:

var http = require('http');
http.createServer(function (req, res) {
  var body = '<!DOCTYPE html>\n'+
         '<html>\n'+
         '<head>\n'+
         '    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />\n'+
         '</head>\n'+
         '<body>\n'+
         '    <form action="/upload" method="post">\n'+
         '        <textarea name="text" rows="20" cols="60"></textarea>\n'+
         '        <input type="submit" value="Submit text" />\n'+
         '    </form>\n'+
         '</body>\n'+
         '</html>\n';
  res.writeHead(200, {'Content-Type': 'text/html'});
  res.write(body);
  res.end();
}).listen(3000, '127.0.0.1');
console.log('Server running at http://127.0.0.1:3000/');

正如遗产所说,它必须是别的东西

于 2012-11-23T19:15:08.343 回答
2

我敢打赌这是因为您没有设置内容长度标题 ( Content-Length)。我认为 Node.js 会自动执行此操作,但可能不会。

这是过去的一个问题,但我认为它已在 chrome 中修复。也许你有一个旧版本。

尝试:

response.writeHead(200, {"Content-Type": "text/html", "Content-Length" : body.length });

然后查看 Chrome 开发者工具网络选项卡,看看是否设置了标头。

于 2012-11-23T19:03:05.163 回答
1

我使用自己的 node.js 服务器进行了测试,我认为扩展正在更改 html。尝试在其他浏览器中访问,并在 chrome 中以隐身模式访问。

于 2012-11-23T18:52:30.233 回答