I have a React app hosted on Netlify, https://buy-where.netlify.app/, trying to fetch to my Rails API hosted on Heroku, https://buy-where.herokuapp.com/api/v1. I am getting blocked by a CORS policy, even though I have it configured exactly the same as another Netlify app with a Rails API hosted on Heroku, https://memes-vs-gifs.netlify.app/.
Here is an example of the CORS error (same error for any of my endpoints):
Access to fetch at ‘https://buy-where.herokuapp.com/api/v1/auth_check’ from origin ‘https://buy-where.netlify.app’ 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.
Here is my public/_redirects file:
/api/* https://buy-where.herokuapp.com/api/v1/:splat 200 /* /index.html 200
And in my Rails API initializers/cors.rb file:
Rails.application.config.middleware.insert_before 0, Rack::Cors do allow do origins ['http://localhost:3001', 'https://buy-where.netlify.app/'] resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head], credentials: true end end
I’m not sure what else to do. Thanks for any help anyone is able to offer!