Better Programming

Advice for programmers.

Follow publication

Member-only story

What You Need To Know About CORS and Vue.js To Increase Browser Security

Dirk Hoekstra
Better Programming
Published in
5 min readMar 16, 2021
Work meeting
Photo by Headway on Unsplash.

I was developing a frontend application this week and got some CORS errors. I’ve run into these errors before, but I never really thought about why cross-domain sharing was dangerous.

I knew it had something to do with security, but the details were a bit vague to me. So, I decided to research it and write a deep-dive article on CORS with some Vue.js examples.

Let’s dive in

What Is CORS?

CORS stands for Cross-Origin Resource Sharing. It is a mechanism that allows servers to indicate what other domains can access their resources.

A resource can be anything. An image, an API request, or even loading an external iframe.

I created a diagram outlining a (simplified) real-world CORS scenario that might occur when scouring the internet for cat pictures:

Diagram outlining real-world CORS scenario
Photo by the author.

Building a CORS Example

Create an account to read the full story.

The author made this story available to Medium members only.
If you’re new to Medium, create a new account to read this story on us.

Or, continue in mobile web

Already have an account? Sign in

Dirk Hoekstra
Dirk Hoekstra

Written by Dirk Hoekstra

Freelance Developer - 📍Amsterdam

Write a response