Install Docker Registry Ui for Synology

Synology 에서 사용할 Docker Registry web ui 설치방법을 설명합니다.

Introduction

Synology에 Docker Registry를 Container로 사용하고 있었습니다.
개인 용도로 만든 이미지를 자유롭게 저장할 수 있게 되어 편하게 사용하고있었습니다.
하지만 어떤 이미지를 저장하고있는지, tag가 어떤게 있는지를 보기가 어렵더라구요.
물론 API를 사용해서 조회하면 볼수야 있겠지만, 저에게는 불편하게 다가왔습니다.
그래서 WebUI를 설치하는 방안을 찾아보았습니다.

Candidate

검색해보기도 하고, 참고했을때, 아래의 2개가 적합해보였습니다.

harbor는 기능이 풍부하고 CNCF로 관리되다보니, 더 좋긴합니다.
하지만 Registry를 이미 설치해두었고, web-ui만 사용하면 되는거라 Joxit docker regisry ui가 낫겠다 생각했습니다.

Install

내부망에서만 사용가능하게끔 설정하였습니다.
외부망에서는 다른 설정이 추가될 수 있으며, 보안이 취약할 수 있습니다.
(이때는 harbor를 사용하는게 더 나을겁니다.)

공식문서에서는 Recommended Docker Registry Configuration을 안내해주고 있습니다.
이대로 하면 좋겠지만, 제가 사용하는 환경에 맞게 추가 설정을 해주어야했기 때문에 참고만 하였습니다.
아래의 목록은 고려해야했던 사항들 입니다.

  1. 설치해둔 Registry는 분산설치 된게 아니며, NAS 하나에만 설치되어있다.
  2. Registry는 보안설정을 해두었다.
  3. Web-ui에서 이미지 삭제가 가능해야한다.
  4. Image의 상세정보를 볼 수 있어야한다.
  5. 내부망에서 사용하는 host명이 별도로 있다.(CORS설정)

위 사항들을 고려했을때, 아래의 설정을 추가해주어야했습니다.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
web-ui:
  SINGLE_REGISTRY: true
  REGISTRY_SECURED: true
  DELETE_IMAGES: true
  SHOW_CONTENT_DIGEST: true
  REGISTRY_URL: "http://xxxxx:1234"
registry:
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Origin: '[http://xxxxx:1234]'
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Methods: '[HEAD,GET,OPTIONS,DELETE]'
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Credentials: '[true]'
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Headers: '[Authorization,Accept,Cache-Control]'
  REGISTRY_HTTP_HEADERS_Access-Control-Expose-Headers: '[Docker-Content-Digest]'

여기까지 설정하니, 특별히 문제없이 web-ui가 문제없기 실행되었습니다.
정상 동작하는지 들어가보니, 메인 페이지는 Image 리스트를 잘 보여주었습니다.
하지만 이미지 상세정보 페이지에 들어가니, CORS 문제가 발생하고 있었습니다.

CORS TroubleShooting

Console에 출력되는 에러메시지를 보니, Preflight가 웹 브라우저에 의해 거절되어 실패하던 것이었습니다.
생각해볼 수 있는 원인은 CORS였는데, 설정이 잘못되었다면 메인페이지에서도 에러가 발생해야 했었습니다.
다른 원인이 있을 수 있겠다 싶어, 공식 문서를 확인해보니 FAQ에 등록되어있었습니다.

1
2
3
Why OPTIONS (aka preflight requests) and DELETE fails with 401 status code (using Basic Auth) ?
This is caused by a bug in docker registry, it returns 401 status requests on preflight requests, this breaks W3C preflight-request specification. 
I suggest to have your UI on the same domain than your registry e.g. registry.example.com/ui/ or use NGINX_PROXY_PASS_URL or configure a nginx/apache/haproxy in front of your registry that returns 200 on each OPTIONS requests. (see #104, #204, #207, #214, #266).

3가지 방법중 하나를 선택하라고 알려주고 있습니다.

  1. web-ui의 domain을 registry와 동일하게 한다.
  2. NGINX_PROXY_PASS_URL을 설정한다.
  3. nginx에 OPTIONS method에 200응답을 보낸다.

2번이 가장 간단하기도 하고, 다른 방법에 비해 가장 나을 선택지로 보여 진행했습니다.
설정은 아래처럼 변경하였습니다.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
web-ui:
  SINGLE_REGISTRY: true
  REGISTRY_SECURED: true
  DELETE_IMAGES: true
  SHOW_CONTENT_DIGEST: true
  NGINX_PROXY_PASS_URL: "http://xxxxx:1234"
registry:
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Origin: '[http://xxxxx:1234]'
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Methods: '[HEAD,GET,OPTIONS,DELETE]'
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Credentials: '[true]'
  REGISTRY_HTTP_HEADERS_Access-Control-Allow-Headers: '[Authorization,Accept,Cache-Control]'
  REGISTRY_HTTP_HEADERS_Access-Control-Expose-Headers: '[Docker-Content-Digest]'

이렇게하니 더 이상의 CORS 문제가 발생하지않고, 정상동작하였습니다.

Conclusion

NAS에 개인용도로 사용할 registry web-ui를 설치하였습니다.
간단하게 Registry에 저장된 도커이미지를 관리하기에는 충분해 보입니다.
저처럼 사적으로 Registry에 저장해둔 도커 이미지를 관리할 니즈가 있으신 분들에게는 추천 드립니다.

Hugo로 만듦
JimmyStack 테마 사용 중