CODEWITHSUNDEEP
node.jsswaggerswagger-uiopenapi
CodeConnoisseur
CodeConnoisseur

Reputation: 1869

Unable To Send Bearer Token in Authorization Header In Swagger-ui-express npm

I am running an express/node application and am documenting my api using "swagger-ui-express": "^4.5.0",. I have set up a requirement of needing a jsonwebtoken bearer token to be sent with all requests to any endpoint in my api.

I have the swagger docs loaded and working properly but now when trying to figure out how to pass the Authorization: Bearer <token> to all my endpoints, it doesn't seem to work. I am able to add the securitySchemes + child options and I get the green Authorize button in my swagger docs, but when I enter a bearer token and send off the request the loading spinner keeps spinning and never sends the request. I have morgan logging set up in my app so I can see that the request to my endpoint never gets sent or logged.

How do I send a bearer token to requests sent from swagger UI?

In app.js I have this route which loads properly in localhost

// Single entry point for swagger docs
router.use(
  '/swaggerDocs',
  swaggerDoc.serve,
  swaggerDoc.setup(swaggerDocumentation),
);

swaggerDocumentation from above snippet (config file).

import getCountryRegions from './getCountryRegions.doc.js';

export default {
  openapi: '3.0.3',
  info: {
    title: 'Node/express rest api app',
    version: '0.0.1',
  },
  components: {
    securitySchemes: {
      bearerAuth: {
        type: 'http',
        in: 'header',
        name: 'Authorization',
        description: 'Bearer Token',
        scheme: 'bearer',
        bearerFormat: 'JWT',
      },
    },
  },
  security: {
    bearerAuth: [],
  },
  servers: [
    {
      url: 'http://localhost:3010/api',
      description: 'Local server',
    },
  ],
  paths: {
    ...getCountryRegions,
  },
};

Modal to enter bearer token enter image description here

Adding token enter image description here

Request is sent but it spins endlessly without ever sending the request enter image description here

No errros in my application terminal or logging but I do see one error in the chrome browser console when sending the request: enter image description here

Upvotes: 2

Views: 7491

Answers (1)

CodeConnoisseur
CodeConnoisseur

Reputation: 1869

I figured out the issue...the security property has to have an [] wrapped around it's object.

components: {
    securitySchemes: {
      bearerAuth: {
        type: 'http',
        in: 'header',
        name: 'Authorization',
        description: 'Bearer token to access these api endpoints',
        scheme: 'bearer',
        bearerFormat: 'JWT',
      },
    },
  },
  security: [
    {
      bearerAuth: [],
    },
  ],

This chunk of code works.

Upvotes: 7

Related Questions