Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document deployment to S3 #997

Closed
wolovim opened this issue Nov 1, 2016 · 7 comments
Closed

Document deployment to S3 #997

wolovim opened this issue Nov 1, 2016 · 7 comments

Comments

@wolovim
Copy link
Contributor

wolovim commented Nov 1, 2016

Description

When deploying CRA apps to S3, the error document is effectively ignored by IE11. This causes all routes outside of the root route to reach IE's default 404 page. I have not yet tested this on other IE versions.

Expected behavior

If error document is set to index.html, the application should still display the App.js component when visiting <S3-route>/anything. (Alternatively, if a customerror.html is set, it should display that, but doesn't.)

Chrome, Firefox and Safari perform this behavior as expected.

Actual behavior

IE default 404 page.

Environment

  1. npm ls react-scripts: react-scripts@0.7.0
  2. node -v: v5.5.0
  3. npm -v: 3.5.3

Have tested from:

  1. Operating system: Win 8.1
  2. Browser and version: IE11

Reproducible Demo

I've got an example S3 deployment set up. You'll notice that the root route works fine, but you'll get the IE 404 page with any addition to the URL.

S3 Configuration:

The bucket has an open permissions policy:

{
	"Version": "2016-11-1",
	"Statement": [
		{
			"Sid": "AddPerm",
			"Effect": "Allow",
			"Principal": "*",
			"Action": [
				"s3:GetObject"
			],
			"Resource": [
				"arn:aws:s3:::demo-party/*"
			]
		}
	]
}

and is configured for static website hosting:
screen shot 2016-11-01 at 10 39 56 am

More than happy to help debug further, but I'm about out of ideas on my end.

@wolovim
Copy link
Contributor Author

wolovim commented Nov 2, 2016

Still not sure how to address this specific issue, but I got around this by layering Amazon's CloudFront CDN service over the S3 bucket, then declaring a custom error document in that distribution. These SO answers were helpful for getting that configured.

@wolovim
Copy link
Contributor Author

wolovim commented Nov 11, 2016

I've written a blog post about deploying with S3 and CloudFront. Let me know if you'd like something added to the outputted README regarding either of these.

@ggregoire
Copy link

ggregoire commented Nov 17, 2016

Thanks for the blog post! It would be really helpful to have this link directly in the README.

@gaearon
Copy link
Contributor

gaearon commented Nov 20, 2016

@ggregoire You can add a paragraph with that link to the User Guide in the Deployment section and link to it from README.

@gaearon
Copy link
Contributor

gaearon commented Nov 20, 2016

When deploying CRA apps to S3, the error document is effectively ignored by IE11.

To be clear there's nothing we can do in Create React App to fix an issue with Internet Explorer. We didn't write it after all 😉

But it would be great to add a link to the article to user guide.

@gaearon gaearon changed the title Deployment to S3 - error document config not applied in IE Document deployment to S3 Nov 20, 2016
@wolovim
Copy link
Contributor Author

wolovim commented Nov 20, 2016

@gaearon @ggregoire quick PR up at: #1071

@fson
Copy link
Contributor

fson commented Nov 22, 2016

Fixed in #1071.

@fson fson closed this as completed Nov 22, 2016
@lock lock bot locked and limited conversation to collaborators Jan 22, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

4 participants