CORS configuration in Node.js - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to import the CORS middleware in a Node.js Express app.

Node.js

const express = require('express');
const cors = require('[1]');
const app = express();

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

Abody-parser

Bexpress

Chttp

Dcors

Attempts:

3 left

💡 Hint

Common Mistakes

Importing 'express' instead of 'cors'.

Forgetting to install the 'cors' package.

The cors package is imported to enable CORS middleware in Express.

2fill in blank

medium

Complete the code to enable CORS for all routes in the Express app.

Node.js

app.use([1]());

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

Aexpress

BbodyParser

Ccors

Dhelmet

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'express()' instead of 'cors()' as middleware.

Not calling the middleware as a function.

Using cors() as middleware enables CORS for all routes.

3fill in blank

hard

Fix the error in the CORS options object to allow only 'https://example.com'.

Node.js

const corsOptions = {
  origin: [1]
};

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

A'https://example.com'

B'*'

C['https://example.com']

Dtrue

Attempts:

3 left

💡 Hint

Common Mistakes

Using an array instead of a string for a single origin.

Using '*' which allows all origins.

The origin option should be a string with the allowed domain.

4fill in blank

hard

Fill both blanks to apply CORS middleware with options and start the server on port 3000.

Node.js

app.use([1](corsOptions));
app.listen([2], () => console.log('Server running'));

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

Acors

Bexpress

C3000

D8080

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'express' instead of 'cors' for middleware.

Using wrong port number.

Use cors(corsOptions) to apply CORS with options, and listen on port 3000.

5fill in blank

hard

Fill all three blanks to create a CORS options object allowing methods GET and POST, origin 'https://site.com', and enable credentials.

Node.js

const corsOptions = {
  origin: [1],
  methods: [2],
  credentials: [3]
};

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

A'https://site.com'

B['GET', 'POST']

Ctrue

Dfalse

Attempts:

3 left

💡 Hint

Common Mistakes

Using a string instead of an array for methods.

Setting credentials to false when true is needed.

The origin is a string, methods is an array of allowed methods, and credentials is a boolean.

Practice

1. What is the main purpose of configuring CORS in a Node.js server?

easy

A. To speed up server response time

B. To control which websites can access server resources

C. To encrypt data sent between client and server

D. To manage database connections

Solution

1. Step 1: Understand CORS role

   CORS (Cross-Origin Resource Sharing) controls which external websites can request resources from your server.

2. Step 2: Identify main purpose

   It is not about speed, encryption, or database management but about access control from different origins.

3. Final Answer:

   To control which websites can access server resources -> Option B

4. Quick Check:

   CORS controls access = A [OK]

Hint: Remember CORS = Cross-Origin Resource Sharing control [OK]

Common Mistakes:

• Confusing CORS with encryption or speed optimization
• Thinking CORS manages databases
• Assuming CORS is a security firewall

2. Which of the following is the correct way to import and use the cors middleware in an Express app?

easy

A. import cors from 'cors'; app.use(cors());

B. import cors from 'cors'; app.use(cors);

C. const cors = require('cors'); app.use(cors);

D. const cors = require('cors'); app.use(cors());

Solution

1. Step 1: Identify modern import syntax

   Using ES modules, the correct import is import cors from 'cors';.

2. Step 2: Use middleware correctly

   Middleware must be called as a function: app.use(cors()); not just cors.

3. Final Answer:

   import cors from 'cors'; app.use(cors()); -> Option A

4. Quick Check:

   Import + call middleware = D [OK]

Hint: Use import + call cors() as function [OK]

Common Mistakes:

• Forgetting parentheses when using middleware
• Mixing require and import syntax
• Using app.use(cors) without parentheses

3. Given this code snippet, what will be the CORS behavior?

import express from 'express';
import cors from 'cors';
const app = express();
app.use(cors({ origin: 'https://example.com' }));
app.get('/', (req, res) => res.send('Hello'));
app.listen(3000);

medium

A. Only requests from https://example.com will be allowed

B. Requests from any origin will be allowed

C. No requests will be allowed due to missing headers

D. Requests from localhost will be allowed only

Solution

1. Step 1: Analyze the origin option

   The cors middleware is configured with origin: 'https://example.com', which restricts access to that origin only.

2. Step 2: Understand effect on requests

   Requests from other origins will be blocked by CORS policy, so only https://example.com is allowed.

3. Final Answer:

   Only requests from https://example.com will be allowed -> Option A

4. Quick Check:

   origin restricts access = C [OK]

Hint: Check origin value to know allowed sites [OK]

Common Mistakes:

• Assuming all origins allowed by default
• Confusing origin with methods or headers
• Thinking localhost is allowed without explicit mention

4. Regarding this CORS setup code, which statement is accurate?

import express from 'express';
import cors from 'cors';
const app = express();
app.use(cors({ origin: ['https://site1.com', 'https://site2.com'] }));
app.listen(3000);

medium

A. Missing call to cors() function

B. The app.listen() call is missing a callback

C. The origin option can be an array

D. The cors package is not imported correctly

Solution

1. Step 1: Check origin option type

   The origin option in cors accepts an array directly for multiple static origins; it also supports string, boolean, regex, or function.

2. Step 2: Confirm other parts are correct

   The cors() function is called correctly, app.listen() works without callback, and import syntax is valid.

3. Final Answer:

   The origin option can be an array -> Option C

4. Quick Check:

   origin array valid = B [OK]

Hint: origin can be string, array, regex, or function [OK]

Common Mistakes:

• Thinking origin cannot accept an array
• Forgetting to call cors() as a function
• Thinking app.listen needs a callback always

5. You want to allow CORS requests only from https://trusted.com and http://localhost:3000. Which is the best way to configure the cors middleware in your Node.js app?

hard

A. Use origin as a function to check allowed origins dynamically

B. Set origin to '*' to allow all origins

C. Disable CORS middleware and handle manually

D. Set origin to an array of allowed origins directly

Solution

1. Step 1: Understand multiple origins handling

   The cors package accepts an array directly for origin with a static list of allowed origins. This is the simplest and best approach here.

2. Step 2: Evaluate options

   Use function for dynamic logic (e.g., regex or env-based). '*' allows all (insecure). Manual handling is error-prone and not recommended.

3. Final Answer:

   Set origin to an array of allowed origins directly -> Option D

4. Quick Check:

   Static multiple origins use array = C [OK]

Hint: Use array for static multiple origins [OK]

Common Mistakes:

• Using '*' to allow all origins insecurely
• Using a single string for multiple origins
• Disabling middleware instead of configuring properly