How should I use Swagger with Hapi?

Question

I have a working ordinary Hapi application that I'm planning to migrate to Swagger. I installed swagger-node using the official instructions, and chose Hapi when executing 'swagger project create'. However, I'm now confused because there seem to be several libraries for integrating swagger-node and hapi:

1. hapi-swagger: the most popular one
2. hapi-swaggered: somewhat popular
3. swagger-hapi: unpopular and not that active but used by the official Swagger Node.js library (i.e. swagger-node) as default for Hapi projects

I though swagger-hapi was the "official" approach, until I tried to find information on how do various configurations on Hapi routes (e.g. authorization, scoping, etc.). It seems also that the approaches are fundamentally different, swagger-hapi taking Swagger definition as input and generating the routes automatically, whereas hapi-swagger and hapi-swaggered seem to have similar approach with each other by only generating Swagger API documentation from plain old Hapi route definitions.

Considering the amount of contributors and the number of downloads, hapi-swagger seems to be the way to go, but I'm unsure on how to proceed. Is there an "official" Swagger way to set up Hapi, and if there is, how do I set up authentication (preferably by using hapi-auth-jwt2, or other similar JWT solution) and authorization?

EDIT: I also found swaggerize-hapi, which seems to be maintained by PayPal's open source kraken.js team, which indicates that it might have some kind of corporate backing (always a good thing). swaggerize-hapi seems to be very similar to hapi-swagger, although the latter seems to provide more out-of-the-box functionality (mainly Swagger Editor).

Answer 1

Edit: Point 3. from your question and understanding what swagger-hapi actually does is very important. It does not directly serves the swagger-ui html. It is not intended to, but it is enabling the whole swagger idea (which the other projects in points 1. and 2. are actually a bit reversing). Please see below.

It turns out that when you are using swagger-node and swagger-hapi you do not need all the rest of the packages you mentioned, except for using swagger-ui directly (which is used by all the others anyways - they are wrapping it in their dependencies)

I want to share my understanding so far in this hapi/swagger puzzle, hope that these 8 hours that I spent can help others as well.

Libraries like hapi-swaggered, hapi-swaggered-ui, also hapi-swagger - All of them follow the same approach - that might be described like that:

You document your API while you are defining your routes

They are somewhat sitting aside from the main idea of swagger-node and the boilerplate hello_world project created with swagger-cli, which you mentioned that you use.

While swagger-node and swagger-hapi (NOTE that its different from hapi-swagger) are saying:

You define all your API documentation and routes **in a single centralized place - swagger.yaml**

and then you just focus on writing controller logic. The boilerplate project provided with swagger-cli is already exposing this centralized place swagger.yaml as json thru the /swagger endpoint.

Now, because the swagger-ui project which all the above packages are making use of for showing the UI, is just a bunch of static html - in order to use it, you have two options:

• 1) to self host this static html from within your app

• 2) to host it on a separate web app or even load the index.html directly from file system.

In both cases you just need to feed the swagger-ui with your swagger json - which as said above is already exposed by the /swagger endpoint.

The only caveat if you chose option 2) is that you need to enable cors for that end point which happened to be very easy. Just change your default.yaml, to also make use of the cors bagpipe. Please see this thread for how to do this.

As @Kitanotori said above, I also don't see the point of documenting the code programmatically. The idea of just describing everything in one place and making both the code and the documentation engine to understand it, is great.

Answer 2

We have used Inert, Vision, hapi-swagger.

server.ts

import * as Inert from '@hapi/inert';
import * as Vision from '@hapi/vision';
import Swagger from './plugins/swagger';
...
...
// hapi server setup
...
const plugins: any[] = [Inert, Vision, Swagger];
await server.register(plugins);
...
// other setup

./plugins/swagger

import * as HapiSwagger from 'hapi-swagger';

import * as Package from '../../package.json';

const swaggerOptions: HapiSwagger.RegisterOptions = {
  info: {
    title: 'Some title',
    version: Package.version
  }
};

export default {
  plugin: HapiSwagger,
  options: swaggerOptions
};

Answer 3

We are using Inert, Vision and hapi-swagger to build and host swagger documentation. We load those plugins in exactly this order, do not configure Inert or Vision and only set basic properties like title in the hapi-swagger config.