Redwood Tutorial: CORS error following along in authentication section

Hello!

I’m following along with the official Redwood tutorial and encountering an error in the Authentication section when I attempt this step:

You need the protocol and domain, not the rest of the path. Paste that into the modal and click that Set site’s URL button. The modal should reload and now show a real login box:

I see the modal pop up and after putting in the site URL, I get this error in the modal: “Failed to load settings from https://[app-name].netlify.app/.netlify/identity”.

This is the error in the console: “Access to fetch at ‘https://[app-name].netlify.app/.netlify/identity/settings’ from origin ‘http://localhost:8910’ has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.”
Screenshot: https://imgur.com/a/wWULSmn

Any guidance would be much appreciated!

1 Like

Hi @vin! I’m looping in @rob in case this is an error he’s experienced before. I’m also trying to look for a thread where we talked about some of these issues we had during development.

Any chance you’ve used Netlify Identity before on your computer? And, just to confirm, did you enable Netlify Identity on their website for your account?

Hi @thedavid! Thanks for your quick reply :slight_smile:

I’ve never used Netlify Identity before on my computer. And, yup, I’ve enabled Netlify Identity on their website for my account. As per the next step in the tutorial, I tried appending my invite code to the end of the localhost URL and that didn’t get me past this error either.

I can’t find the thread I was referring to, but this is a way to at least “reset” the process. I’m in Google Chrome --> from the Developer Tools go to /Applications tab and then the left column nav /Local Storage and then 'localhost:8910". Hopefully, you’ll see the netlifySiteURL which you should delete.

Maybe a do-over will fix it?

Otherwise all the info I could find for Netlify Identity CORS error said the fix was to switch .com to .app, which you already have in your screenshot.

1 Like

Thanks - I tried removing that local storage entry and clearing cache, etc., etc. but still no luck.

Well, blast. That’s all the ideas I have this evening. We might need to loop in some Netlify folks to help diagnose. Sorry about that. We’ll keep working on this one, and please keep us posted as well.

In the meantime, if you’re feeling adventurous you could try to swap out Auth0 for Netlify. It’s actually a similar process just using a different provider. Here’s the documentation if you’re curious: https://redwoodjs.com/docs/authentication

And thanks for trying out Redwood! I hope everything else has worked out much better. Feedback = very welcome.

Thank you for looking into it! I’ll try out the Auth0 method as well!

Redwood has been awesome to work with so far and the tutorial is great :slight_smile:

1 Like

Hi @thedavid, I have no idea what changed, but I tried it one more time and it works now! :woman_shrugging:

Great to hear! But always a pro/con when things are fixed 'cause magic :mage:‍♂

My best hypothesis is something happened on Netlify’s side and was quickly resolved. I’ll still loop back with them next week and make sure they take a look.

Have a great weekend! And definitely let us know what you build with Redwood in the future :tada:

I’m seeing the same error as @vin was. I’ve cleared out local storage and double checked the URL a few times. Still getting a CORS error trying to get to the Identity API endpoint for Netlify from my localhost tutorial instance. In the web dev console, the error looks like (with app name scrubbed):

Access to fetch at ‘https://[appname].netlify.app/.netlify/identity/settings’ from origin ‘http://localhost:8910’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: 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.

I’ll try again tomorrow morning and see if the result is anything different. I’m not that familiar with Netlify Identity and just digging through the settings pages I didn’t see any CORS specific settings to tweak.

The tutorial has been great so far. Really enjoying it.

@phm200 thanks for checking in and adding some details. But bummer – I was hoping the magic would hold! More importantly, we’re having the Netlify folks help look into this.

Any chance you’re using an add blocker? Also, it’s a long-shot but perhaps try on a different browser and report back if there’s any different behavior?

@thedavid Well that’s frustrating… Before I tried to repro in other browsers, I just tried the same thing I had before, and now it works! Thank you for the quick response though!

FWIW, I’m on Chrome v83 on MacOS. I had previously tried it in an Incognito window and also had disabled my ad-blocker. Neither approach worked an hour ago, and now it works fine.

Feels like it must be related to provisioning on the Netlify Identity side.

I don’t have time to test it right now, but I wonder if I created a new Netlify app in my account and enabled Identity there, would it just work the first time? Like @vin, I’m a first time user of Netlify Identity.

Just :confused:

Feels like it must be related to provisioning on the Netlify Identity side.

^^ agreed

I don’t have time to test it right now, but I wonder if I created a new Netlify app in my account and enabled Identity there, would it just work the first time? Like @vin, I’m a first time user of Netlify Identity.

^^ ah, that would be a good test. I’ll keep that one in the hopper! No need to diagnose yourself – we have a hotline to Prisma and are coordinating with them.

Hope for smooth sailing from here out!

1 Like

Again, thanks so much for the response! Really exciting to learn about Redwood in its early state. It can do a lot now and I can see how much more powerful it could get.

2 Likes

I ran into this issue when I was setting up Identity. I read a couple forums about the issue in general and was able to fix the error by triggering a new deploy on Netlify manually.

2 Likes

Ah, really helpful workaround, @morganmspencer Thank you!

I’m marking your comment as the working solution until we coordinate a fix with the find folks from Netlify.

1 Like

@morganmspencer if you still have 'em handy, could you pass along any links to the forums solutions you found? No worries if not.

I’m trying to look back through everything and figure out where I found it with no luck. A lot of the information pertains to NetlifyCMS which requires enabling Git Gateway under the Identity settings. I found that this did not work for this case but the triggering a new deploy did. I’ll keep looking to see if I can dig up the information.

2 Likes

I was having a hard time figuring out what the problem was here, but eventually figured it was because my netlify site was set to password-protected. Had to change that, and then the settings could be fetched

2 Likes

^^^ just ran into this today and could not figure out why I got that CORS error when I had used Identity a number of times before … but this time I had a password protected site (which for this project/client I have to keep).

I did not think of this – thanks! Now I know I was not going crazy!