Compression and security headers in NestJS - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to enable compression middleware in a NestJS application.

NestJS

import * as compression from 'compression';

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

Drag options to blanks, or click blank then click option'

Ahelmet

Bmorgan

Ccors

Dcompression

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'helmet' instead of 'compression' for compression.

Forgetting to call the middleware as a function.

The compression middleware compresses response bodies to improve performance. You add it to the app with app.use(compression()).

2fill in blank

medium

Complete the code to add security headers using Helmet in a NestJS app.

NestJS

import * as helmet from 'helmet';

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

Drag options to blanks, or click blank then click option'

Ahelmet

Bcompression

Ccors

DbodyParser

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'compression' instead of 'helmet' for security headers.

Not calling the middleware function.

Helmet helps secure your app by setting various HTTP headers. You add it with app.use(helmet()).

3fill in blank

hard

Fix the error in the code to properly apply both compression and helmet middleware.

NestJS

import * as compression from 'compression';
import * as helmet from 'helmet';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.use(compression());
  app.use([1]);
  await app.listen(3000);
}

Drag options to blanks, or click blank then click option'

Ahelmet()

Bhelmet

Chelmet.apply()

Dhelmet.use()

Attempts:

3 left

💡 Hint

Common Mistakes

Passing 'helmet' without parentheses causes runtime errors.

Trying to call non-existent methods like 'apply' or 'use' on helmet.

You must call helmet() as a function to get the middleware. Using just helmet passes the module, not the middleware function.

4fill in blank

hard

Fill both blanks to create a NestJS middleware setup that uses compression and helmet with custom options.

NestJS

import * as compression from 'compression';
import * as helmet from 'helmet';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.use([1]({ threshold: 1024 }));
  app.use([2]({ contentSecurityPolicy: false }));
  await app.listen(3000);
}

Drag options to blanks, or click blank then click option'

Acompression

Bcors

Chelmet

DbodyParser

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up compression and helmet in the wrong blanks.

Using middleware that does not support these options.

Use compression with a threshold option to compress responses larger than 1024 bytes. Use helmet with contentSecurityPolicy: false to disable that specific header.

5fill in blank

hard

Fill all three blanks to configure a NestJS app with compression, helmet, and CORS middleware with options.

NestJS

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

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.use([1]({ level: 6 }));
  app.use([2]({ frameguard: { action: 'deny' } }));
  app.use([3]({ origin: 'https://example.com' }));
  await app.listen(3000);
}

Drag options to blanks, or click blank then click option'

Acompression

Bhelmet

Ccors

DbodyParser

Attempts:

3 left

💡 Hint

Common Mistakes

Not calling middleware functions with parentheses.

Using wrong options for each middleware.

Use compression with a compression level option. Use helmet to set frameguard header to deny framing. Use cors to allow requests only from 'https://example.com'.

Practice

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

easy

A. To reduce the size of response data sent to clients

B. To add security headers to HTTP responses

C. To log incoming requests for debugging

D. To handle database connections efficiently

Solution

1. Step 1: Understand what compression middleware does

   The compression middleware compresses HTTP response bodies to reduce their size.

2. Step 2: Identify the effect on client-server communication

   Smaller response sizes mean faster data transfer and improved app speed.

3. Final Answer:

   To reduce the size of response data sent to clients -> Option A

4. Quick Check:

   Compression = smaller response size [OK]

Hint: Compression shrinks data sent to users for speed [OK]

Common Mistakes:

• Confusing compression with security features
• Thinking compression logs requests
• Assuming compression manages databases

2. Which of the following is the correct way to apply helmet middleware in a NestJS main.ts file?

easy

A. app.apply(helmet);

B. app.helmet();

C. helmet(app);

D. app.use(helmet());

Solution

1. Step 1: Recall the NestJS middleware usage pattern

   Middleware is applied using app.use() with the middleware function as argument.

2. Step 2: Check the syntax for helmet middleware

   The correct syntax is app.use(helmet()); to apply helmet with default settings.

3. Final Answer:

   app.use(helmet()); -> Option D

4. Quick Check:

   Middleware applied with app.use() [OK]

Hint: Use app.use() to add middleware like helmet [OK]

Common Mistakes:

• Calling helmet as a method on app
• Passing app as argument to helmet
• Using app.apply() which is invalid

3. Given this NestJS setup in main.ts:

import * as compression from 'compression';
import * as helmet from 'helmet';

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

What will be the effect on HTTP responses?

medium

A. No effect; middleware is not applied correctly

B. Responses will be compressed and have security headers added

C. Responses will only have security headers, no compression

D. Responses will only be compressed, no security headers

Solution

1. Step 1: Analyze middleware usage in the code

   Both compression() and helmet() are applied using app.use(), which is correct.

2. Step 2: Understand middleware effects

   Compression middleware compresses responses; helmet adds security headers.

3. Final Answer:

   Responses will be compressed and have security headers added -> Option B

4. Quick Check:

   Both compression and helmet applied = compressed + secure headers [OK]

Hint: Both middlewares applied means both effects present [OK]

Common Mistakes:

• Thinking only one middleware works at a time
• Assuming middleware needs special chaining
• Believing middleware is ignored without extra config

4. Identify the error in this NestJS main.ts snippet:

import helmet from 'helmet';

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

medium

A. helmet is not called as a function before passing to app.use

B. helmet should be imported with * as helmet from 'helmet'

C. app.listen should be called before app.use

D. NestFactory.create requires an options object

Solution

1. Step 1: Check how helmet middleware is passed

   Middleware functions must be called to return a function; here helmet is passed without parentheses.

2. Step 2: Confirm correct usage

   The correct usage is app.use(helmet()); to apply helmet middleware.

3. Final Answer:

   helmet is not called as a function before passing to app.use -> Option A

4. Quick Check:

   Middleware must be called: helmet() [OK]

Hint: Always call middleware functions before app.use [OK]

Common Mistakes:

• Passing middleware reference without calling it
• Importing helmet incorrectly but that still works with default export
• Calling app.listen before middleware setup

5. You want to add compression and security headers in a NestJS app but only compress responses larger than 1KB and disable the X-Powered-By header. Which setup achieves this?

hard

A. app.use(compression({ minSize: 1024 })); app.use(helmet({ hidePoweredBy: true }));

B. app.use(compression({ threshold: 1024 })); app.use(helmet.hidePoweredBy());

C. app.use(compression({ threshold: 1024 })); app.use(helmet({ hidePoweredBy: true }));

D. app.use(compression()); app.use(helmet({ disablePoweredBy: true }));

Solution

1. Step 1: Configure compression threshold correctly

   The compression middleware option to set minimum size is threshold, so { threshold: 1024 } means compress responses over 1KB.

2. Step 2: Disable X-Powered-By header using helmet option

   Helmet's option to hide this header is hidePoweredBy: true.

3. Final Answer:

   app.use(compression({ threshold: 1024 })); app.use(helmet({ hidePoweredBy: true })); -> Option C

4. Quick Check:

   Compression threshold + hidePoweredBy option [OK]

Hint: Use compression threshold and helmet hidePoweredBy option [OK]

Common Mistakes:

• Using wrong option name like minSize or disablePoweredBy
• Calling helmet.hidePoweredBy() which does not exist
• Not setting threshold causing all responses compressed