Swagger UI에서 GitLab에서 관리되는 정의 문서 참조

Docker로 Swagger UI를 구축하여 Swagger UI에서 항상 최신 정의 파일을 확인할 수 있도록 합니다.
GitLab은 로컬로 구축한 것을 이용.

Swagger UI 구축



Docker Compose를 이용한다.
swagger-ui의 공식 이미지는 여기 .
$ cat docker-compose.yaml
version: "2"
services:
  swagger:
    image: swaggerapi/swagger-ui
    environment:
      API_URL: https://petstore.swagger.io/v2/swagger.json
    ports:
      - "8080:8080"
$ docker-compose up -d

초기 표시( API_URL )는 공식 데모 에서 이용되고 있는 애완동물 숍의 API 사양이 표시되도록 하고 있다.



애완 동물 가게 API가 표시되었습니다.
이 화면에서 GitLab에 있는 정의서를 확인할 수 있도록 하고 싶다.

Git 리포지토리 표시



이 상태에서 Explorer 텍스트 상자에 GitLab에서 관리되는 정의 파일의 URL을 지정하면 CORS 오류가 발생합니다.



CORS의 에러를 피하기 위해서, swagger-ui를 움직이고 있는 Nginx로 리버스 프록시 시킨다.

Nginx 역방향 프록시 설정



컨테이너의 Nginx 구성 파일을 편집합니다.
server 지시어에 설정을 추가한다.
이번은 http://{swagger-uiのホスト}/swagger/{GitLabでのファイルのURLからホスト名を抜いたもの} (e.g. http://localhost:8080/sawgger/skkojiko/hogehoge/raw/master/docs/api/swagger.yml )로 액세스 할 수 있도록 한다.
$ docker container ls
CONTAINER ID        IMAGE                            COMMAND                  CREATED             STATUS                        PORTS                                                      NAMES
d8c85fc008b2        swaggerapi/swagger-ui            "sh /usr/share/ngi..."   33 minutes ago      Up 30 minutes                 80/tcp, 0.0.0.0:8080->8080/tcp
$ docker exec -it d8c85fc008b2 sh
# vi /etc/nginx/nginx.conf
...省略
server {
+    location /swagger/ {
+      proxy_pass      http://gitlab.com/;  # GitLabのURLを指定
+    }
  }
...省略

Nginx 설정을 변경한 후 컨테이너를 다시 시작합니다.
$ docker container restart d8c85fc008b2

다시 Swagger UI의 텍스트 박스에 URL(e.g. http://localhost:8080/sawgger/skkojiko/hogehoge/raw/master/docs/api/swagger.yml )을 입력하면 이번에는 정상적으로 표시되게 된다.

처음부터 GitLab의 정의 파일 표시


docker-compose.yamlAPI_URL 를 수정한다.
$ cat docker-compose.yaml
version: "2"
services:
  swagger:
    image: swaggerapi/swagger-ui
    environment:
      API_URL: http://localhost:8080/sawgger/skkojiko/hogehoge/raw/master/docs/api/swagger.yml
    ports:
      - "8080:8080"

좋은 웹페이지 즐겨찾기