为什么Angular Universal无法正常工作

Question

我正在根据官方Angular文档将现有的angular应用程序转换为Angular Universal。

构建完成后，当我导航至端口4000时，服务器因此错误而停止。

  

ReferenceError：未定义requestAnimationFrame

根据官方文档，这些是我遵循的步骤

1。ng add @nguniversal/express-engine --clientProject projname

2。npm run build:ssr && npm run serve:ssr

Answer 1

requestAnimationFrame是在浏览器中定义的，而不是在服务器端应用程序运行所在的节点中定义的。在您的server.ts中添加以下代码以对其进行定义并加上cancelAnimationFrame：

global['requestAnimationFrame'] = function(callback, element) {
  let lastTime = 0;
  const currTime = new Date().getTime();
  const timeToCall = Math.max(0, 16 - (currTime - lastTime));
  const id = setTimeout(function() { callback(currTime + timeToCall); },
    timeToCall);
  lastTime = currTime + timeToCall;
  return id;
};

global['cancelAnimationFrame'] = function(id) {
  clearTimeout(id);
};

我希望这会有所帮助！

如果您遇到SSR的其他任何问题，请check if this article already covers it。