CORS in Express.js: 3 Practical Examples

Understanding CORS in Express.js

Cross-Origin Resource Sharing (CORS) is a security feature that allows or restricts resources on a web page to be requested from another domain outside the domain from which the resource originated. If you’re building an API using Express.js, you’ll likely encounter scenarios where you need to enable CORS. This guide provides three practical examples to help you implement CORS effectively in your Express.js applications.

Example 1: Enabling CORS for All Routes

Use Case

You want to allow all domains to access your API, which is common during development or when you want to keep things simple.

const express = require('express');
const cors = require('cors');

const app = express();

// Use CORS Middleware
app.use(cors());

app.get('/api/data', (req, res) => {
    res.json({ message: 'This is public data accessible from any domain.' });
});

app.listen(3000, () => {
    console.log('Server running on http://localhost:3000');
});

In this example, by using the cors() middleware without any options, you enable CORS for all routes in your application. This means that your API can be accessed from any domain.

Notes

• While this is convenient during development, you should consider restricting access in production to avoid security risks.

Example 2: Enabling CORS for Specific Domains

Use Case

You want to allow only specific domains to access your API, which is a more secure practice for production environments.

const express = require('express');
const cors = require('cors');

const app = express();

// Define allowed origins
const allowedOrigins = ['http://example.com', 'http://another-example.com'];

// Use CORS Middleware with options
app.use(cors({
    origin: function (origin, callback) {
        if (allowedOrigins.indexOf(origin) !== -1 || !origin) {
            callback(null, true);
        } else {
            callback(new Error('Not allowed by CORS'));
        }
    }
}));

app.get('/api/data', (req, res) => {
    res.json({ message: 'This data is accessible from specific domains.' });
});

app.listen(3000, () => {
    console.log('Server running on http://localhost:3000');
});

In this example, the cors() middleware is configured to only allow requests from specified origins. If a request comes from a domain not in the allowedOrigins array, it will be denied.

Notes

• This method helps enhance security by limiting access to known domains. Adjust the allowedOrigins array based on your requirements.

Example 3: Enabling CORS with Custom Headers

Use Case

You have an API that needs to support custom headers for certain functionalities, and you want to ensure that CORS is configured to allow these headers.

const express = require('express');
const cors = require('cors');

const app = express();

// Use CORS Middleware with custom headers
app.use(cors({
    exposedHeaders: ['X-Custom-Header'],
    allowedHeaders: ['Content-Type', 'Authorization'],
}));

app.get('/api/data', (req, res) => {
    res.set('X-Custom-Header', 'This is a custom header');
    res.json({ message: 'Data with custom headers.' });
});

app.listen(3000, () => {
    console.log('Server running on http://localhost:3000');
});

In this example, the exposedHeaders option allows the client to access the X-Custom-Header, while allowedHeaders specifies which headers can be sent in the request. This is especially useful for APIs that require authentication or other custom operations.

Notes

• Make sure to adjust the headers according to the needs of your application. This level of customization is vital for complex applications that interact with various clients.