はじめに

オフライン環境で複数のメンバーにファイルを配るためにcute-filesを使ってみました。

ベースとなる環境はこちらの記事を元に構成しました。

webブラウザさえあればアクセス可能なのでお手軽ですね。。。と思っていたのですが、オフラインでアクセスできず。

どうやらindex.html内で「jquery-1.11.0.min.js」をクライアントにGETさせているのですが、そのURLがインターネット上のものでした。
なので、ローカルに保存した「jquery-1.11.0.min.js」を読み込ませるように少し手を加えてみました。

ファイル構成

/どこか/cutefiles
           |--cutefiles
           |  |--Dockerfile
           |  |--index.html
           |  |--jquery-1.11.0.min.js
           |--docker-compose.yml

/data/cutefiles
           |--配布したいファイル

docker-compose.yml

data-cutefiles:
  image: busybox:buildroot-2014.02
  volumes:
      - /data/cutefiles:/cutefiles
cutefiles:
  build: cutefiles
  volumes_from:
    - data-cutefiles
  ports:
    - "3000:3000"

Dockerfile

FROM node:4.4
RUN npm install -g cute-files2@1.0.3
RUN sed -i 's/http:\/\//\/\//g' \
        /usr/local/lib/node_modules/cute-files2/frontend/index.html
RUN mv /usr/local/lib/node_modules/cute-files2/frontend/index.html /usr/local/lib/node_modules/cute-files2/frontend/index.html.org
COPY ./jquery-1.11.0.min.js /usr/local/lib/node_modules/cute-files2/frontend/
COPY ./index.html /usr/local/lib/node_modules/cute-files2/frontend/
WORKDIR /cutefiles
EXPOSE 3000
CMD ["/usr/local/bin/cute-files"]

index.html

「script src="jquery-1.11.0.min.js」が元のindex.htmlから変更した箇所になります。

<!DOCTYPE html>
<html>
  <head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Cute file browser</title>
    <!-- Include our stylesheet -->
    <link href="assets/css/styles.css" rel="stylesheet"/>
  </head>
  <body>
    <div class="filemanager">
      <div class="search">
        <input type="search" placeholder="Find a file.." />
      </div>
      <div class="breadcrumbs"></div>
      <ul class="data"></ul>
      <div class="nothingfound">
        <div class="nofiles"></div>
        <span>No files here.</span>
      </div>
    </div>
    <!-- Include our script files -->
    <script src="jquery-1.11.0.min.js"></script>
    <script src="assets/js/script.js"></script>
  </body>
</html>

jquery-1.11.0.min.js

こちらからダウンロードして配置する。

オフラインでもjqueryファイルをクライアントが読み込むことができるようになるので、ページも表示できるようになりました。

cute-filesをオフラインで使う