Dockerを使ってswagger.yamlをサクッとみる

前回、[こちらの記事](http://qiita.com/NewGyu/items/64adc3c5dd3ab8ad6087)でNode.jsを使ったSwaggerによるAPI仕様書を見る方法を紹介しました。

しかし、

* Node.jsなんて使ったことねーよ
* このためだけにNode.jsインストールするとか面倒

という人もいるかもしれません。

そこで奥さん、Dockerを使って超カンタンにやる方法を紹介します。

## 前提

* dockerコマンドが使えること
* docker-composeコマンドが使えること

[Docker for Mac](https://docs.docker.com/docker-for-mac/), [Docker for Windows](https://docs.docker.com/docker-for-windows/), [Docker ToolBox](https://docs.docker.com/toolbox/overview/)、ご自分の環境にあったものを用意しましょう。

ちなみに筆者の環境はこうです。

```shell-session
newgyu@newgyu-XPS-13-9350:~/Desktop/test$ uname -a
Linux newgyu-XPS-13-9350 4.4.0-33-generic #52-Ubuntu SMP Fri Jul 22 19:16:44 UTC 2016 x86_64 x86_64 x86_64 GNU/Linux

newgyu@newgyu-XPS-13-9350:~/Desktop/test$ docker version
Client:
 Version:      1.11.0
 API version:  1.23
 Go version:   go1.5.4
 Git commit:   4dc5990
 Built:        Wed Apr 13 18:38:59 2016
 OS/Arch:      linux/amd64

Server:
 Version:      1.11.0
 API version:  1.23
 Go version:   go1.5.4
 Git commit:   4dc5990
 Built:        Wed Apr 13 18:38:59 2016
 OS/Arch:      linux/amd64

newgyu@newgyu-XPS-13-9350:~/Desktop/test$ docker-compose --version
docker-compose version 1.6.2, build 4d72027

```

## ファイルを用意する

```shell-session:ディレクトリ構造
.
├── docker-compose.yaml
└── example.yaml
```

用意するのはこの２つだけです。

```yaml:docker-compose.yaml
viewer:
  image: newgyu/swagger-spec-viewer
  volumes:
  - "./example.yaml:/opt/swagger/api/swagger.yaml"
  ports:
  - "8080:8080"
```

example.yamlは[swagger specification](http://swagger.io/specification/)に従って書かれたYAMLファイルです。(つまりはAPI仕様)

今回の例では http://editor.swagger.io/#/ こちらから拝借してきたものを[Gistに置いてあります](https://gist.github.com/NewGyu/3a0a1de3d056e34e0fd6e1e127141ce6#file-example-yaml)ので参照してください。

![Screenshot from 2016-08-03 23-51-47.png](https://qiita-image-store.s3.amazonaws.com/0/31010/a86ec5e8-5083-61ac-7e19-278d7983821b.png)

## 実行する

`docker-compose.yaml`が置いてあるディレクトリで`docker-compose up`を実行してください。

```shell-session
newgyu@newgyu-XPS-13-9350:~/Desktop/test$ docker-compose up
Starting test_viewer_1
Attaching to test_viewer_1
viewer_1 | 
viewer_1 | > swagger-spec-viewer@1.0.0 prestart /opt/swagger
viewer_1 | > npm install
viewer_1 | 
viewer_1 | 
viewer_1 | > swagger-spec-viewer@1.0.0 start /opt/swagger
viewer_1 | > node index.js
viewer_1 | 
viewer_1 | Your server is listening on port 8080 (http://localhost:8080)
viewer_1 | Swagger-ui is available on http://localhost:8080/docs
```

example.yamlの記法が間違っていなければ上記のように8080ポートでswagger-spec-viewerが起動します。
http://localhost:8080/docs でexample.yamlの内容が見えるはずです。
(Docker ToolBoxを使っている場合は http://192.168.99.100/docs )
![Screenshot from 2016-08-03 23-53-01.png](https://qiita-image-store.s3.amazonaws.com/0/31010/08ecd7c2-164c-229f-61d3-d38d665647ba.png)

## 若干解説

* newgyu/swagger-spec-viewerの[Dockerイメージの定義はこんなもん](https://hub.docker.com/r/newgyu/swagger-spec-viewer/~/dockerfile/)です
* イメージの中に入っている[nodejs-server-server](https://github.com/NewGyu/swagger-spec-viewer/tree/master/nodejs-server-server)は前回swagger-editorから[generate-serverしたもの](http://qiita.com/NewGyu/items/64adc3c5dd3ab8ad6087#1-swagger-editor%E3%81%8B%E3%82%89generate-server%E3%81%99%E3%82%8B)と全く同じです
* docker-compose.yamlのvolumes定義で `./example.yaml:/opt/swagger/api/swagger.yaml` としてローカルのexample.yamlをコンテナにマウントしています