Configuration

Nuxt Security is configured with sensible defaults.

The module by default will register global middleware and route rules to make your application more secure. You can also modify or disable any of middlewares/routes or your project cannot use them (i.e. some Statically Generated websites will not be able to use middlewares).

Types

All module configuration is the following type:

interface ModuleOptions {
  strict: boolean;
  headers: SecurityHeaders | false;
  requestSizeLimiter: RequestSizeLimiter | false;
  rateLimiter: RateLimiter | false;
  xssValidator: XssValidator | false;
  corsHandler: CorsOptions | false;
  allowedMethodsRestricter: AllowedHTTPMethods | false;
  hidePoweredBy: boolean;
  basicAuth: BasicAuth | false;
  enabled: boolean;
  csrf: CsrfOptions | false;
  nonce: boolean;
  removeLoggers: RemoveOptions | false;
  ssg: Ssg | false;
  sri: boolean;
}

All above ModuleOptions are explained in more details in the next sections.

Defaults

This module will automatically set default values for each option.

By default, this module chooses reasonable defaults that ensure that your application will not break. The following configuration options are set:

security: {
  strict: false,
  headers: {
    crossOriginResourcePolicy: 'same-origin',
    crossOriginOpenerPolicy: 'same-origin',
    crossOriginEmbedderPolicy: 'credentialless',
    contentSecurityPolicy: {
      'base-uri': ["'none'"],
      'font-src': ["'self'", 'https:', 'data:'],
      'form-action': ["'self'"],
      'frame-ancestors': ["'self'"],
      'img-src': ["'self'", 'data:'],
      'object-src': ["'none'"],
      'script-src-attr': ["'none'"],
      'style-src': ["'self'", 'https:', "'unsafe-inline'"],
      'script-src': ["'self'", 'https:', "'unsafe-inline'", "'strict-dynamic'", "'nonce-{{nonce}}'"],
      'upgrade-insecure-requests': true
    },
    originAgentCluster: '?1',
    referrerPolicy: 'no-referrer',
    strictTransportSecurity: {
      maxAge: 15552000,
      includeSubdomains: true,
    },
    xContentTypeOptions: 'nosniff',
    xDNSPrefetchControl: 'off',
    xDownloadOptions: 'noopen',
    xFrameOptions: 'SAMEORIGIN',
    xPermittedCrossDomainPolicies: 'none',
    xXSSProtection: '0',
    permissionsPolicy: {
      camera: [],
      'display-capture': [],
      fullscreen: [],
      geolocation: [],
      microphone: []
    }
  },
  requestSizeLimiter: {
    maxRequestSizeInBytes: 2000000,
    maxUploadFileRequestInBytes: 8000000,
    throwError: true
  },
  rateLimiter: {
    tokensPerInterval: 150,
    interval: 300000,
    headers: false,
    driver: {
      name: 'lruCache'
    },
    throwError: true
  },
  xssValidator: {
    throwError: true
  },
  corsHandler: {
    origin: serverlUrl,
    methods: ['GET', 'HEAD', 'PUT', 'PATCH', 'POST', 'DELETE'],
    preflight: {
      statusCode: 204
    },
  },
  allowedMethodsRestricter: {
    methods: '*',
    throwError: true
  },
  hidePoweredBy: true,
  basicAuth: false,
  enabled: true,
  csrf: false,
  nonce: true,
  removeLoggers: {
    external: [],
    consoleType: ['log', 'debug'],
    include: [/\.[jt]sx?$/, /\.vue\??/],
    exclude: [/node_modules/, /\.git/]
  },
  ssg: {
    meta: true,
    hashScripts: true,
    hashStyles: false,
    nitroHeaders: true,
    exportToPresets: true,
  },
  sri: true
}
To modify these default settings and further increase the security of your application, read about our strict mode and our user-friendly approach on how to Improve Security

Overriding a layer's configuration

If you extend a Nuxt Layer which adds nuxt-security, you can override that layer's nuxt-security configuration or parts of it by defining a module in your project's nuxt.config.ts. Here is an example that illustrates how to remove the 'none' value set by default for object-src:

export default defineNuxtConfig(
  {
    extends: 'some-layer-adding-nuxt-security',
    modules: [
      (_options, nuxt) => {
        const nuxtConfigSecurity = nuxt.options.security
        if (
          typeof nuxtConfigSecurity.headers !== 'boolean' &&
          nuxtConfigSecurity.headers.contentSecurityPolicy &&
          typeof nuxtConfigSecurity.headers.contentSecurityPolicy !==
            'boolean' &&
          typeof nuxtConfigSecurity.headers.contentSecurityPolicy !==
            'string' &&
          nuxtConfigSecurity.headers.contentSecurityPolicy['object-src']
        ) {
          nuxtConfigSecurity.headers.contentSecurityPolicy['object-src'] =
            nuxtConfigSecurity.headers.contentSecurityPolicy[
              'object-src'
            ].filter((x) => x !== "'none'")
        }
        console.log(nuxt.options.security)
      },
    ],
  }
)

Of course it's possible to define the module shown above using a file in the modules directory as well.

Edit this page on GitHub
Table of Contents