Error: A cross-origin error was thrown. React doesn't have access to the actual error object in development

Question

i've been trying to parse the data from the student_learn field in firestore and map it to jsx components but i get a cors-origin error here is a screenshot of the collection i'm trying to fetch from.

Answer 1

There can be 2 reasons for this error (as I know):

1. invalid string in JSON.parse() . (most likely as you're using JSON.parse()) check your data befor parsing it (must be a valid stringified json)
2. Storage problem. To solve: 1. Open Dev tools 2. Go to Application section 3. Clear the local storage by right clicking it.

Answer 2

CORS will block the request. You will not receive a response (no status code) since no request were made.

The only way to fix CORS is by setting the correct header on the server that you're fetching. https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS