How to serve server page inside cloudfront and s3 static files?

Question

I serve my website using cloudfront s3 (static files). https://example.com

When I open particular url I want to get into the server, but stay on the same domain.

for example

• https://example.com/index.html -> serve from cloudfront and s3
• https://example.com/app.js -> serve from cloudfront and s3
• https://example.com/foo -> go direct to my server (https://api.example.com/api/foo) and foo will return html content and in the browser is will stay and display the https://example.com/foo url.

Is something can be possible to do with s3 and cloudfront? if so what the configure I need to be done to achieve this?

Answer 1

You can setup a Cache behaviour for URL path which should go to Dynamic website And a Default cache behaviour (A catch everything else) which should go to S3.

When you create a new distribution, you specify settings for the default cache behavior, which automatically forwards all requests to the origin(for you its S3) that you specify when you create the distribution. After you create a distribution, you can create additional cache behaviors that define how CloudFront responds when it receives a request for objects that match a path pattern (in your case /foo)

If you are doing it through CloudFormation then see AWS::CloudFront::Distribution CacheBehavior - AWS CloudFormation.

From Console

And Then