Question

我有一个从JSON响应中汇编HTML的服务器：

{
  content: "<div id=\"_next\">...</div>...<script src=\"...\"></script>"
}

节点服务器：

const output = "<html>..." + data.content;
return res.send(output);

注意：为简洁起见，我在这里省略了很多代码。

以上设置将HTML毫无问题地发送到浏览器，但是，一旦JavaScript加载，DOM就中断了，就好像发生了React错误一样，没有任何控制台输出。

我运行了一个测试，其中节点通过简单地粘贴HTML内容即可创建输出而无需获取JSON数据：

const output = "<html>..." + "<div id=\"_next\">...</div>...<script src=\"...\"></script>";
return res.send(output);

...在这种情况下，没有JS错误，并且所有内容均按预期方式呈现。

我已经比较了HTML响应，它们似乎相同。提取JSON的异步特性似乎也不是问题。这个问题似乎也是跨环境的，因为原本打算使用此代码的后端系统是用Java编写的，并且产生了相同的结果（DOM中断，没有控制台输出）。

Answer 1

此答案有些不完整，因为我不知道解决方案的原因或方式：

要解决此问题，URL中的文件名必须与呈现的静态文件匹配。

例如，如果Next.js应用程序导出的静态文件读取file-name.html并在本地以http://localhost:5000/out/file-name的形式提供，则用于HTML的结束网址也必须包含file-name ，例如：http://localhost:3000/another-url-structure/file-name。如果不正确，即http://localhost:3000/random-string，则DOM将中断。

清除为泥泞，但这是目前解决该问题的唯一方法。

客户端JavaScript应用（Next.js）意外中断，没有任何控制台错误

1 个答案: