CORS configuration in Node.js - Step-by-Step Execution

Concept Flow - CORS configuration

Client sends request

↓

Server receives request

↓

Check Origin header

↓

Is Origin allowed?

No→Reject request or no CORS headers

Yes↓

Add CORS headers to response

↓

Send response back to client

This flow shows how a server checks the client's origin and adds CORS headers if allowed, enabling cross-origin requests.

Execution Sample

Node.js

const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors({ origin: 'https://example.com' }));

app.get('/', (req, res) => res.send('Hello CORS!'));

app.listen(3000, () => console.log('Server running on port 3000'));

This code sets up a Node.js Express server that allows cross-origin requests only from https://example.com.

Execution Table

Step	Client Origin	Server Action	CORS Header Added	Response Sent
1	https://example.com	Check origin matches allowed origin	Access-Control-Allow-Origin: https://example.com	Hello CORS! with CORS headers
2	https://notallowed.com	Check origin does not match	No CORS headers added	Hello CORS! without CORS headers
3	No Origin header (same origin)	Origin undefined, does not match allowed origin	No CORS headers added	Hello CORS! without CORS headers

💡 Requests from allowed origins get CORS headers; others do not, controlling cross-origin access.

Variable Tracker

Variable	Start	After Request 1	After Request 2	After Request 3
req.headers.origin	undefined	https://example.com	https://notallowed.com	undefined
corsOptions.origin	https://example.com	https://example.com	https://example.com	https://example.com
CORS header added	false	true	false	false

Key Moments - 2 Insights

Why does the server add CORS headers only for some origins?

The server compares the request's Origin header to the allowed origins (see execution_table step 1 and 2). If it matches, it adds CORS headers; otherwise, it does not.

What happens if the request has no Origin header?

If no Origin header is present (usually same-origin requests), the server does not add CORS headers since it does not match the allowed origin (see execution_table step 3). Same-origin requests do not require CORS headers.

Visual Quiz - 3 Questions

Look at the execution_table, what CORS header is added when the client origin is https://example.com?

A Access-Control-Allow-Origin: *

B No CORS headers added

C Access-Control-Allow-Origin: https://example.com

D Access-Control-Allow-Methods: GET

💡 Hint

Check execution_table row 1 under 'CORS Header Added'

At which step does the server NOT add CORS headers?

A Step 1

B Step 2

C Step 3

D All steps add headers

💡 Hint

Look at execution_table rows 2 and 3 under 'CORS Header Added'

If the allowed origin changes to '*' (all origins), how would the CORS header change in step 1?

A Access-Control-Allow-Origin: *

B No CORS headers added

C Access-Control-Allow-Origin: https://example.com

D Access-Control-Allow-Methods: POST

💡 Hint

Think about how wildcard '*' allows all origins, changing the header value

Concept Snapshot

CORS configuration in Node.js:
- Server checks request Origin header
- If origin allowed, adds Access-Control-Allow-Origin header
- Use cors middleware in Express: app.use(cors({ origin: 'https://example.com' }))
- Controls which sites can access server resources
- No header means browser blocks cross-origin requests

Full Transcript

CORS configuration controls which websites can access your server's resources. When a client sends a request, the server checks the Origin header. If the origin matches allowed sites, the server adds CORS headers to the response. This tells the browser it's safe to share data. If the origin is not allowed, the server does not add these headers, so the browser blocks the response. In Node.js with Express, the cors middleware simplifies this by letting you specify allowed origins. This example allows only https://example.com. Requests from other origins get no CORS headers and are blocked by browsers. Requests without an Origin header, like same-origin requests, get no CORS headers but are allowed by browsers since they are same-origin.