cors middleware setup in Express - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What is the output when CORS middleware allows only example.com?

Consider this Express server setup using CORS middleware:

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 World');
});

app.listen(3000);

What happens if a browser from https://notallowed.com tries to fetch data from this server?

A The server responds normally and the browser accepts the response.

B The browser blocks the response due to CORS policy.

C The server returns a 404 error.

D The server crashes with an error.

💡 Hint

Think about what CORS does when the origin is not in the allowed list.

The CORS middleware restricts access to only requests from 'https://example.com'. Requests from other origins like 'https://notallowed.com' will be blocked by the browser due to CORS policy.

📝 Syntax

intermediate

Which option correctly sets up CORS to allow all origins?

Which of the following code snippets correctly configures the Express CORS middleware to allow requests from any origin?

A app.use(cors());

B app.use(cors({ origin: null }));

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

D app.use(cors({ origin: false }));

💡 Hint

Check the default behavior of the CORS middleware when no options are passed.

Calling cors() without options allows all origins by default (equivalent to {origin: true}). {origin: '*'} also allows all origins.

🔧 Debug

advanced

Why does this CORS setup cause a runtime error?

Examine this Express server code snippet:

import express from 'express';
import cors from 'cors';

const app = express();

app.use(cors({ origin: '*', credentials: true }));

app.get('/', (req, res) => {
  res.send('Hello');
});

app.listen(3000);

When running this code, the server crashes with an error related to the CORS origin option. Why?

A The CORS middleware does not support HTTPS URLs.

B The app.listen call is missing a callback function.

C The origin array must be wrapped inside another object.

D The origin '*' cannot be used when credentials: true.

💡 Hint

Check the compatibility between origin and credentials options.

The CORS middleware throws an error when origin: '*' is used with credentials: true because credentials require specific allowed origins for security reasons.

🧠 Conceptual

advanced

What is the purpose of the 'optionsSuccessStatus' option in CORS middleware?

In the CORS middleware configuration, what does setting optionsSuccessStatus do?

A It sets the HTTP status code sent for successful OPTIONS preflight requests.

B It specifies the allowed HTTP methods for CORS.

C It disables CORS for OPTIONS requests.

D It defines the maximum age for caching CORS headers.

💡 Hint

Think about how browsers check permissions before sending actual requests.

The optionsSuccessStatus option sets the status code returned for successful OPTIONS preflight requests, often set to 200 to support older browsers that do not handle 204 well.

❓ state_output

expert

What is the value of the 'Access-Control-Allow-Origin' header for this request?

Given this Express server code:

import express from 'express';
import cors from 'cors';

const app = express();

const whitelist = ['https://allowed.com', 'https://trusted.com'];

app.use(cors({
  origin: (origin, callback) => {
    if (!origin || whitelist.includes(origin)) {
      callback(null, true);
    } else {
      callback(new Error('Not allowed by CORS'));
    }
  }
}));

app.get('/', (req, res) => {
  res.send('Welcome');
});

app.listen(3000);

If a request comes from https://allowed.com, what will be the value of the Access-Control-Allow-Origin header in the response?

A undefined (header not set)

B '*'

C 'https://allowed.com'

D 'https://trusted.com'

💡 Hint

Look at how the origin callback controls allowed origins.

The callback allows origins in the whitelist. For 'https://allowed.com', the header is set exactly to that origin.