Swagger UI is blank because of Content-Security-Policy

Viewed 2546

I am trying to fix swagger UI with issue Content-Security-Policy. I am looking into a way to add a header or Springfox config option to fix the issue.

It is not able to load the UI and v2/api-doc is working fine.

Please suggest me a way to fix the issue.

2 Answers

This issue is due to fastify helmet for me.

import headers from "fastify-helmet";

Replacing the following in main.ts

app.register(headers)'

with

app.register(helmet, {
    contentSecurityPolicy: {
      directives: {
        defaultSrc: [`'self'`],
        styleSrc: [`'self'`, `'unsafe-inline'`],
        imgSrc: [`'self'`, 'data:', 'validator.swagger.io'],
        scriptSrc: [`'self'`, `https: 'unsafe-inline'`],
      },
    },
  })

resolved the issue:

Adding staticCSP: true worked for me:

server.register(fastifySwagger, {
    exposeRoute: true,
    routePrefix: '/documentation',
    staticCSP: true,
    swagger: {
        info: {
            title: 'whatever',
            description: 'something',
            version: '1.0.0'
        },
    },
});
Related