CORS in 100 Seconds

Cross-Origin Resource Sharing or CORS is a mechanism that allows browsers to request data from 3rd party URLs (or origins) and is a common pain point for web developers. Learn the basics of CORS in 100 seconds.

Full Tutorials

Helpful CORS Resources

#webdev #js #100SecondsOfCode

Install the quiz app 🤓

Use code lORhwXd2 for 25% off your first payment.

My VS Code Theme

- Atom One Dark
- vscode-icons
- Fira Code Font

[Fireship]

*correction a cross-origin image fetched with an <img> tag is not subject to CORS, it to comes into play with HTTP calls from scripts, ie fetch() or XMLHttpRequest

[lardosian]

Cors errors can really push ones patience to the limit!

[gokuldinesh]

Makes a poll. Listen to the audience. Clears their doubts

10/10 love your channel <3

[muradmorshed]

fireship is the hero we need, but we definitely don't deserve.
it's weird seeing free content with such high quality 🥰🥰🥰

[starkxz]

You do always listen to the audience requests, and that's what a good content creator do. Thanks Jeff.

[afiefsholichuddin]

You forgot to mention the "it is working on postman" part haha

although it is related to browser and different domain part

[WolfrostWasTaken]

Be careful! Sometimes you might get an error saying that CORS blocked the request because the OPTIONS call does not have an HTTP OK status. This actually has nothing to do with CORS (it's a red herring), but rather the route itself is missing from the server, or the server isn't responding correctly. Beware!

[paddyspencer]

I literally was just needing this lmao

[FalseDev]

I thought I understood CORS well until 5 minutes ago 😆
Very informative video as always!

[jonathanlonnfors]

literally had CORS problem today and now I understand it better. And this is not the first time you read my mind and make videos of it the exact same day.

Plz keep it up i need you!

[dennism]

It amazes me how even after years of schooling I still learn stuff from 100 second videos. Keep it up!

[Trixz-the]

I've been waiting for this for weeks!!!

[rifaldhiaw]

Please do more something fundamentals like this. Some mainstream frameworks are easy to look for documentation. But IDK y, something like this sometimes gives a headache

[prayk]

I legitimately love this video. Through my few years with web development I got so many CORS errors that the error screen gives me PTSD. This video really clarifies the concept real quick. I wish I had seen it when I got my first CORS error.

[joshuaenricksalvador]

Wow, I've had this problem for months, at some point I just decided to copy whatever solutions I could find and see if it would work, but it was always different depending on the project. This really explained the whole error response thing, I could never really understand the different CORS errors.

[tsabudh]

I was preparing myself to watch a video of hours to understand CORS. Fireship came to the rescue. It surely built at least the fundamentals. Great content as always.

[laffed]

we asked and he delivered. One of the many reasons why Fireship is the best dev channel on youtube

[programmingpython]

I am using a third party api, so i don't have the backend control and got the CORS error. Now i guessed one fix (and that worked). I created my own backend (in node) and called the api there and allowed my frontend domain to access my local backend (as that was giving the cors error too). Now i can easily get the data on frontend served by my backend which is actually coming from a 3rd party api. This is infact a common fix in this case as by having a custom backend, we bypass the browser security.

[firstnamelastname]

This was extremely clear and concise! Much better than reading all those confusing articles online

[k_gold]

I feel like the entire field of computer networks is creating a way to connect two nodes and then trying their best to avoid doing that by default