Third-party middleware (cors, helmet) in NestJS - Step-by-Step Execution

Concept Flow - Third-party middleware (cors, helmet)

Start NestJS App

↓

Import Middleware

↓

Apply Middleware Globally

↓

Incoming Request

↓

Middleware Processes Request

↓

Pass to Route Handler

↓

Send Response

The app starts, imports middleware like cors and helmet, applies them globally, then each incoming request passes through these middleware before reaching route handlers.

Execution Sample

NestJS

import helmet from 'helmet';
import cors from 'cors';

app.use(helmet());
app.use(cors());

This code applies helmet and cors middleware globally to secure HTTP headers and enable cross-origin requests.

Execution Table

Step	Action	Middleware Effect	Request State	Response State
1	App starts and imports helmet and cors	No effect yet	No request	No response
2	Apply helmet middleware	Sets security headers on response	Waiting for request	Headers ready to add
3	Apply cors middleware	Allows cross-origin requests	Waiting for request	Headers ready to add
4	Incoming request arrives	Middleware chain starts	Request received	No response yet
5	helmet processes request	Adds security headers	Request unchanged	Security headers added
6	cors processes request	Adds CORS headers	Request unchanged	Security + CORS headers added
7	Request passed to route handler	Middleware done	Request ready for handler	Response headers set
8	Route handler sends response	Response sent with headers	Request handled	Response sent to client
9	Request cycle ends	Ready for next request	No request	No response

💡 Request processed through helmet and cors middleware, response sent with security and CORS headers.

Variable Tracker

Variable	Start	After Step 5	After Step 6	Final
Request	No request	Received	Received	Handled
Response Headers	Empty	Security headers added	Security + CORS headers added	Sent to client

Key Moments - 2 Insights

Why do we apply helmet and cors before route handlers?

Because middleware runs in order before routes, so applying helmet and cors first ensures all requests get security and CORS headers before reaching routes, as shown in steps 5 and 6.

Does middleware change the request data?

No, in this example helmet and cors mainly add headers to the response, they do not modify the request object, as seen in the 'Request unchanged' state in steps 5 and 6.

Visual Quiz - 3 Questions

Look at the execution table, at which step does helmet add security headers?

A Step 7

B Step 3

C Step 5

D Step 2

💡 Hint

Check the 'Middleware Effect' column for helmet processing in the execution table.

According to the variable tracker, what is the state of Response Headers after Step 6?

A Empty

B Security + CORS headers added

C Security headers added

D Sent to client

💡 Hint

Look at the 'Response Headers' row in variable_tracker after Step 6.

If we remove cors middleware, what changes in the execution table?

A No CORS headers added in response

B Helmet will not add security headers

C Request will not reach route handler

D Response will not be sent

💡 Hint

Refer to the middleware effects in steps 5 and 6 in the execution table.

Concept Snapshot

Third-party middleware like helmet and cors are functions applied globally in NestJS.
They run before route handlers to modify requests or responses.
Helmet adds security headers; cors enables cross-origin requests.
Apply middleware with app.use() before routes.
Middleware order matters: earlier middleware runs first.
This setup improves app security and compatibility.

Full Transcript

In NestJS, third-party middleware such as helmet and cors are imported and applied globally using app.use(). When the app starts, these middleware are ready to process incoming requests. Each request passes through helmet first, which adds security headers to the response, then through cors, which adds headers to allow cross-origin requests. After middleware processing, the request reaches the route handler, which sends the response back to the client with the added headers. The variable tracker shows that the request object remains unchanged by these middleware, while the response headers accumulate security and CORS information. This flow ensures all responses are secure and accessible from other origins. Middleware order is important because it determines the sequence of processing. Removing cors middleware would mean no CORS headers are added, potentially blocking cross-origin requests.

Practice

1. What is the main purpose of using cors middleware in a NestJS application?

easy

A. To add security headers to HTTP responses

B. To control which websites can access your API

C. To log all incoming requests

D. To compress response data for faster delivery

Solution

1. Step 1: Understand the role of CORS

   CORS (Cross-Origin Resource Sharing) middleware controls which external websites or domains can access your API resources.

2. Step 2: Differentiate from other middleware

   Helmet adds security headers, logging middleware logs requests, and compression middleware compresses data. Only CORS controls access from other origins.

3. Final Answer:

   To control which websites can access your API -> Option B

