How to run Angular 7 server side rendering (SSR) Universal Build in AWS

Question

This question already asked but that not solving my issue.

I am trying to run my Angular-7 product using Server Side Rendering following steps:

I create a build using this cmd ng add @nguniversal/express-engine --clientProject
And start my universal app using this cmd npm run build:ssr && npm run serve:ssr

After this step it creating the following folders & files:

Next steps in AWS:

Move the dist over to your server
install PM2
npm install pm2 -g
pm2 start dist/server.js
Create a security group inbound with custom TCP

After I try to access my project url it shows like this

I don't know how to solve this problem. Thanks in advance.

SimonEritsch · Accepted Answer · 2019-08-09 10:32:49Z

1

The problem here is that apache/nginx as webservers are rendering your output on port 80 by default and not your angular server. Your Angular express server doesn't run on port 80 though (which the browser expects) and for that reason, you have to forward the port it is actually running to port 80 (default http port). Here are some more details:

Nginx: https://eladnava.com/binding-nodejs-port-80-using-nginx/

If you want to host your node app (which Angular ssr is) on AWS, I would personally recommend to use the elasticbeanstalk node bean. This will handle all of this for you by default and you only have to "zip" the folder you have got and upload it. Everything else (including pm2) will be handled by that.

Apache as a proxy: If you want to use apache as a proxy you have to create a virtualhost for your domain and add the following code:

<VirtualHost node.example.com:80>   
    ServerName node.example.com  
     ProxyPass / http://localhost:8000/ connectiontimeout=5 timeout=30  # optional timeout settings  
</VirtualHost>

edited Aug 9, 2019 at 10:32

answered Aug 9, 2019 at 7:52

SimonEritsch

1,4971 gold badge16 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Ramesh S Over a year ago

Thanks for your suggestion but already I run another website in my apache server currently I need to check another project in the same server. It means I load another project URL like "dev.myproject.com" it will work fine but I need to reload subfolder it will display the list of the files in browser. @SimonEritsch

SimonEritsch Over a year ago

But then you need to go with the port proxy version to make it work. I updated my answer for an apache proxy solution

Ramesh S Over a year ago

I try to change this VirtualHost for my domain

<VirtualHost dev.choosecubby.com:80>        ServerName dev.choosecubby.com      ProxyPass / https://dev.choosecubby.com:9000/ connectiontimeout=5 timeout=30  # optional timeout settings   </VirtualHost>

Ramesh S Over a year ago

It shows

Job for httpd.service failed because the control process exited with error code. See "systemctl status httpd.service" and "journalctl -xe" for details.

when i restart apache

SimonEritsch Over a year ago

so what does systemctl status httpd.service return? Try to run it on your server to get more details why it fails. Also the "ProxyPass" must be "localhost:8000, because you want to proxy the serverinternal port 8000 to 80.

Collectives™ on Stack Overflow

How to run Angular 7 server side rendering (SSR) Universal Build in AWS

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related