Fix CORS Multiple Origin Values Error

In this tutorial, you'll learn about Fix CORS Multiple Origin Values Error. We cover key concepts, practical examples, and best practices.

The Access-Control-Allow-Origin header accepts only one origin or the wildcard *. When you set multiple origins separated by spaces or commas, the browser ignores the header entirely and blocks the request. This error often appears when supporting multiple frontend domains.

Wrong

The server tries to return multiple origins in a single header:

res.setHeader('Access-Control-Allow-Origin',
  'https://app.example.com https://admin.example.com');

Or using commas:

res.setHeader('Access-Control-Allow-Origin',
  'https://app.example.com, https://admin.example.com');

Access to fetch at 'https://api.example.com/data' from origin
'https://app.example.com' has been blocked by CORS policy:
The 'Access-Control-Allow-Origin' header contains multiple values
'https://app.example.com, https://admin.example.com', but only one is allowed.

Right

Dynamically read the request's Origin header, validate it against an allowlist, and echo back exactly that one origin.

const allowedOrigins = [
  'https://app.example.com',
  'https://admin.example.com',
  'https://staging.example.com',
];

app.use((req, res, next) => {
  const origin = req.headers.origin;
  if (allowedOrigins.includes(origin)) {
    res.setHeader('Access-Control-Allow-Origin', origin);
    res.setHeader('Vary', 'Origin');
  }
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization');
  if (req.method === 'OPTIONS') {
    return res.sendStatus(204);
  }
  next();
});

With the cors npm package:

const cors = require('cors');

const allowedOrigins = [
  'https://app.example.com',
  'https://admin.example.com',
];

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

The response now shows a single origin that matches the requesting domain:

Access-Control-Allow-Origin: https://admin.example.com
Vary: Origin

Prevention

• Never hardcode multiple origins in Access-Control-Allow-Origin. Use the dynamic origin pattern with an allowlist.
• Always send Vary: Origin when using dynamic origins so proxy caches work correctly.
• Use the cors npm package's callback-based origin option for production.
• Store the allowed origins list in an environment variable or configuration file.
• Include null in the allowlist if you need to support file:// or data: origins during testing.
• Test each origin individually with curl to confirm the header matches.

DodaTech Tools

Doda Browser's security panel flags responses with multiple Access-Control-Allow-Origin values and shows the exact spec violation. DodaZIP's API security scanner automatically detects this misconfiguration in backend deployments. Durga Antivirus Pro uses the dynamic origin pattern across all its microservice APIs to support both its web dashboard and admin panel.

FAQ