Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 2 application deployed on Amazon s3 gives 404 error

I have deployed my Angular2 application on Amazon S3 successfully. It works fine. All routing works fine when I navigate using routeLinks/code.

But when I refresh the page, or jump to particular route, I get 404 error as follows.enter image description here

The thing is, we know we have dynamic routes in Angular2. There is no physical directory with that path/route name in final code base deployed/stored in S3 bucket. But, I think S3 considers it as physical object stored in S3 bucket, which it fails to fetch.

How to resolve this issue?

like image 440
C.P. Avatar asked Feb 03 '17 06:02

C.P.


People also ask

Can we deploy Angular app in S3?

Deploy the Angular build Now let's copy the angular build output that we discussed initially in the article generated at the dist/MyFirstAngularApp path and upload it in S3. Congrats, we have just created our first angular app and deployed it in AWS serverless S3.

Can we host Angular app in AWS?

AWS Amplify enables Angular developers to create high-quality applications on a flexible, scalable, and reliable serverless backend.


2 Answers

We had the same problem. Just go to Properties > Static website hosting.

In the field Error document, add index.html, like here.

like image 160
eheck Avatar answered Sep 29 '22 05:09

eheck


If you are using AWS cli to copy dist folder to your bucket then it copies the project folder to your bucket which contains your files including index.html.

Try uploading contents of dist/< your_project>/ directly to your bucket. It worked for me.

I think S3 is expecting an index.html file at its root level

like image 20
ANUBHAV GUPTA Avatar answered Sep 29 '22 05:09

ANUBHAV GUPTA