Looking for help with CloudFront + S3 issue

Support
1

My app is hosted on an S3 bucket and it works correctly when served directly from the bucket. Blockstack auth works well and all the CORS headers look good - http://entaxy-production.s3-website.ca-central-1.amazonaws.com/
On top of that I added CloudFront so I can setup my domain name instead of the S3 generated url. The CORS headers look good but blockstack auth is now broken and I can’t figure out why. I’m still using the CloudFront generated url before I switch my domain https://d1eymu5czkzdwx.cloudfront.net

Here’s the error message:

16%20PM
Screen Shot 2019-08-07 at 5.04.16 PM.png2872×1030 317 KB

Does anyone have any ideas?

2

I think you’ve got a problem with the parameters you pass to redirectToSignin. I plagairized this from somewhere:

  // Open the blockstack browser for sign in
  // After choosing an Id to sign in with, redirect back to the login page
  userSession.redirectToSignIn(
    `${window.location.origin}/`,
    `${window.location.origin}/manifest.json`,
     ['store_write', 'publish_data'])
  return { type: USER_LOGIN }
}
3

I get an error about localhost:1337 when I click on your link and try to log in with blockstack. as it happens, I’m not running a cors proxy there.

4

Regarding the params I don’t think that’s the case, all the params for redirectToSignIn have default values so you don’t need to pass them in unless you need something different. In my case only the first param redirectURI is a different route. Don’t see how that would cause this problem.
Thanks for trying though

5

Which link did you try? The amazon one or the cloudfront?

6

Ok, I figured it out. In order for CloudFront and react router to play well together I needed to create special error pages in CloudFront. Anyway you can read about it here in case you find yourself with the same issue.
https://hackernoon.com/hosting-static-react-websites-on-aws-s3-cloudfront-with-ssl-924e5c134455

7

from Amazon link I get this

Error while trying to use the following icon from the Manifest: https://browser.blockstack.org/static/images/app-blockstack.png (Download error or resource isn't a valid image)
main.eac9eaaae65a2a0fb07d.chunk.js:1 GET http://localhost:1337/http://entaxy-production.s3-website.ca-central-1.amazonaws.com/manifest.json net::ERR_CONNECTION_REFUSED

from the cloudfront link, I get this:

Access to fetch at 'https://d1eymu5czkzdwx.cloudfront.net/manifest.json' from origin 'https://browser.blockstack.org' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
8

Cleaning up outdated support posts