source: node_modules/swagger-ui-express/README.md

main
Last change on this file was d24f17c, checked in by Aleksandar Panovski <apano77@…>, 15 months ago

Initial commit

  • Property mode set to 100644
File size: 10.8 KB
RevLine 
[d24f17c]1# Swagger UI Express
2
3| Statements | Branches | Functions | Lines |
4| --------------------------- | ----------------------- | ------------------------- | -------------------- |
5| ![Statements](https://img.shields.io/badge/Coverage-89.87%25-yellow.svg) | ![Branches](https://img.shields.io/badge/Coverage-78.57%25-red.svg) | ![Functions](https://img.shields.io/badge/Coverage-91.67%25-brightgreen.svg) | ![Lines](https://img.shields.io/badge/Coverage-89.74%25-yellow.svg) |
6
7This module allows you to serve auto-generated [swagger-ui](https://swagger.io/tools/swagger-ui/) generated API docs from express, based on a `swagger.json` file. The result is living documentation for your API hosted from your API server via a route.
8
9Swagger version is pulled from npm module swagger-ui-dist. Please use a lock file or specify the version of swagger-ui-dist you want to ensure it is consistent across environments.
10
11You may be also interested in:
12
13* [swagger-jsdoc](https://github.com/Surnet/swagger-jsdoc): Allows you to markup routes
14with jsdoc comments. It then produces a full swagger yml config dynamically, which you can pass to this module to produce documentation. See below under the usage section for more info.
15* [swagger tools](https://github.com/swagger-api): Various tools, including swagger editor, swagger code gen etc.
16
17## Usage
18
19Install using npm:
20
21```bash
22$ npm install swagger-ui-express
23```
24
25Express setup `app.js`
26```javascript
27const express = require('express');
28const app = express();
29const swaggerUi = require('swagger-ui-express');
30const swaggerDocument = require('./swagger.json');
31
32app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument));
33```
34
35or if you are using Express router
36
37```javascript
38const router = require('express').Router();
39const swaggerUi = require('swagger-ui-express');
40const swaggerDocument = require('./swagger.json');
41
42router.use('/api-docs', swaggerUi.serve);
43router.get('/api-docs', swaggerUi.setup(swaggerDocument));
44```
45
46Open http://`<app_host>`:`<app_port>`/api-docs in your browser to view the documentation.
47
48If you want to set up routing based on the swagger document checkout [swagger-express-router](https://www.npmjs.com/package/swagger-express-router)
49
50### [swagger-jsdoc](https://www.npmjs.com/package/swagger-jsdoc)
51
52If you are using swagger-jsdoc simply pass the swaggerSpec into the setup function:
53
54```javascript
55// Initialize swagger-jsdoc -> returns validated swagger spec in json format
56const swaggerSpec = swaggerJSDoc(options);
57
58app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerSpec));
59```
60
61### Swagger Explorer
62
63By default the Swagger Explorer bar is hidden, to display it pass true as the 'explorer' property of the options to the setup function:
64
65```javascript
66const express = require('express');
67const app = express();
68const swaggerUi = require('swagger-ui-express');
69const swaggerDocument = require('./swagger.json');
70
71var options = {
72 explorer: true
73};
74
75app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
76```
77
78### Custom swagger options
79
80To pass custom options e.g. validatorUrl, to the SwaggerUi client pass an object as the 'swaggerOptions' property of the options to the setup function:
81
82```javascript
83const express = require('express');
84const app = express();
85const swaggerUi = require('swagger-ui-express');
86const swaggerDocument = require('./swagger.json');
87
88var options = {
89 swaggerOptions: {
90 validatorUrl: null
91 }
92};
93
94app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
95```
96
97For all the available options, refer to [Swagger UI Configuration](https://github.com/swagger-api/swagger-ui/blob/master/docs/usage/configuration.md)
98
99### Custom CSS styles
100
101To customize the style of the swagger page, you can pass custom CSS as the 'customCss' property of the options to the setup function.
102
103E.g. to hide the swagger header:
104
105```javascript
106const express = require('express');
107const app = express();
108const swaggerUi = require('swagger-ui-express');
109const swaggerDocument = require('./swagger.json');
110
111var options = {
112 customCss: '.swagger-ui .topbar { display: none }'
113};
114
115app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
116```
117
118### Custom CSS styles from Url
119
120You can also pass the url to a custom css file, the value must be the public url of the file and can be relative or absolute to the swagger path.
121
122```javascript
123const express = require('express');
124const app = express();
125const swaggerUi = require('swagger-ui-express');
126const swaggerDocument = require('./swagger.json');
127
128var options = {
129 customCssUrl: '/custom.css'
130};
131
132app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
133```
134
135You can also pass an array of css urls to load multiple css files.
136
137```javascript
138const express = require('express');
139const app = express();
140const swaggerUi = require('swagger-ui-express');
141const swaggerDocument = require('./swagger.json');
142
143var options = {
144 customCssUrl: [
145 '/custom.css',
146 'https://example.com/other-custom.css'
147 ]
148};
149
150app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
151```
152
153### Custom JS
154
155If you would like to have full control over your HTML you can provide your own javascript file, value accepts absolute or relative path. Value must be the public url of the js file.
156
157```javascript
158const express = require('express');
159const app = express();
160const swaggerUi = require('swagger-ui-express');
161const swaggerDocument = require('./swagger.json');
162
163var options = {
164 customJs: '/custom.js'
165};
166
167app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
168```
169
170You can also pass an array of js urls to load multiple js files.
171
172```javascript
173const express = require('express');
174const app = express();
175const swaggerUi = require('swagger-ui-express');
176const swaggerDocument = require('./swagger.json');
177
178var options = {
179 customJs: [
180 '/custom.js',
181 'https://example.com/other-custom.js'
182 ]
183};
184
185app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
186```
187
188It is also possible to add inline javascript, either as string or array of string.
189
190```javascript
191const express = require('express');
192const app = express();
193const swaggerUi = require('swagger-ui-express');
194const swaggerDocument = require('./swagger.json');
195
196var options = {
197 customJsStr: 'console.log("Hello World")'
198};
199
200app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
201```
202
203```javascript
204const express = require('express');
205const app = express();
206const swaggerUi = require('swagger-ui-express');
207const swaggerDocument = require('./swagger.json');
208
209var options = {
210 customJsStr: [
211 'console.log("Hello World")',
212 `
213 var x = 1
214 console.log(x)
215 `
216 ]
217};
218
219app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument, options));
220```
221
222### Load swagger from url
223
224To load your swagger from a url instead of injecting the document, pass `null` as the first parameter, and pass the relative or absolute URL as the 'url' property to 'swaggerOptions' in the setup function.
225
226```javascript
227const express = require('express');
228const app = express();
229const swaggerUi = require('swagger-ui-express');
230
231var options = {
232 swaggerOptions: {
233 url: 'http://petstore.swagger.io/v2/swagger.json'
234 }
235}
236
237app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(null, options));
238```
239
240To load multiple swagger documents from urls as a dropdown in the explorer bar, pass an array of object with `name` and `url` to 'urls' property to 'swaggerOptions' in the setup function.
241
242```javascript
243const express = require('express');
244const app = express();
245const swaggerUi = require('swagger-ui-express');
246
247var options = {
248 explorer: true,
249 swaggerOptions: {
250 urls: [
251 {
252 url: 'http://petstore.swagger.io/v2/swagger.json',
253 name: 'Spec1'
254 },
255 {
256 url: 'http://petstore.swagger.io/v2/swagger.json',
257 name: 'Spec2'
258 }
259 ]
260 }
261}
262
263app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(null, options));
264```
265
266Make sure 'explorer' option is set to 'true' in your setup options for the dropdown to be visible.
267
268
269### Load swagger from yaml file
270
271To load your swagger specification yaml file you need to use a module able to convert yaml to json; for instance `yaml`.
272
273 npm install yaml
274
275```javascript
276const express = require('express');
277const app = express();
278const swaggerUi = require('swagger-ui-express');
279const fs = require("fs")
280const YAML = require('yaml')
281
282const file = fs.readFileSync('./swagger.yaml', 'utf8')
283const swaggerDocument = YAML.parse(file)
284
285app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerDocument));
286```
287
288
289### Modify swagger file on the fly before load
290
291To dynamically set the host, or any other content, in the swagger file based on the incoming request object you may pass the json via the req object; to achieve this just do not pass the the swagger json to the setup function and it will look for `swaggerDoc` in the `req` object.
292
293```javascript
294const express = require('express');
295const app = express();
296const swaggerUi = require('swagger-ui-express');
297const swaggerDocument = require('./swagger.json');
298
299var options = {}
300
301app.use('/api-docs', function(req, res, next){
302 swaggerDocument.host = req.get('host');
303 req.swaggerDoc = swaggerDocument;
304 next();
305}, swaggerUi.serveFiles(swaggerDocument, options), swaggerUi.setup());
306```
307
308### Two swagger documents
309
310To run 2 swagger ui instances with different swagger documents, use the serveFiles function instead of the serve function. The serveFiles function has the same signature as the setup function.
311
312```javascript
313const express = require('express');
314const app = express();
315const swaggerUi = require('swagger-ui-express');
316const swaggerDocumentOne = require('./swagger-one.json');
317const swaggerDocumentTwo = require('./swagger-two.json');
318
319var options = {}
320
321app.use('/api-docs-one', swaggerUi.serveFiles(swaggerDocumentOne, options), swaggerUi.setup(swaggerDocumentOne));
322
323app.use('/api-docs-two', swaggerUi.serveFiles(swaggerDocumentTwo, options), swaggerUi.setup(swaggerDocumentTwo));
324
325app.use('/api-docs-dynamic', function(req, res, next){
326 req.swaggerDoc = swaggerDocument;
327 next();
328}, swaggerUi.serveFiles(), swaggerUi.setup());
329```
330
331### Link to Swagger document
332
333To render a link to the swagger document for downloading within the swagger ui - then serve the swagger doc as an endpoint and use the url option to point to it:
334
335```javascript
336const express = require('express');
337const app = express();
338const swaggerUi = require('swagger-ui-express');
339const swaggerDocument = require('./swagger.json');
340
341var options = {
342 swaggerOptions: {
343 url: "/api-docs/swagger.json",
344 },
345}
346app.get("/api-docs/swagger.json", (req, res) => res.json(swaggerDocument));
347app.use('/api-docs', swaggerUi.serveFiles(null, options), swaggerUi.setup(null, options));
348```
349
350
351## Requirements
352
353* Node v0.10.32 or above
354* Express 4 or above
355
356## Testing
357
358* Install phantom
359* `npm install`
360* `npm test`
Note: See TracBrowser for help on using the repository browser.