Question

我在AWS实例上部署了Node / Express JS后端，我正在使用Linux映像，而我使用的Web服务器是NGINX。 MEAN应用程序正在运行，因为我正在构建Angular应用程序并将dist文件夹复制到Node / Express JS后端并指示后端为index.html提供服务，这很好用，它看起来像是类似的。

Node/Express JS

let pathToClientApp = '/dist';
...
app.use(express.static(path.join(__dirname, pathToClientApp)));
...
app.get('/*', function(req, res, next) {
 if (req.header('Content-Type') == 'application/json') {
  next();
 } else { 
  res.status(200).sendFile(__dirname + 
 `${pathToClientApp}/index.html`);
 }});

Run server on port 3000

现在我想为Angular应用程序实现服务器端呈现。我通过跟随Angular普遍官方wiki

来实现这一目标

我现在可以构建服务器包并在本地测试它，首先我运行构建并使用以下命令提供Angular通用应用程序

npm run build:universal
npm run serve:universal

It runs on port 3000
Node server listening on http://localhost:3000

请注意，在这种情况下，Angular universal也拥有自己的Express服务器server.ts，它与我的Node / Express JS后端server.js不同，后者在第一个代码块。

所以在捆绑并提供Angular应用程序之后，我运行后端服务器然后从dist文件夹引用index.html，我打开浏览器并呈现角度通用，非常快，它与后面通信 - 因此，它在本地开发工作正常。

因此对于制作我将如何实现这一点，因为当我将dist文件夹复制到生产服务器时，我仍然需要运行Angular通用服务器，我通过复制Angular的package.json来完成我已经包含在生产服务器中的dist文件夹的应用程序，首先安装了node_modules，构建并提供了服务，它在端口3000上运行，并在端口300上运行后端服务器，但是当我打开浏览器时，我得到了错误，在浏览器上。

Error: Failed to lookup view "/rello-server/dist/dist/browser/index.html" in views directory "/rello-server/dist/dist/browser"
at Function.render (/rello-server/dist/server.js:162542:17) [<root>]
at ServerResponse.render (/rello-server/dist/server.js:167454:7) [<root>]
at /rello-server/dist/server.js:153404:9 [<root>]
at Layer.handle [as handle_request] (/rello-server/dist/server.js:106025:5) [<root>]
at next (/rello-server/dist/server.js:105844:13) [<root>]
at Route.dispatch (/rello-server/dist/server.js:105819:3) [<root>]
at Layer.handle [as handle_request] (/rello-server/dist/server.js:106025:5) [<root>]
at /rello-server/dist/server.js:105319:22 [<root>]
at param (/rello-server/dist/server.js:105392:14) [<root>]
at param (/rello-server/dist/server.js:105403:14) [<root>]
at Function.process_params (/rello-server/dist/server.js:105448:3) [<root>]
at next (/rello-server/dist/server.js:105313:10) [<root>]
at expressInit (/rello-server/dist/server.js:163109:5) [<root>]
at Layer.handle [as handle_request] (/rello-server/dist/server.js:106025:5) [<root>]

以下是后端服务器日志

Error: Cannot find module '/rello-server/dist/dist/server.js'
at Function.Module._resolveFilename (module.js:536:15)
at Function.Module._load (module.js:466:25)
at Function.Module.runMain (module.js:676:10)
at startup (bootstrap_node.js:187:16)
at bootstrap_node.js:608:3
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! rello@0.0.0 serve:universal: `node dist/server.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the rello@0.0.0 serve:universal script.
npm ERR! This is probably not a problem with npm. There is likely 
additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/ubuntu/.npm/_logs/2018-03-29T19_25_28_689Z-
debug.log
ubuntu@ip-:/rello-server/dist$ npm run serve:universal
ubuntu@ip-:/rello-server/dist$ npm run build:ssr
npm ERR! missing script: build:ssr

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/ubuntu/.npm/_logs/2018-03-29T19_27_01_180Z-
debug.log
ubuntu@ip-:/rello-server/dist$ node server

events.js:183
  throw er; // Unhandled 'error' event
  ^
Error: listen EADDRINUSE :::3000
at Object._errnoException (util.js:1024:11) [<root>]
at _exceptionWithHostPort (util.js:1046:20) [<root>]
at Server.setupListenHandle [as _listen2] (net.js:1351:14) [<root>]
at listenInCluster (net.js:1392:12) [<root>]
at Server.listen (net.js:1476:7) [<root>]
at Function.listen (/rello-server/dist/server.js:162580:24) [<root>]
at Object.<anonymous> (/rello-server/dist/server.js:153407:5) [<root>]
at __webpack_require__ (/rello-server/dist/server.js:20:30) [<root>]
at /rello-server/dist/server.js:63:18 [<root>]
at Object.<anonymous> (/rello-server/dist/server.js:66:10) [<root>]
at Module._compile (module.js:635:30) [<root>]
at Object.Module._extensions..js (module.js:646:10) [<root>]
at Module.load (module.js:554:32) [<root>]
at tryModuleLoad (module.js:497:12) [<root>]
ubuntu@ip-:/rello-server/dist$ 
ubuntu@ip-:/rello-server/dist$ node server

Node server listening on http://localhost:3000
Error: Failed to lookup view "/rello-
server/dist/dist/browser/index.html" in views directory "/rello-
server/dist/dist/browser"
at Function.render (/rello-server/dist/server.js:162542:17) [<root>]
at ServerResponse.render (/rello-server/dist/server.js:167454:7) 
[<root>]
at /rello-server/dist/server.js:153404:9 [<root>]
at Layer.handle [as handle_request] (/rello-server/dist/server.js:106025:5) [<root>]
at next (/rello-server/dist/server.js:105844:13) [<root>]
at Route.dispatch (/rello-server/dist/server.js:105819:3) [<root>]
at Layer.handle [as handle_request] (/rello-server/dist/server.js:106025:5) [<root>]

如何将Angular通用应用程序与后端服务器相关联？任何建议，资源链接都会有所帮助，因为我花了一周时间研究，但我似乎无法找到它是如何完成的，谢谢。

Answer 1

使用ng serve不会生成html页面，您需要运行nodejs服务器或角度服务器。

使用NodeJS / ExpressJS后端提供角度通用应用程序

1 个答案: