/koa-stateless-csrf

Stateless CSRF implementation for Koa based APIs

Primary LanguageTypeScriptBSD 2-Clause "Simplified" LicenseBSD-2-Clause

Koa Stateless CSRF

Release codecov

Stateless CSRF implementation for Koa based APIs, based on the nosurf implementation.

It includes protection against BREACH attacks.

Installation

Run npm i koa-stateless-csrf

Quickstart

To add CSRF protection to your API, simply add the CSRF middleware to your Koa application:

import {csrfMiddleware} from 'koa-stateless-csrf';

app.use(csrfMiddleware());

This will configure the CSRF middleware with the default cookie name csrf_token and default header name X-CSRF-Token. Both can be changed via the middleware options.

In order for frontends to be able to read and send the X-CSRF-Token request and response header, you need to configure CORS accordingly. It is highly recommended to limit the CORS origin for this, so malicious websites cannot read or send the token.

Handling CSRF on the frontend

In order for the frontend to retrieve a CSRF token, it can call any endpoint configured after the CSRF middleware. To do so, send a request with X-CSRF-Token header set to fetch. The response will have a masked X-CSRF-Token response header with the value to use. This value is valid until the end of the browser session, after which the cookie will expire and a new token will be generated.

If for whatever reason the CSRF cookie token was deleted or tampered, and thus the token available on the frontend is not valid anymore, you will receive a 400 error, with a new valid token supplied in the response header.

In order for your frontend to recognize and potentially retry the request, the error emitted by the middleware is a http error with its name set to CsrfError. You should forward this information to the frontend.

Cookie options

Cookies will always be set as http-only and default to a path of /. This is sufficient for development, but in production you should set the following options:

import {csrfMiddleware} from 'koa-stateless-csrf';

app.use(csrfMiddleware({
    cookieOptions: {
        // If you API lives on the same exact domain as the frontend,
        // use that domain, otherwise use their parent domain
        domain: 'example.com',
        // Only serve the API over HTTPS
        secure: true,
        // Only allow the cookie to be sent from the same root domain
        sameSite: 'strict',
    },
}));

Disabling CSRF for non-browser clients

By default, CSRF protection is always active. This might be undesired if your API serves both browser and non-browser clients (e.g. native apps).

To solve this, you can enable the disableWithoutOrigin option. To not be susceptible to CSRF attacks, your application must then adhere to the following when no Origin header is present:

  • Do not send any cookies to the client. This is to prevent things like login CSRF attacks.
  • Only accept authentication via headers and ignore any cookies.

Note: This is only feasible when your API sits on its own (sub-)domain, so that every request is a cross-origin request performed via fetch. On same-origin requests, browsers can omit the Origin header for GET requests or when a request is done via a <form> submit.

Only allow specific origins

Normally every origin is allowed to perform requests. To add defense in depth, you can allow only specific origins to perform requests; any other origins will be denied.

To do so, set the allowedOrigins option to an array of origins you want to allow. An origin is defined as the combination of scheme, host and optionally the port (e.g. http://localhost:8000 or https://my.site.