search

fullstackreact / google-maps-react

Companion code to the "How to Write a Google Maps React Component" Tutorial
https://www.fullstackreact.com/articles/how-to-write-a-google-maps-react-component/
MIT License
1.63k stars 818 forks source link

cors error #524

Open christopher-jj-k opened 2 years ago

christopher-jj-k commented 2 years ago

My project was working fine last week and now I'm getting cors errors. I have been in contact with google technical support to ensure that my key is set up properly and I can make fetch calls to the library without cors issues as well. The errors I'm seeing output in my console is:

Uncaught (in promise) lf {message: 'loaderCB01632903299228 is not a function', name: 'InvalidValueError', stack: 'Error\n    at new lf (https://maps.googleapis.com/m…ons&v=3&language=en&onerror=ERROR_FUNCTION:309:44'}
Promise.then (async)
Xda @ js?key=AIzaSyB-j1r3ZhIXV9TYHC_gpGdlKT0vTkSbuy4&callback=loaderCB01632903299228&libraries=directions&v=3&language=en&onerror=ERROR_FUNCTION:309
google.maps.Load @ js?key=AIzaSyB-j1r3ZhIXV9TYHC_gpGdlKT0vTkSbuy4&callback=loaderCB01632903299228&libraries=directions&v=3&language=en&onerror=ERROR_FUNCTION:14
(anonymous) @ js?key=AIzaSyB-j1r3ZhIXV9TYHC_gpGdlKT0vTkSbuy4&callback=loaderCB01632903299228&libraries=directions&v=3&language=en&onerror=ERROR_FUNCTION:439
(anonymous) @ js?key=AIzaSyB-j1r3ZhIXV9TYHC_gpGdlKT0vTkSbuy4&callback=loaderCB01632903299228&libraries=directions&v=3&language=en&onerror=ERROR_FUNCTION:439
:3000/:1 Access to fetch at 'https://maps.googleapis.com/maps/api/js?key=AIzaSyB-j1r3ZhIXV9TYHC_gpGdlKT0vTkSbuy4&callback=loaderCB01632903299228&libraries=directions&v=3&language=en&onerror=ERROR_FUNCTION' from origin 'http://localhost:3000' 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.
index.js:1 GET https://maps.googleapis.com/maps/api/js?key=AIzaSyB-j1r3ZhIXV9TYHC_gpGdlKT0vTkSbuy4&callback=loaderCB01632903299228&libraries=directions&v=3&language=en&onerror=ERROR_FUNCTION net::ERR_FAILED 200
christopher-jj-k commented 2 years ago

I rebuilt the project again and now its working? I don't understand what went wrong here. I downloaded my repository, ran npm install to download the node modules and then npm start as usual when it wasn't working. Where did I go wrong?