Rclone을 docker로 띄워 Object Storage browser로 이용하기

Object storage with Web UI

큰 용량의 파일을 object storage에 파일을 저장하고

브라우저에서 그 파일 목록을 확인할 수 있는 도구로는

최근 몇 개월전에 출시한 AWS Amplify의 Next.js를 위한 S3 Storage 오픈소스도 있겠고

가장 많이 사용되고 있는 MinIO를 사용할 수도 있겠고, 다른 여러 대안이 있을 수 있다.

 

그러나 MinIO의 UI는 APGL-v3 라이센스로 수정을 해서 사용할 수 없다.

그러나 Rclone은 MIT license로 맘대로 UI를 바꿀 수가 있다.

그래서 이 글에서는 이미 존재하는 web UI를 보유한 RClone을 이용해 보려한다.

RClone 코드는 Go로 짜여져있고, 현재도 꾸준히 업데이트 되지만,

RClone을 위한 React로 짜여진 Web UI 코드는 5년전에 업데이트를 멈추었다.

(그래도 한 번 사용해보겠다)

 

Deploying customized Web UI

기본적인 전략을 아래와 같다.

 

 

저렇게 그려놓고 보니 상당히 복잡한 것 같은데... 개발을 더 간단하게 하기 위해 저렇게 구성했다.

핵심은 노란색 원으로 표시된 부분이다.

즉,

1. 내 local 환경에서 코드 수정하고 테스트하다가

2. 회사 Gitlab에 git push를 한 후

3. 아래 3가지 명령어를 차례로 실행한 후에

docker compose build
docker compose push
docker compose up -d

 

4. 브라우저에서 `http://localhost:8090`으로 접속하면 된다.

 

간단하지 않은가... (아님 반박시 님말이 맞음)

 

각 부분 설명

1. Dockerfile

이걸 왜 추가했냐면

저 원본 React 코드가 5년전에 업데이트를 멈춘 것이라 node 버전 16에서만 설치가 된다.

그렇다고 저걸 서버에서 배포할 때마다 node 버전을 16으로 바꾸기가 오히려 더 불편하다.

그래서 node 16버전의 base image를 가져다가 npm build를 해주기 위함이다.

이렇게 빌드한 정적 파일은 /build에 저장이 되고

이 파일들은 가지고 온 rclone/rclone이라는 이미지의 /data/gui라는 폴더에 넣어주면 UI를 자동으로 담당하게 된다.

# Stage 1: Build the custom UI with Node 16
FROM node:16 as ui-builder
WORKDIR /ui

RUN git clone https://admin:admin_token@gitlab.my-company.com/rclone-react.git .

RUN npm cache clean --force
RUN npm install --legacy-peer-deps && npm run build

# Stage 2: Build the rclone image with the custom UI included
FROM rclone/rclone:latest
COPY --from=ui-builder /ui/build /data/gui

# ui 부분 코드가 위치한 경로
ENV RCLONE_RC_FILES=/data/gui

CMD ["rcd", "--rc-web-gui", "--rc-addr", "0.0.0.0:5572", "--rc-serve", "--rc-no-auth", "-vv", "--checksum", "--transfers=4", "--checkers=4", "--contimeout=60s", "--timeout=300s", "--retries=3", "--low-level-retries=10", "--stats=1s", "--stats-file-name-length=0"]

 

이 Dockerfile은 아래 나올 docker-compose.yml에 다시 접어넣어주었기 때문에

여기서 `docker build -t my-rclone .` 이런 거 안 만들어줘도 된다.

 

2. rclone.conf 파일

원래 제대로 처음부터 설치하려면 공식 repo에서 다운로드 받고 설치하고

`rclone conf` 명령어를 통해 설정 파일을 만들어줘야한다.

그러나 Enter키를 수십번 눌러야하는 이 명령어에서 결국 해주는 것은 `rclone.conf`라는

파일을 하나 만들어주는 것 뿐이다. 그래서 이것은 미리 만들어 놓은 파일을 그냥 가져오는 걸로 대체한다.

대략 다음처럼 생긴 conf 파일이다.

[my-s3]
type = s3
provider = AWS
access_key_id = AKIXXXXXXXXXXX2XXXXXXXX
secret_access_key = MpGGPPS4XXXXxxxxxxx2XXxxxx
region = ap-northeast-2
bucket = my-bucket-name
location_constraint = ap-northeast-2
acl = bucket-owner-full-control
bucket_acl = private
chunk_size = 200Mi
list_url_encode = true

 

3. Nginx

이건 굳이 필요없다. (optional)

단지 Rclone을 default로 설치하면 로그인하라는 팝업창 하나에 로그인을 하면

또 메인페이지에 로그인하라고 나오는데

이 번거로운 과정을 줄여주기 위해 Reverse Proxy인 Nginx에 script를 넣어서 넘어가도록 해주기 위함이다. (나 편하라고)

물론 Nginx가 아닌 Traefik이라는 Reverse Proxy를 사용해도 무방하다.

 

4. docker-compose.yml

private Nexus도 필수 요소가 아니다.

Nexus없이도 Dockerfile과 docker-compose.yml 파일만 있으면

`docker build -t`, `docker-compose up -d` 이렇게 해주면 되는데

명령어를 조금이라도 간단하게 해주려고 (사실은 나중에 클라우드 배포를 고려한 설정)

커스텀한 UI를 빌드한 이미지를 Nexus에 올렸다가 다시 받는 것으로 해줬다.

 

결론은 docker-compose.yml에 Dockerfile을 내재시켰으므로

on-prem 서버에서 다음 3가지 명령어만 치면 되는 것.

docker compose build
docker compose push
docker compose up -d

 

참고로 docker-compose.yml 파일은 다음과 같이 짰다.

 

version: "3"
services:
  rclone:
    build:
      context: .
      dockerfile: Dockerfile
    image: docker.my-company.com/backend/rclone-react-build_dev
    container_name: rclone
    security_opt:
      - no-new-privileges:true
    restart: unless-stopped
    command: >
      rcd --rc-web-gui
          --rc-addr 0.0.0.0:5572
          --rc-serve
          --rc-user admin
          --rc-passwd admin_passwd
          -vv
          --checksum
          --transfers=4
          --checkers=4
          --contimeout=60s
          --timeout=300s
          --retries=3
          --low-level-retries=10
          --stats=1s
          --stats-file-name-length=0

    volumes:
      - ./:/config/rclone
    environment:
      - PHP_TZ=Asia/Seoul
      - RCLONE_RC_FILES=/data/gui
    ports:
      - "5572:5572"
    networks:
      - appnet
  nginx:
    image: nginx:latest
    container_name: nginx
    ports:
      - "8090:80"
    volumes:
      - ./conf.d/default.conf:/etc/nginx/conf.d/default.conf:ro
    depends_on:
      - rclone
    networks:
      - appnet
networks:
  appnet:
    driver: bridge

 

이제 브라우저를 띄워서 http://localhost:8090 을 입력하면 잘 뜨고, 내 AWS S3와도 연결이 잘 되서 파일 upload, download가 가능해진다.