Skip to main content
AI Assist is now on Stack Overflow. Start a chat to get instant answers from across the network. Sign up to save and share your chats.

Return to Answer

formatting, use example domain, grammar, capitalization, code format example URL, code format file name
Source Link
Stephen Ostermiller ♦
Stephen Ostermiller ♦
  • 25.8k
  • 18
  • 96
  • 117

There are few problems with the S3/Redirect based approach mentioned by others.

  1. MutlipleMultiple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/testwww.example.com/path/for/test gets redirected as www.myapp.com/#/path/for/testwww.example.com/#/path/for/test
  2. There is a flicker in the urlURL bar as the '#'# comes and goes due the action of your SPA framework.
  3. The seoSEO is impacted because - 'Hey! Its googleGoogle forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.htmlindex.html
  2. Remove routing rules from S3 configurations
  3. Put a CloudfrontCloudFront in front of your S3 bucket.
  4. Configure error page rules for your CloudfrontCloudFront instance. In the error rules specify:
  • HttpHTTP error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds)  : 0
  • Customize response: Yes
  • Response Page Path  : /index.html/index.html
  • HTTP Response Code: 200
  1. For SEO needs + making sure your index.htmlindex.html does not cache, do the following:
  • Configure an EC2 instance and setup an nginxNginx server.
  • Assign a public ipIP to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginxNginx server to do the following things: Proxy_pass all requests to your CDN (for index.htmlindex.html only, serve other assets directly from your cloudfrontCloudFront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginxNginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfrontCloudFront cache once to be in the pristine mode. Hit the urlURL in the browser and all should be good.

There are few problems with the S3/Redirect based approach mentioned by others.

  1. Mutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds)  : 0
  • Customize response: Yes
  • Response Page Path  : /index.html
  • HTTP Response Code: 200
  1. For SEO needs + making sure your index.html does not cache, do the following:
  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

There are few problems with the S3/Redirect based approach mentioned by others.

  1. Multiple redirects happen as your app's paths are resolved. For example: www.example.com/path/for/test gets redirected as www.example.com/#/path/for/test
  2. There is a flicker in the URL bar as the # comes and goes due the action of your SPA framework.
  3. The SEO is impacted because - 'Hey! Its Google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a CloudFront in front of your S3 bucket.
  4. Configure error page rules for your CloudFront instance. In the error rules specify:
  • HTTP error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds): 0
  • Customize response: Yes
  • Response Page Path: /index.html
  • HTTP Response Code: 200
  1. For SEO needs + making sure your index.html does not cache, do the following:
  • Configure an EC2 instance and setup an Nginx server.
  • Assign a public IP to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your Nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your CloudFront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to Nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your CloudFront cache once to be in the pristine mode. Hit the URL in the browser and all should be good.

added 1 character in body
Source Link
user6269864
user6269864

There are few problems with the S3/Redirect based approach mentioned by others.

  1. mutlipleMutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds) : 0
  • Customize response: Yes
  • Response Page Path : /index.html
  • HTTP Response Code: 200

5.For SEO needs + making sure your index.html does not cache, do the following:

  1. For SEO needs + making sure your index.html does not cache, do the following:
  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

There are few problems with the S3/Redirect based approach mentioned by others.

  1. mutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds) : 0
  • Customize response: Yes
  • Response Page Path : /index.html
  • HTTP Response Code: 200

5.For SEO needs + making sure your index.html does not cache, do the following:

  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

There are few problems with the S3/Redirect based approach mentioned by others.

  1. Mutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds) : 0
  • Customize response: Yes
  • Response Page Path : /index.html
  • HTTP Response Code: 200
  1. For SEO needs + making sure your index.html does not cache, do the following:
  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

added 37 characters in body
Source Link
moha297
moha297
  • 1.9k
  • 1
  • 17
  • 16

There are few problems with thisthe S3/Redirect based approach mentioned by others.

  1. mutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds) : 0
  • Customize response: Yes
  • Response Page Path : /index.html
  • HTTP Response Code: 200

5.For SEO needs + making sure your index.html does not cache, do the following:

  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

There are few problems with this approach.

  1. mutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds) : 0
  • Customize response: Yes
  • Response Page Path : /index.html
  • HTTP Response Code: 200

5.For SEO needs + making sure your index.html does not cache, do the following:

  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

There are few problems with the S3/Redirect based approach mentioned by others.

  1. mutliple redirects happen as your app's paths are resolved. For example: www.myapp.com/path/for/test gets redirected as www.myapp.com/#/path/for/test
  2. There is a flicker in the url bar as the '#' comes and goes due the action of your SPA framework.
  3. The seo is impacted because - 'Hey! Its google forcing his hand on redirects'
  4. Safari support for your app goes for a toss.

The solution is:

  1. Make sure you have the index route configured for your website. Mostly it is index.html
  2. Remove routing rules from S3 configurations
  3. Put a Cloudfront in front of your S3 bucket.
  4. Configure error page rules for your Cloudfront instance. In the error rules specify:
  • Http error code: 404 (and 403 or other errors as per need)
  • Error Caching Minimum TTL (seconds) : 0
  • Customize response: Yes
  • Response Page Path : /index.html
  • HTTP Response Code: 200

5.For SEO needs + making sure your index.html does not cache, do the following:

  • Configure an EC2 instance and setup an nginx server.
  • Assign a public ip to your EC2 instance.
  • Create an ELB that has the EC2 instance you created as an instance
  • You should be able to assign the ELB to your DNS.
  • Now, configure your nginx server to do the following things: Proxy_pass all requests to your CDN (for index.html only, serve other assets directly from your cloudfront) and for search bots, redirect traffic as stipulated by services like Prerender.io

I can help in more details with respect to nginx setup, just leave a note. Have learnt it the hard way.

Once the cloud front distribution update. Invalidate your cloudfront cache once to be in the pristine mode. Hit the url in the browser and all should be good.

added 38 characters in body
Source Link
moha297
moha297
  • 1.9k
  • 1
  • 17
  • 16
Elaborates on serving for Search bots and preventing cache on your index.html
Source Link
moha297
moha297
  • 1.9k
  • 1
  • 17
  • 16
Source Link
moha297
moha297
  • 1.9k
  • 1
  • 17
  • 16