Deploying to Netlify with Github - CORS headers

Apps
#1

I deployed Animal Kingdom to Netlify using my Github repo and run into the CORS issue when attempting to authenticate with Blockstack.

The problem is that by opting to have netlify use my Github repo for deployment, netlify doesn’t appear to create a ‘build’ directory in my Github repo where I can add the CORS headers needed to allow the Blockstack browser to authenticate.

Here is a link to my Github repo: https://github.com/pcdavis/animal-kingdom

Has anyone run into this and know of a way to get around this? I can always npm run build and upload the file to netlify, but I would prefer to just push changes to the repo and have netlify take care of the rest.

Any ideas would be greatly appreciated.

Thanks,

Paul

UPDATE / SOLUTION: I found a possible solution - netlify allows users to drag and drop revised build folders into the site’s deployment section - then netlify redeploys the site without accessing the Github repo. Although I don’t think this solution will work after committing and pushing other code changes, it solved the immediate problem. Here’s the basic process I used: After running ‘npm run build’, I copied the _headers and _redirects files into the build directory. Then I opened the deployment tab for my site in netlify and dragged my build folder from Windows Explorer and dropped it onto the target area in netlify. Netlify automatically created a new deployment using that build folder and everything worked.

How to solve https hosting for "Failed to fetch information about the app requesting authentication"
#2

For future reference, here’s a netlify.toml that allows CORS, and thus allows blockstack login to work.

The file should be in the root project directory.

# The following redirect is intended for use with most SPAs that handle
# routing internally.
[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

[[headers]]
  # Define which paths this specific [[headers]] block will cover.
  for = "/*"
    [headers.values]
    Access-Control-Allow-Origin = "*"
4 Likes
#3

@dkb868 Thanks for this. I added it to my existing .toml and it worked like a charm!