Third-party middleware (cors, helmet) in NestJS - Mini Project: Build & Apply

Using Third-party Middleware (cors, helmet) in NestJS

📖 Scenario: You are building a simple NestJS server for a small web app. You want to keep your app safe and allow requests from other websites properly.To do this, you will add two popular middlewares: cors to control which websites can talk to your server, and helmet to add security headers that protect your app.

🎯 Goal: Learn how to add and configure third-party middleware cors and helmet in a NestJS application to improve security and cross-origin request handling.

📋 What You'll Learn

Create a basic NestJS application with an AppModule and main.ts file

Add cors middleware with specific origin settings

Add helmet middleware for security headers

Configure middleware in the main.ts bootstrap function

💡 Why This Matters

🌍 Real World

Web servers often need to control which websites can access their data and protect themselves from attacks. Using middleware like cors and helmet helps keep apps safe and working well with other sites.

💼 Career

Backend developers use middleware configuration daily to secure APIs and manage cross-origin requests. Knowing how to add and configure third-party middleware in frameworks like NestJS is a key skill.

1

Create a basic NestJS application setup

In main.ts, import NestFactory from @nestjs/core and AppModule from ./app.module. Then create an async bootstrap function that creates the app with NestFactory.create(AppModule) and calls app.listen(3000).

NestJS

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  // Your code here
}

bootstrap();

Hint

Remember to import NestFactory and AppModule. Use await NestFactory.create(AppModule) to create the app and app.listen(3000) to start the server.

2

Add a configuration variable for CORS origin

Create a constant called corsOptions as an object with a single property origin set to 'https://example.com'. This will allow only this origin to access your server.

NestJS

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

const corsOptions = {
  // Your code here
};

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

bootstrap();

Hint

Create a constant corsOptions with origin set to 'https://example.com'.

3

Apply CORS and Helmet middleware in the bootstrap function

Inside the bootstrap function, before app.listen(3000), add app.enableCors(corsOptions) to enable CORS with your options. Then import helmet from helmet at the top and add app.use(helmet()) to apply security headers.

NestJS

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import helmet from 'helmet';

const corsOptions = {
  origin: 'https://example.com'
};

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  // Your code here
  await app.listen(3000);
}

bootstrap();

Hint

Import helmet and use app.use(helmet()). Use app.enableCors(corsOptions) to apply CORS settings.

4

Complete the NestJS app with middleware configured

Ensure the full main.ts file includes the imports for NestFactory, AppModule, and helmet, the corsOptions constant, and the bootstrap function that creates the app, applies cors and helmet middleware, and listens on port 3000.

NestJS

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import helmet from 'helmet';

const corsOptions = {
  origin: 'https://example.com'
};

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.enableCors(corsOptions);
  app.use(helmet());
  // Your code here
}

bootstrap();

Hint

Make sure all parts are included: imports, corsOptions, and the bootstrap function with middleware and server start.

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