服务 Angular 通用应用程序导致 NetworkError

Question

我的运行我的 Angular 通用应用程序出现网络错误。经过一些研究，我发现这与我的应用程序中的相对路径有关。不幸的是，我不清楚如何修复错误。据我了解，需要调整 tsconfigFiles 中的路径。有人可以帮我吗？非常感谢

终端输出

 ERROR NetworkError
        at XMLHttpRequest.send(<path>/dist/frontend/server/main.js)

    {

tsconfig.json

  "compileOnSave": false,
  "compilerOptions": {
    "skipLibCheck": true,
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "es2020",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2018", "dom"]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

tsconfig.app.json

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "resolveJsonModule": true,
    "outDir": "./out-tsc/app",
    "types": ["node"]
  },
  "files": ["src/main.ts", "src/polyfills.ts"],
  "include": ["src/**/*.d.ts"],
  "exclude": ["src/test.ts", "src/**/*.spec.ts"]
}

tsconfig.server.json

{
  "extends": "./tsconfig.app.json",
  "compilerOptions": {
    "outDir": "./out-tsc/server",
    "target": "es2016",
    "types": ["node"]
  },
  "files": ["src/main.server.ts", "server.ts"],
  "angularCompilerOptions": {
    "entryModule": "./src/app/app.server.module#AppServerModule"
  }
}

Answer 1

该错误与相对 TS 路径无关，而是与相对 URL 相关。因此，您必须更改的不是 tsconfig，而是您的 HttpClient 调用，以便您对绝对 URLS

进行 xhr 调用

httpClient.get('/api/products'); //<= error in universal
httpClient.get('http://mydomaine.com/api/products'); //<= OK in universal

服务 Angular 通用应用程序导致 NetworkError

Serving Angular Universal Application results in NetworkError

angular-universal

angular

终端输出

tsconfig.json

tsconfig.app.json

tsconfig.server.json