MODULE 06 · AUTHENTICATION & SECURITY

CORS

A browser security mechanism that controls whether a web page may access a resource from another origin.

01 · What is it?

CORS, or Cross-Origin Resource Sharing, is a browser-enforced rule for controlled access between different origins.

A server uses HTTP response headers to say which browser origins may read its response.

Simple Definition:
CORS lets a server allow or deny browser requests that come from another origin.

02 · Think of it like...

Think of CORS like a building receptionist checking a visitor's organization before allowing access to a private room.

The visitor can arrive at the building, but the receptionist checks the visitor's origin and the room's access policy before sharing what is inside.

Web Page
Browser Check
Server Policy
Response
Page Can Read

03 · What does it do?

CORS gives the browser a way to enforce a server's cross-origin access policy.

Checks the Origin

The browser identifies where the requesting page came from.

Reads Server Headers

The response can state which origins are allowed.

Handles Preflight

Some requests are checked with an OPTIONS request first.

Protects Page Access

The browser blocks script access when the policy does not match.

CORS controls browser access to a response; it is not a general firewall for every kind of client.

04 · Where is it used?

CORS matters when a browser page and the API or resource it needs are served from different origins.

Separate FrontendWeb app and API

A frontend hosted on one domain calls an API hosted on another.

Local DevelopmentDifferent ports

A local frontend and backend use different ports during development.

Shared ServicesMultiple web clients

One API serves approved browser applications from several origins.

Browser RequestsFetch and XHR

JavaScript uses browser request APIs to read data from a remote origin.

05 · Example

Origin: https://app.example.com
Access-Control-Allow-Origin: https://app.example.com
GET /api/profile

A page at https://app.example.com requests data from an API on another origin. If the API returns a matching Access-Control-Allow-Origin header, the browser allows the page's script to read the response.

The server must explicitly allow the origin. A request reaching the server does not automatically mean browser JavaScript can read the response.

06 · How it connects

Page OriginBrowser RequestServer HeadersBrowser DecisionScript Access

The browser is the enforcement point: it sends the request, evaluates the response headers, and decides whether page code may read the response.

07 · Do Not Confuse

CORS

A browser access policy for reading cross-origin responses.

Authentication

A way to establish who a user or system is.

CSRF

An attack pattern where a victim's browser is tricked into sending an unwanted state-changing request.

CORS is about whether browser code may read a response. It does not replace authentication or authorization.

08 · Topic Glossary

ENGLISH TERM中文SIMPLE ENGLISH中文小白理解
CORS跨源资源共享A browser rule for controlled cross-origin access.浏览器控制不同来源之间能否共享资源的一套规则。
Origin来源The combination of scheme, host, and port.协议、域名和端口组合起来形成的地址来源。
Cross-Origin Request跨源请求A request made from one origin to another origin.一个来源的页面向另一个来源发送的请求。
Preflight Request预检请求An OPTIONS request that checks whether a later request is allowed.正式请求前,浏览器先用 OPTIONS 询问服务器是否允许。
Response Header响应头Metadata returned with an HTTP response.服务器随响应返回的附加说明信息。
Access-Control-Allow-Origin允许来源A response header that lists an allowed browser origin.告诉浏览器哪些网页来源可以读取响应的响应头。
Same-Origin Policy同源策略A browser security rule that isolates different origins by default.浏览器默认把不同来源隔离开的安全规则。

09 · What to Remember

CORS is a browser security mechanism for controlled access across origins.

The server declares its policy with response headers, and the browser enforces that policy.

Core Flow:
Page Origin → Browser Request → Server CORS Headers → Browser Decision → Script Access

↑