Angular 11 Universal 在页面源中不显示动态数据

问题描述

我的 Angular 11 SSR 未在页面源中显示动态数据。 我已经完成了所有搜索并实现了我在网上找到的所有内容。 有人可以帮忙吗?

我已经把所有的客户端代码都封装在里面了 是平台浏览器。 当我运行 ng run serve:ssr 时,我也没有在控制台中看到任何错误日志。 我还为某些路由添加了解析器,但仍然没有运气。

server.ts 文件

 import "zone.js/dist/zone-node";

import { ngExpressEngine } from "@nguniversal/express-engine";
import * as express from "express";
import { join } from "path";

import { AppServerModule } from "./src/main.server";
import { APP_BASE_HREF } from "@angular/common";
import { existsSync } from "fs";

import { NgxRequest,NgxResponse } from "@gorniv/ngx-universal";
import "localstorage-polyfill"
// The Express app is exported so that it can be used by serverless Functions.
export function app() {
  const server = express();
  const distFolder = join(process.cwd(),"dist/project/browser");
  const indexHtml = existsSync(join(distFolder,"index.original.html")) ? "index.original.html" : "index";
  global["localStorage"] = localStorage;

  // Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
  server.engine("html",ngExpressEngine({
    bootstrap: AppServerModule,}));

  server.set("view engine","html");
  server.set("views",distFolder);

  // Serve static files from /browser
  server.get("*.*",express.static(distFolder,{
    maxAge: "1y"
  }));

  // Do not serve the following routes via Universal
  server.get("/",(req,res) => {
    res.sendFile(join(distFolder,"index.html"));
  });

  // All regular routes use the Universal engine
  server.get("*",res) => {
    res.render(indexHtml,{
          req: req,res: res,providers: [
            {
              provide: APP_BASE_HREF,useValue: req.baseUrl
            },{
              provide: NgxRequest,useValue: (req)
            },{
              provide: NgxResponse,useValue: (res)
            }
          ]
        });
  });

  return server;
}

function run() {
  const port = process.env.PORT || 5000;

  // Start up the Node server
  const server = app();
  server.listen(port,() => {
    console.log(`Node Express server listening on http://localhost:${port}`);
  });
}

// Webpack will replace 'require' with '__webpack_require__'
// '__non_webpack_require__' is a proxy to Node 'require'
// The below code is to ensure that the server is run only when not requiring the bundle.
declare const __non_webpack_require__: NodeRequire;
const mainModule = __non_webpack_require__.main;
const modulefilename = mainModule && mainModule.filename || "";
if (modulefilename === __filename || modulefilename.includes("iisnode")) {
  run();
}

export * from "./src/main.server";

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)