koa框架 mp2 node服務搭建swagger服務

說明：用koa2搭建靜態文件服務器，mp2管理node服務，搭建swagger-ui和swagger-editor服務，項目地址：koa-swagger

一、環境搭建

• 安裝最新版nodejs
• 新建文件夾koa-swagger，在文件夾內建立swagger-ui與swagger-editor文件夾，建立package.json、app.js文件

二、下載swagger-ui

      打開swagger-ui github主頁，下載zip壓縮包，解壓後把dist目錄下的全部文件拷貝到/koa-swagger/swagger-ui文件夾下面

三、下載swagger-editor

      打開swagger-editor github主頁，下載zip壓縮包，解壓後把dist目錄下的全部文件拷貝到/koa-swagger/swagger-editor件夾下面

四、編輯package.json文件

{
  "name": "koa-swagger",
  "scripts": {
    "start": "pm2 start app.js --name=swagger"
  },
  "dependencies": {
    "koa": "^2.0.0",
    "koa-bodyparser": "^3.2.0",
    "koa-compress": "^2.0.0",
    "koa-convert": "^1.2.0",
    "koa-multer": "^1.0.2",
    "koa-router": "^7.0.1",
    "koa-static": "^4.0.2",
    "koa-static-cache": "^5.1.1",
    "koa2-cors": "^2.0.5"
  }
}

五、編輯app.js文件

const Koa = require('koa')
const app = new Koa()
const path = require('path')
const bodyParser = require('koa-bodyparser')
const convert = require('koa-convert')
const staticCache = require('koa-static-cache')
const compress = require('koa-compress')
const cors = require('koa2-cors')

// 解析請求體
app.use(bodyParser())

// 跨域設置
app.use(convert(cors({
	allowMethods: ['GET', 'POST'],
    allowHeaders: ['Content-Type', 'Accept'],
    origin: function(ctx) {
        return '*' // 本地環境
    }
})))

// 中間件 設置gzip
app.use(compress({
    threshold: 2048,
    flush: require("zlib").Z_SYNC_FLUSH
}))

// 靜態文件服務，把koa-swagger做爲根目錄
app.use(convert(staticCache(path.join(__dirname, './'), {
    maxAge: 365 * 24 * 60 * 60,
    dynamic: false // 是否動態監測文件變化
})))

// 服務端口
const port = 8882

// 啓動程序，監聽端口
app.listen(port, () => {
	console.log(`listening on port ${port} for swagger`)
})

六、安裝依賴

      進入koa-swagger文件夾，命令行輸入npm指令

npm install -g pm2

npm install

七、啓動服務

      進入koa-swagger文件夾，命令行輸入npm指令

npm run start

命令行窗口出現以下效果表示成功

八、預覽效果

     打開瀏覽器輸入：http://localhost:8882/swagger-ui/index.html和http://localhost:8882/swagger-editor/index.html查看

九、指定swagger.json文件

     打開/koa-swagger/swagger-ui/index.html，編輯Build a system部分

// Build a system
const ui = SwaggerUIBundle({
    url: "http://localhost:8882/swagger.json", // 修改部分，改成本身的json配置文件，用swagger-editor編輯並導出來
    dom_id: '#swagger-ui',
    deepLinking: true,
    presets: [
        SwaggerUIBundle.presets.apis,
        SwaggerUIStandalonePreset
    ],
    plugins: [
        SwaggerUIBundle.plugins.DownloadUrl
    ],
    layout: "StandaloneLayout"
})

     把swagger-editor編輯並導出的swagger.json文件拷貝到/koa-swagger目錄，個人swagger.json文件內容以下

swagger: "2.0"
info:
  version: "0.0.1"
  title: "react-talkweb"
host: localhost:8881
tags:
- name: "test"
  description: "測試接口"
paths:
  /test/login:
    post:
      tags:
      - "test"
      summary: "登陸接口"
      parameters:
      - name: "param"
        in: "body"
        description: '登陸接口參數'
        required: true
        schema:
          $ref: '#/definitions/loginParam'
      responses:
        200:
          description: "Success"

  /test/portal:
    post:
      tags:
      - "test"
      summary: "選擇系統接口"
      parameters:
      - name: "param"
        in: "body"
        description: "選擇系統接口參數"
        required: true
        schema:
          $ref: '#/definitions/portalParam'
      responses:
        200:
          description: "Success"
  
  /test/home:
    post:
      tags:
      - "test"
      summary: "首頁接口"
      parameters:
      - name: "param"
        in: "body"
        description: "首頁接口參數"
        required: true
        schema:
          $ref: '#/definitions/homeParam'
      responses:
        200:
          description: Success

definitions:
  loginParam:
    properties:
      username:
        type: "string"
        default: "admin"
      password:
        type: "string"
        default: "test@123"
    required:
      - "username"
      - "password"
  portalParam:
    properties:
      id:
        type: "string"
    required: 
      - "id"
  homeParam:
    properties:
      userid:
        type: "string"
      systemid:
        type: "string"
    required: 
      - "userid"
      - "systemid"

十、重啓pm2服務

pm2 restart all