expressjs+swagger自动生成api文档

一、前置工作

1、下载swaggerUI代码

git clone https://github.com/swagger-api/swagger-ui.git

2、添加swagger官方demo

1、在服务端目录下新建public目录;
2、将swagger目录dist下文件尽数拷贝到public目录下。
在这里插入图片描述

3、在服务端入口文件追加nodeJS脚本【这里走个过场,不进行这一步也可以】

app.use('/doc', express.static('public'));

在这里插入图片描述
通过浏览器访问【http://localhost:4200/doc/】即可以访问到swagger官方的API demo UI。
在这里插入图片描述

二、自定义接口

1、编写接口描述文件swagger.json

描述文件编写规则见:
https://swagger.io/docs/specification/2-0/describing-request-body/
使用swagger edit在线编辑器编辑:
https://editor.swagger.io/
这部分可以通过yaml语法编辑,完成后选择保存为json文件swagger.json.

2、使用swagger.json替换官方demo

1、将编写完成swagger.json放入public目录;
在这里插入图片描述
2、打开public/index.html,将其中的【url: “…”】更换为【url: “swagger.json”】;
在这里插入图片描述
3、重新启动项目,然后打开浏览器即可看到与你配置的json相符合的页面:
在这里插入图片描述

三、脚本生成swagger.json

1、安装swagger插件

yarn add express-swagger-generator
# or
npm i express-swagger-generator
# or
cnpm i express-swagger-generator

2、按照规则写注释

详见:https://www.npmjs.com/package/express-swagger-generator
在这里插入图片描述

3、编写nodejs代码

const expressSwagger = require('express-swagger-generator')(this.app);
const options = {
  swaggerDefinition: {
    info: {
      description: '吴迪测试',
      title: 'Swagger - 吴迪分享',
      version: '1.0.0',
    },
    host: 'localhost:4200',
    basePath: '/doc',
    produces: [
      "application/json",
      "application/xml"
    ],
    schemes: ['http', 'https'],
    securityDefinitions: {
      JWT: {
        type: 'apiKey',
        in: 'header',
        name: 'Authorization',
        description: "",
      }
    }
  },
  route: {
    url: '/swagger',
    docs: '/swagger.json' //swagger文件 api
  },
  basedir: __dirname, //app absolute path
  files: ['./app/routes/**/*.ts'] //Path to the API handle folder
};
expressSwagger(options);

这样我们就可以通过http://localhost:4200/swagger进行访问了

【上面定义的doc那个就可以删除掉了】

在这里插入图片描述

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值