The module by default will register global middlewares and route roules 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).
You can add global configuration to the module like following:
export default defineNuxtConfig({ security: { rateLimiter: { tokensPerInterval: 2, interval: 'hour', } }})
You can disable them from the module configuration like following:
export default defineNuxtConfig({ security: { rateLimiter: false }})
In general, the security
object in nuxt configuration should be used to register functionality that will be used globally in your application. For per route configuration, check out the next section.
By default, middlewares are configured to work globally, but you can easily configure them per route by using routeRules
:
export default defineNuxtConfig({ routeRules: { '/custom-route': { security: { rateLimiter: { tokensPerInterval: 2, interval: 'hour', } } } }})
By adding this you will have global middleware for all routes (regarding rate limiting) and specific configuration to the /custom-route
route.
You can also disable certain middlewares per route like following:
export default defineNuxtConfig({ routeRules: { '/custom-route': { security: { rateLimiter: false } } }})
per-route
configuration.type MiddlewareConfiguration<MIDDLEWARE> = { value: MIDDLEWARE; route: string;};
security
object in nuxt.config.ts
to register global functionality and routeRules
for per-route configuration.All module configuration is the following type:
interface ModuleOptions { headers: SecurityHeaders | false; requestSizeLimiter: RequestSizeLimiter | false; rateLimiter: RateLimiter | false; xssValidator: XssValidator | false; corsHandler: CorsOptions | false; allowedMethodsRestricter: AllowedHTTPMethods | false; hidePoweredBy: boolean; basicAuth: BasicAuth | boolean; enabled: boolean; csrf: CsrfOptions | boolean;}
All above ModuleOptions
are explained in more details in the next chapter
This module will by default set the following configuration options to enable middlewares and route roules:
security: { headers: { crossOriginResourcePolicy: 'same-origin', crossOriginOpenerPolicy: 'same-origin', crossOriginEmbedderPolicy: 'require-corp', contentSecurityPolicy: { 'base-uri': ["'self'"], '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'"], '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, }, rateLimiter: { // Twitter search rate limiting tokensPerInterval: 150, interval: "hour", fireImmediately: true, }, xssValidator: {}, corsHandler: { origin: '*', methods: ['GET','HEAD','PUT','PATCH','POST','DELETE'], preflight: { statusCode: 204 } }, allowedMethodsRestricter: '*', hidePoweredBy: true, basicAuth: false, enabled: true, csrf: false,}
To read more about every security middleware, go to that middleware page in security
section.
In order to make this module work with Nuxt DevTools add following configuration to your projects:
export default defineNuxtConfig({ modules: ['nuxt-security', '@nuxt/devtools'], security: { headers: { crossOriginEmbedderPolicy: process.env.NODE_ENV === 'development' ? 'unsafe-none' : 'require-corp', }, },});