Helmet

Helmet peut aider à protéger votre application de certaines vulnérabilités web connues en configurant correctement les en-têtes HTTP. En général, Helmet est juste une collection de petites fonctions middleware qui définissent les en-têtes HTTP liés à la sécurité (lisez plus).

Astuce

Notez que l’application de helmet en tant que middleware global ou son enregistrement doit se faire avant d’autres appels à app.use() ou à des fonctions de configuration qui pourraient appeler app.use(). Ceci est dû à la manière dont fonctionne la plateforme sous-jacente (c’est-à-dire Express ou Fastify), où l’ordre dans lequel les middleware/routes sont définis est important. Si vous utilisez des middleware comme helmet ou cors après avoir défini une route, alors ce middleware ne s’appliquera pas à cette route, il ne s’appliquera qu’aux routes définies après le middleware.

Utilisation avec Express (par défaut)

Commencez par installer le package requis.

$ npm i --save helmet

Une fois l’installation terminée, appliquez-le comme middleware global.

Appliquer Helmet dans votre application Express

import helmet from 'helmet';
// quelque part dans votre fichier d'initialisation
app.use(helmet());

Attention

Lorsque vous utilisez helmet, @apollo/server (4.x), et le Apollo Sandbox, il peut y avoir un problème avec CSP sur l’Apollo Sandbox. Pour résoudre ce problème, configurez le CSP comme indiqué ci-dessous :

app.use(helmet({
  crossOriginEmbedderPolicy: false,
  contentSecurityPolicy: {
    directives: {
      imgSrc: ['self', 'data:', 'apollo-server-landing-page.cdn.apollographql.com'],
      scriptSrc: ['self', 'unsafe-inline'],
      manifestSrc: ['self', 'apollo-server-landing-page.cdn.apollographql.com'],
      frameSrc: ['self', 'sandbox.embed.apollographql.com'],
    },
  },
}));

Utilisation avec Fastify

Si vous utilisez le FastifyAdapter, installez le package @fastify/helmet :

$ npm i --save @fastify/helmet

fastify-helmet ne doit pas être utilisé en tant que middleware, mais en tant que plugin Fastify, c’est-à-dire en utilisant app.register() :

Enregistrement de Helmet dans votre application Fastify

import helmet from '@fastify/helmet';
// quelque part dans votre fichier d'initialisation
await app.register(helmet);

Danger

Lorsque vous utilisez apollo-server-fastify et @fastify/helmet, il peut y avoir un problème avec CSP sur le playground GraphQL. Pour résoudre ce problème, configurez le CSP comme indiqué ci-dessous :

await app.register(fastifyHelmet, {
  contentSecurityPolicy: {
    directives: {
      defaultSrc: ['self', 'unpkg.com'],
      styleSrc: ['self', 'unsafe-inline', 'cdn.jsdelivr.net', 'fonts.googleapis.com'],
      fontSrc: ['self', 'fonts.gstatic.com', 'data:'],
      imgSrc: ['self', 'data:', 'cdn.jsdelivr.net'],
      scriptSrc: ['self', 'unsafe-inline', 'cdn.jsdelivr.net', 'unsafe-eval'],
    },
  },
});
// Si vous n'allez pas utiliser CSP du tout, vous pouvez utiliser ceci :
await app.register(fastifyHelmet, {
  contentSecurityPolicy: false,
});