CODEWITHSUNDEEP
angularamazon-web-servicesangular7angular-universalserver-side-rendering
Ramesh S
Ramesh S

Reputation: 661

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

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:

  1. I create a build using this cmd ng add @nguniversal/express-engine --clientProject
  2. 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:

enter image description here

Next steps in AWS:

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

After I try to access my project url it shows like this enter image description here

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

Upvotes: 2

Views: 2225

Answers (1)

SimonEritsch
SimonEritsch

Reputation: 1337

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>

Upvotes: 1

Related Questions