Node.js +Swagger Editor + Swagger-UI 环境搭建

待我称王封你为后i 2022-06-11 01:10 262阅读 0赞

## 安装node.js ##

下载node.js最新版  
[https://nodejs.org/en/download/][https_nodejs.org_en_download]  
![006tKfTcly1g1386y0lejj31iu0rgjsa.jpg][]

点击 安装器 `node-v6.11.1.pkg` 开始安装  
![006tKfTcly1g138c9gqgpj30yg0ocgm4.jpg][]

一路下一步，安装完成  
![006tKfTcly1g138d3y0d6j30ya0oatfc.jpg][]

## node.js安装后验证 ##

npm -v 
     node -v

![006tKfTcly1g138982jdbj30nk06sq30.jpg][]

## 下载Swagger-Editor ##

[https://github.com/swagger-api/swagger-editor/releases][https_github.com_swagger-api_swagger-editor_releases]

复制最新 release下载地址  
![006tKfTcly1g138dxt54cj31bu0jwjsc.jpg][]

在终端下载  
`wget https://github.com/swagger-api/swagger-editor/archive/v3.0.17.tar.gz`

下载完成，后解压

`tar -zxvf v3.0.17.tar.gz`

## 安装node.js HttpServer ##

`npm install -g http-server`

## 启动Swagger-Editor项目 ##

`http-server swagger-editor` 以8080端口启动项目  
`http-server –p 8082 swagger-editor` 指定端口启动项目

`http-server -p 8081 swagger-editor-3.0.17`

浏览器访问  
![006tKfTcly1g138fluqowj30wt07dq3f.jpg][]

## 下载swagger-ui ##

可以直接 git clone  
`git clone https://github.com/swagger-api/swagger-ui.git`

也可以下载最新的release

[https://github.com/swagger-api/swagger-ui/releases][https_github.com_swagger-api_swagger-ui_releases]

### 安装 express ###

创建一个空文件夹node\_app  
mkdir node\_app  
初始化 node ，创建package.json文件（）

cd node_ap
    ~/node_app ✗ >npm init

// 下面的看你心情填写
    name: (node_app) node_app
    version: (1.0.0)
    description:
    entry point: (index.js)
    test command:
    git repository:
    keywords:
    author:
    license: (ISC)

安装 express  
`~/node_app git:(master) ✗ >npm install express --save`

创建 index.js

`~/node_app git:(master) ✗ >vim index.js`  
把下面代码贴如 index.js 中

var express = require('express');
    var app = express();
    app.get('/', function (req, res) {
      res.send('Hello World!');
    });
    
    app.listen(3000, function () {
      console.log('Example app listening on port 3000!');
    });

在 node\_app 中创建空目录 public

~/node_app git:(master) ✗ >mkdir public
      ~/node_app git:(master) ✗ >cd public

修改路由

~/node_app/public git:(master) ✗ >vim ../index.js
    
    //在文件第三行插入下面这句话
    app.use('/static', express.static('public'));

把下载好的Swagger UI 文件中dist 目录下的文件全部复制到 public 文件夹下。

## 修改index.html文档文件 ##

将index.html首页中的javascript代码中的url修改为 `/static/test.json`

![2017-07-26-133146.jpg][]

重启node服务器

`~/node_app git:(master) ✗ >node index.js`

浏览器打开 `http://localhost:8082/static/#/`

## 接下来就是重点学习一下 文档编写的语法了 ##

参见 [https://www.gitbook.com/book/huangwenchao/swagger/details][https_www.gitbook.com_book_huangwenchao_swagger_details]

## 应用git WebHook功能自动通知阿里云服务器更新代码 ##

同样可以将该项目部署到阿里云服务器，将yaml文件用git管理。应用coding或github等git网站的webhook功能，向服务器发送一个http请求,让服务器自动执行 `git pull`命令，更新代码，小拉以coding.net为例

1.在服务器建好了一个shell脚本 用于执行`git pull`命令 [命名为gitpush.sh][gitpush.sh] h 添加如下内容

#!/bin/bash
    cd /root/swagger;git pull

注意修改可执行权限 `sudo chmod 744 gitpull.s`  
2. 写一个java web应用，例用java调用shell命令，以springboot为例

@RequestMapping("/run_pull")
        public String runGitPull()
        {
    
            try {
                String shpath="/root/swagger/gitpull.sh";
                Process ps = Runtime.getRuntime().exec(shpath);
                ps.waitFor();
    
                BufferedReader br = new BufferedReader(new InputStreamReader(ps.getInputStream()));
                StringBuffer sb = new StringBuffer();
                String line;
                while ((line = br.readLine()) != null) {
                    sb.append(line).append("\n");
                }
                String result = sb.toString();
                System.out.println(result);
            }
            catch (Exception e) {
    
                e.printStackTrace();
                return "git pull faild!" + e.toString();
            }
    
            return "git pull ok";
        }

1.  在github对应的swagger项目中新建webhook

将之前将的web请求地址放进去  
4. 这样在本地swagger.yaml文件 `git push`时，就会自动更新到了阿里云服务器

[https_nodejs.org_en_download]: https://nodejs.org/en/download/
[006tKfTcly1g1386y0lejj31iu0rgjsa.jpg]: https://ws3.sinaimg.cn/large/006tKfTcly1g1386y0lejj31iu0rgjsa.jpg
[006tKfTcly1g138c9gqgpj30yg0ocgm4.jpg]: https://ws4.sinaimg.cn/large/006tKfTcly1g138c9gqgpj30yg0ocgm4.jpg
[006tKfTcly1g138d3y0d6j30ya0oatfc.jpg]: https://ws1.sinaimg.cn/large/006tKfTcly1g138d3y0d6j30ya0oatfc.jpg
[006tKfTcly1g138982jdbj30nk06sq30.jpg]: https://ws2.sinaimg.cn/large/006tKfTcly1g138982jdbj30nk06sq30.jpg
[https_github.com_swagger-api_swagger-editor_releases]: https://github.com/swagger-api/swagger-editor/releases
[006tKfTcly1g138dxt54cj31bu0jwjsc.jpg]: https://ws4.sinaimg.cn/large/006tKfTcly1g138dxt54cj31bu0jwjsc.jpg
[006tKfTcly1g138fluqowj30wt07dq3f.jpg]: https://ws1.sinaimg.cn/large/006tKfTcly1g138fluqowj30wt07dq3f.jpg
[https_github.com_swagger-api_swagger-ui_releases]: https://github.com/swagger-api/swagger-ui/releases
[2017-07-26-133146.jpg]: http://ohag8y1i2.bkt.clouddn.com/2017-07-26-133146.jpg
[https_www.gitbook.com_book_huangwenchao_swagger_details]: https://www.gitbook.com/book/huangwenchao/swagger/details
[gitpush.sh]: http://xn--gitpush-e73k064b85a.sh