window.opener is null in oauth2-redirect.html

[dan-cooke]

I have read all previously closed issues relating to this subject, but most answers are not very detailed.

I am using @nestjs/swagger for my swagger-ui.

Here is what my setup looks like

// I had to turn of CSP briefly, as the scripts on oauth2-redirect.html were not allowed to execute for some reason
  app.use(
    helmet({
      contentSecurityPolicy: false,
    }),
  );

  const config = new DocumentBuilder()
    .setTitle('ReNeuro API')
    .setVersion('1.0')
    .addOAuth2({
      type: 'oauth2',
      flows: {
        authorizationCode: {
          authorizationUrl: process.env.SWAGGER_AUTHORIZATION_URL,
          scopes: [],
        },
      },
    })
    .build();

  SwaggerModule.setup('docs', app, document, {
    swaggerOptions: {
      oauth: {
        clientId: process.env.SWAGGER_COGNITO_CLIENT_ID,
        clientSecret: process.env.SWAGGER_COGNITO_CLIENT_SECRET,
      },
    },
  });

When I click "Authorize"

I can login via my provider (cognito), and it successfully puts the code into the URL, but my oauth2-redirect.html page throws the following error:

Uncaught TypeError: Cannot read properties of null (reading 'swaggerUIRedirectOauth2')
    at run (oauth2-redirect.html)

I have tested on Firefox and Chrome, same issue.

Any help with this would be really appreciated

[MiniMarker]

Hi!

Me and my team are also affected by this issue, the only solution is to remove the helmet middleware. But that is not the best solution for the problem 🙈

[MiniMarker]

Hi again!

We figured it out.

app.use(
	helmet({
		contentSecurityPolicy: {
			directives: {
				...helmet.contentSecurityPolicy.getDefaultDirectives(),
				'script-src': [ '\'self\'', '\'sha256-g6TK8Crx7YtGVUN10j0q8wD3cvwyzlvBMzQx4UjBPg4=\'' ],
				'connect-src': [
					'\'self\'',
					`<YOUR_TOKEN_ENDPOINT>`,
				],
			},
		},
		crossOriginOpenerPolicy: {
			policy: 'unsafe-none',
		},
	}),
);

The SHA-hash is for explicitly allowing only the inline script provided by swagger, this hash may not work for you and will change if swagger changes the script in an update in the future.
If the hash doesn't work for you, just replace it with the correct hash for you (the correct hash should be printed in the console)

Then insert the url used to fetching of a new token.

It is also a good idea to pin all the the swagger related dependencies to a given version in your project.

[dan-cooke]

@MiniMarker you legend. Nice one, thanks for the update I’ll try this out

[dan-cooke]

@MiniMarker looks like this is not working for me, I get a different error now - it says my root /docs endpoint is not found after re-directing. Makes absolutely no sense because when i refresh the page it then finds it no problem.

Edit: turns out the not found error was because I had used the wrong token endpoint.

After following your advice, all is working now perfectly in our staging environment and locally.

Nice one!