CORS error when I load from local dev server
amaharana opened this issue · comments
The project builds fine and the dev server starts as expected. I have the react-userscripts-dev.user.js installed but console shows a CORS error when I load Google.
Access to fetch at 'http://localhost:8124/static/js/main.js' from origin 'https://www.google.com' 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.
VM5260:1 GET http://localhost:8124/static/js/main.js net::ERR_FAILED
How do you handle the CORS issue while running the dev server locally within Google's page context? I am probably doing something very silly!
Have you enabled CORS permissions for your userscript? (You can do so by editing userscript-header.js) https://stackoverflow.com/questions/24688294/how-do-i-allow-cross-origin-requests-from-greasemonkey-scripts-in-firefox
Didn't help. Both FF and Chrome show the same error. I'll keep digging. Thanks!
First I tried GM.xmlHttpRequest instead of GM_xmlhttpRequest as per the comment on this thread. When that didn't work, I tried adding the Access-Control-Allow-Origin: * header to the devServer configuration following this link in file config-overrides.js. That didn't work either. Setting webpack config isn't the simplest in the world, so I don't know if I was doing it right in the first place.
After struggling for few hours, finally the CORS Unblock plugin allowed a successful call to the dev server. Phew! Or use ModHeader to set the response header Access-Control-Allow-Origin: * and achieve the same result.
What puzzles me is that I did not need to add // @grant GM_xmlhttpRequest to react-userscripts-dev.user.js. Although I have several userscripts from other sources that do exactly that and work as expected. Go figure!
Thanks for the help!
@amaharana CORS Unblock works just fine!! But how do you solve this in production? As far as I understand this is just useful in development.
I'd appreciate your help!