4. Quick Check:

   CORS controls access = B [OK]

Hint: Remember CORS controls cross-site access permissions [OK]

Common Mistakes:

• Confusing CORS with Helmet's security headers
• Thinking CORS logs requests
• Assuming CORS compresses data

2. Which of the following is the correct way to apply Helmet middleware in a NestJS app?

easy

A. app.apply(helmet)

B. app.helmet()

C. app.use(helmet())

D. app.useHelmet()

Solution

1. Step 1: Recall NestJS middleware usage

   In NestJS, third-party middleware like Helmet is applied using app.use() with the middleware function called.

2. Step 2: Check syntax correctness

   The correct syntax is app.use(helmet()). Other options are not valid NestJS methods or miss calling the function.

3. Final Answer:

   app.use(helmet()) -> Option C

4. Quick Check:

   Use app.use() with middleware function call = A [OK]

Hint: Use app.use() with middleware function call [OK]

Common Mistakes:

• Forgetting to call helmet as a function
• Using non-existent app methods like app.helmet()
• Passing helmet without parentheses

3. Given this NestJS setup code, what will be the effect of the middleware?

import * as helmet from 'helmet';
import * as cors from 'cors';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.use(cors({ origin: 'https://example.com' }));
  app.use(helmet());
  await app.listen(3000);
}

medium

A. Only requests from https://example.com are allowed, and security headers are added

B. All requests are allowed, but no security headers are added

C. Requests from any origin are blocked, and no headers are added

D. Requests from https://example.com are blocked, but security headers are added

Solution

1. Step 1: Analyze CORS middleware configuration

   The CORS middleware is configured to allow only requests from 'https://example.com'. Requests from other origins will be blocked.

2. Step 2: Analyze Helmet middleware effect

   Helmet adds security headers to all responses to improve security.

3. Final Answer:

   Only requests from https://example.com are allowed, and security headers are added -> Option A

4. Quick Check:

   CORS origin restrict + Helmet headers = C [OK]

Hint: Check CORS origin and Helmet adds headers [OK]

Common Mistakes:

• Assuming all origins are allowed
• Thinking Helmet blocks requests
• Confusing CORS blocking with allowing

4. Identify the error in this NestJS middleware setup:

import * as cors from 'cors';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.use(cors);
  await app.listen(3000);
}

medium

A. Missing await before app.use(cors)

B. cors should be imported from '@nestjs/cors' instead

C. app.use() cannot be used for middleware

D. Missing parentheses to call cors function

Solution

1. Step 1: Check how cors is used

   The code passes cors directly without calling it as a function. Middleware functions must be called to return the actual middleware.

2. Step 2: Confirm correct usage

   The correct usage is app.use(cors()). Other options are incorrect because NestJS supports app.use(), and no await is needed for middleware.

3. Final Answer:

   Missing parentheses to call cors function -> Option D

4. Quick Check:

   Middleware must be called as function = A [OK]

Hint: Always call middleware functions with () in app.use() [OK]

Common Mistakes:

• Passing middleware reference without calling it
• Confusing import sources for cors
• Trying to await app.use()

5. You want to secure your NestJS API by allowing only requests from https://myapp.com and add security headers. Which code snippet correctly applies both cors and helmet middleware with these requirements?

hard

A. app.use(cors({ origin: 'https://myapp.com' })); app.use(helmet());

B. app.use(helmet()); app.use(cors());

C. app.use(cors()); app.use(helmet({ origin: 'https://myapp.com' }));

D. app.use(cors({ origin: '*' })); app.use(helmet());

Solution

1. Step 1: Configure CORS with specific origin

   To allow only 'https://myapp.com', pass { origin: 'https://myapp.com' } to cors middleware.

2. Step 2: Apply Helmet middleware correctly

   Helmet is applied with helmet() to add security headers. It does not take origin options.

3. Step 3: Verify order and correctness

   Applying CORS first with correct origin, then Helmet, matches the requirements. Other options either miss origin restriction or misuse Helmet options.

4. Final Answer:

   app.use(cors({ origin: 'https://myapp.com' })); app.use(helmet()); -> Option A

5. Quick Check:

   CORS origin set + Helmet default = D [OK]

Hint: Set origin in cors, call helmet() without options [OK]

Common Mistakes:

• Passing origin option to helmet instead of cors
• Allowing all origins with '*'
• Reversing middleware order causing unexpected behavior