WD My Cloud에 가벼운 웹하드서비스 h5ai 설치하기

NAS

WD My Cloud에 가벼운 웹하드서비스 h5ai 설치하기

우성군 59 35929 0

1. 들어가며


기본적으로 webdav를 이용하여 편하게 접근하는 방법을 소개해드렸습니다. (관련링크 : WD My Cloud에 Webdav 활성화 하기)


그런데 문제는 안이쁘다는 것이죠.


그래서 h5ai를 소개해드립니다.


관련링크에 원문이 있습니다. (외국 문서를 한글로 번역 + My Cloud에 맞게 수정했습니다.)




▲ 최종목표는 Public 폴더가 위와 같이 이쁘게 나오는 것입니다.?



장점은 폴더를 압축하여 통채로 받을 수 있습니다.



2. 패키지 리스트 업데이트


apt-get update


위 명령어로 업데이트를 해줍니다.



3. 아파치 설정 추가하기 (선택)


참고로 보안을 위해 넣는 부분이지만


외부에서 대시보드 접속이 불가능합니다.


보안에 손해를 보더라도 외부에서 대시보드 접속이 꼭 필요하다면 이 부분을 빼는게 좋습니다.


허용되는 IP만 등록하여 다른 IP에서는 접근 불가하게 만드는 방법입니다.


사실 외부에서 많이 쓰기 때문에 이 기능은 추천하지 않습니다.


cp /etc/apache2/conf.d/additional-httpd.conf /etc/apache2/conf.d/additional-httpd.conf.bak


위 명령어로 기본 아파치 설정을 백업합니다.


혹시나 실수를 대비하기 위함입니다.



nano /etc/apache2/conf.d/additional-httpd.conf


위와 같이 아파치 설정에 들어가서




<Directory ${DOCUMENT_ROOT}>
Options +FollowSymLinks +MultiViews -Indexes
AllowOverride All
Require all granted
</Directory>



위 내용을 찾습니다.


그리고 바로 위에



RewriteEngine On

RewriteCond %{REMOTE_ADDR} !^127\.0.0.1$

RewriteCond %{REMOTE_ADDR} !^XXX\.XXX\.XXX\.(.*)$

RewriteCond %{REQUEST_URI} !^/_h5ai(.*)$

RewriteCond %{REQUEST_URI} !^/public(.*)$

RewriteRule $ /public/ [L,R=301]


위 내용을 넣습니다.


그러면




<Directory ${DOCUMENT_ROOT}>
Options +FollowSymLinks +MultiViews -Indexes
AllowOverride All
Require all granted
RewriteEngine On
RewriteCond %{REMOTE_ADDR} !^127.0.0.1$
RewriteCond %{REMOTE_ADDR} !^XXX.XXX.XXX.(.*)$
RewriteCond %{REQUEST_URI} !^/_h5ai(.*)$
RewriteCond %{REQUEST_URI} !^/public(.*)$
RewriteRule $ /public/ [L,R=301]
</Directory>



위와 같이 됩니다.



여기서 수정할 부분은 


RewriteCond %{REMOTE_ADDR} !^XXX\.XXX\.XXX\.(.*)$


윗 줄에서


XXX 부분을 본인의 환경에 맞게 수정해줘야 하는 것입니다.



예를들어 MC의 내부IP가 192.168.0.XXX 라면 


RewriteCond %{REMOTE_ADDR} !^192\.168\.0\.(.*)$



이렇게 하면 되고



192.168.1.XXX 라면


RewriteCond %{REMOTE_ADDR} !^192\.168\.1\.(.*)$


위와 같이 바꾸면 됩니다.



컨트롤 + O, 엔터, 컨트롤 + X로 저장 후 빠져나옵니다.





4. h5ai 전용 아파치 설정파일 만들기



nano /etc/apache2/sites-available/h5ai.conf


위 명령어로 h5ai 전용 아파치 설정파일을 만듭니다.


아무것도 없는데요.




<Directory /var/www/htdocs/public/>
DirectoryIndex index.html index.php /_h5ai/server/php/index.php
</Directory>



위 내용을 넣어줍니다.


컨트롤 + O, 엔터, 컨트롤 + X로 저장 후 빠져나옵니다.




a2ensite h5ai


위 명령어로 h5ai 설정파일을 적용시킵니다.



WDMyCloud:~# a2ensite h5ai

Enabling site h5ai.

To activate the new configuration, you need to run:

  service apache2 reload

WDMyCloud:~#


위와 같이 적용됩니다.



service apache2 restart


위 명령어로 아파치를 재시작합니다.



5. h5ai 설치하기


cd /var/www/htdocs


위 명령어로 아파치 루트폴더로 이동합니다.



wget -O h5ai.zip http://release.larsjung.de/h5ai/h5ai-0.24.1.zip


위 명령어로 h5ai 파일을 다운 받습니다.


참고로 명령어 중에 0.24.1 숫자만 바꾸면 최신버전으로 설치할 수 있습니다.


다만 최신버전에선 실험 기능이었던 업로드가 빠지게 되므로 고민 해보시구요 ^^;;


최신버전 확인 하는 방법은


https://github.com/lrsjng/h5ai/blob/master/CHANGELOG.md


위 링크에서 제일 위에 숫자를 보면 됩니다.


2014년 8월 26일 기준 0.26.1까지 나왔네요.


WDMyCloud:/var/www/htdocs# wget -O h5ai.zip http://release.larsjung.de/h5ai/h5ai-0.24.1.zip

--2014-04-29 14:17:08--  http://release.larsjung.de/h5ai/h5ai-0.24.1.zip

Resolving release.larsjung.de (release.larsjung.de)... 95.143.172.102

Connecting to release.larsjung.de (release.larsjung.de)|95.143.172.102|:80... connected.

HTTP request sent, awaiting response... 200 OK

Length: 476161 (465K) [application/zip]

Saving to: `h5ai.zip'


100%[======================================>] 476,161      159K/s   in 2.9s


2014-04-29 14:17:12 (159 KB/s) - `h5ai.zip' saved [476161/476161]


WDMyCloud:/var/www/htdocs#



위와 같이 받아집니다.




unzip h5ai.zip


위 명령어로 압축을 풉니다.



rm -f h5ai.zip


위 명령어로 기존 압축파일을 지웁니다.



chmod -R 755 /var/www/htdocs/_h5ai/


위 명령어로 권한 설정합니다.



chmod o+w /var/www/htdocs/_h5ai/cache/


위 명령어로 cache폴더 권한 설정합니다.



chown -R www-data /var/www/htdocs/_h5ai/


위 명령어로 h5ai 권한을 www-data에게 줍니다.



ln -s /DataVolume/shares/Public/ /var/www/htdocs/public


위 명령어로 퍼블릭 폴더를 h5ai에 붙입니다.



wget  --no-check-certificate -O /var/www/htdocs/_h5ai/conf/l10n/ko.json https://www.dropbox.com/s/bp2pmiai8e06lch/ko.json


위 명령어로 한글언어팩을 설치합니다. (한글언어팩 출처 - 테베홈페이지 http://thebenet.net/bbs/board.php?bo_table=doc&wr_id=13)


참고로 h5ai를 설치할 때 0.25.0 버전 이상을 설치했다면 언어팩을 설치할 필요가 없습니다.


이미 한글 언어팩이 추가되었기 때문입니다.


WDMyCloud:/var/www/htdocs# wget  --no-check-certificate -O /var/www/htdocs/_h5ai/conf/l10n/ko.json 


https://www.dropbox.com/s/bp2pmiai8e06lch/ko.json

--2014-04-29 14:18:56--  https://www.dropbox.com/s/bp2pmiai8e06lch/ko.json

Resolving www.dropbox.com (www.dropbox.com)... 108.160.166.142

Connecting to www.dropbox.com (www.dropbox.com)|108.160.166.142|:443... connected.

WARNING: The certificate of `www.dropbox.com' is not trusted.

WARNING: The certificate of `www.dropbox.com' hasn't got a known issuer.

HTTP request sent, awaiting response... 302 FOUND

Location: https://dl.dropboxusercontent.com/s/bp2pmiai8e06lch/ko.json?token_hash=AAGjILK50PxqqEWh2Swq5pZAkuCcGm8pNf6fElrcoJw7OQ [following]

--2014-04-29 14:18:58--  https://dl.dropboxusercontent.com/s/bp2pmiai8e06lch/ko.json?


token_hash=AAGjILK50PxqqEWh2Swq5pZAkuCcGm8pNf6fElrcoJw7OQ

Resolving dl.dropboxusercontent.com (dl.dropboxusercontent.com)... 23.23.97.59, 54.235.196.134, 54.243.89.47, ...

Connecting to dl.dropboxusercontent.com (dl.dropboxusercontent.com)|23.23.97.59|:443... connected.

WARNING: The certificate of `dl.dropboxusercontent.com' is not trusted.

WARNING: The certificate of `dl.dropboxusercontent.com' hasn't got a known issuer.

HTTP request sent, awaiting response... 200 OK

Length: 582 [text/plain]

Saving to: `/var/www/htdocs/_h5ai/conf/l10n/ko.json'


100%[======================================>] 582         --.-K/s   in 0s


2014-04-29 14:18:59 (1.41 MB/s) - `/var/www/htdocs/_h5ai/conf/l10n/ko.json' saved [582/582]


WDMyCloud:/var/www/htdocs#




위와 같이 받아집니다.



6. 썸네일 관련 패키지 (선택)



기존 php 패키지 및 업그레이드를 위해 소스리스트를 수정하신 분은 기본적으로 이미지 썸네일이 나옵니다. (http://www.wsgvet.com/bbs/board.php?bo_table=iomega&wr_id=557)


GD패키지를 깔았기 때문인데요.



순정으로 쓰시는 분들은 GD패키지만 깔면 에러가 나기 때문에 추천하지 않습니다.



동영상 썸네일 생성을 위해 ffmpeg 패키지도 깔 수 있습니다. (GD패키지를 깔지 않으면 표시가 안됩니다.)


apt-get install ffmpeg



다만...


WDMyCloud:/var/www/htdocs# apt-get install ffmpeg

Reading package lists... Done

Building dependency tree

Reading state information... Done

The following extra packages will be installed:

  libasyncns0 libav-tools libavdevice53 libavfilter2 libcaca0 libcdio-cdda1

  libcdio-paranoia1 libcdio13 libdc1394-22 libdirectfb-1.2-9 libjack-jackd2-0

  libjson0 libopencv-core2.3 libopencv-imgproc2.3 libpostproc52 libpulse0

  libraw1394-11 libsamplerate0 libsdl1.2debian libsndfile1 libswscale2

  libts-0.0-0 libusb-1.0-0 libx11-xcb1 libxfixes3 libxi6 libxtst6 tsconf

Suggested packages:

  jackd2 pulseaudio libraw1394-doc

The following NEW packages will be installed:

  ffmpeg libasyncns0 libav-tools libavdevice53 libavfilter2 libcaca0

  libcdio-cdda1 libcdio-paranoia1 libcdio13 libdc1394-22 libdirectfb-1.2-9

  libjack-jackd2-0 libjson0 libopencv-core2.3 libopencv-imgproc2.3

  libpostproc52 libpulse0 libraw1394-11 libsamplerate0 libsdl1.2debian

  libsndfile1 libswscale2 libts-0.0-0 libusb-1.0-0 libx11-xcb1 libxfixes3

  libxi6 libxtst6 tsconf

0 upgraded, 29 newly installed, 0 to remove and 85 not upgraded.

Need to get 6730 kB of archives.

After this operation, 13.4 MB of additional disk space will be used.

Do you want to continue [Y/n]?



위와 같이 29개의 패키지를 설치해야 하므로 추천드리진 않습니다.




참고로 PDF 썸네일 생성을 위해서 


apt-get install imagemagick


위 명령어로 해당모듈을 설치할 수 있습니다.


다만...


WDMyCloud:/var/www/htdocs# apt-get install imagemagick

Reading package lists... Done

Building dependency tree

Reading state information... Done

The following extra packages will be installed:

  fontconfig fonts-droid ghostscript gsfonts hicolor-icon-theme

  imagemagick-common libcairo2 libcroco3 libcups2 libcupsimage2 libdatrie1

  libdjvulibre-text libdjvulibre21 libexiv2-12 libgdk-pixbuf2.0-0

  libgdk-pixbuf2.0-common libgomp1 libgs9 libgs9-common libice6 libijs-0.35

  libilmbase6 libjasper1 libjbig0 libjbig2dec0 liblcms1 liblcms2-2

  liblensfun-data liblensfun0 liblqr-1-0 libmagickcore5 libmagickcore5-extra

  libmagickwand5 libnetpbm10 libopenexr6 libpango1.0-0 libpaper-utils

  libpaper1 libpixman-1-0 librsvg2-2 librsvg2-common libsm6 libthai-data

  libthai0 libtiff4 libwmf0.2-7 libxcb-render0 libxcb-shm0 libxext6 libxft2

  libxrender1 libxt6 netpbm poppler-data ufraw-batch x11-common

Suggested packages:

  ghostscript-cups ghostscript-x hpijs imagemagick-doc autotrace cups-bsd lpr

  lprng enscript ffmpeg gimp gnuplot grads hp2xx html2ps libwmf-bin mplayer

  povray radiance sane-utils texlive-base-bin transfig xdg-utils cups-common

  exiv2 libjasper-runtime liblcms-utils liblcms2-utils ttf-baekmuk

  ttf-arphic-gbsn00lp ttf-arphic-bsmi00lp ttf-arphic-gkai00mp

  ttf-arphic-bkai00mp librsvg2-bin poppler-utils fonts-japanese-mincho

  fonts-ipafont-mincho fonts-japanese-gothic fonts-ipafont-gothic

  fonts-arphic-ukai fonts-arphic-uming fonts-unfonts-core ufraw

The following NEW packages will be installed:

  fontconfig fonts-droid ghostscript gsfonts hicolor-icon-theme imagemagick

  imagemagick-common libcairo2 libcroco3 libcups2 libcupsimage2 libdatrie1

  libdjvulibre-text libdjvulibre21 libexiv2-12 libgdk-pixbuf2.0-0

  libgdk-pixbuf2.0-common libgomp1 libgs9 libgs9-common libice6 libijs-0.35

  libilmbase6 libjasper1 libjbig0 libjbig2dec0 liblcms1 liblcms2-2

  liblensfun-data liblensfun0 liblqr-1-0 libmagickcore5 libmagickcore5-extra

  libmagickwand5 libnetpbm10 libopenexr6 libpango1.0-0 libpaper-utils

  libpaper1 libpixman-1-0 librsvg2-2 librsvg2-common libsm6 libthai-data

  libthai0 libtiff4 libwmf0.2-7 libxcb-render0 libxcb-shm0 libxext6 libxft2

  libxrender1 libxt6 netpbm poppler-data ufraw-batch x11-common

0 upgraded, 57 newly installed, 0 to remove and 85 not upgraded.

Need to get 24.5 MB of archives.

After this operation, 66.5 MB of additional disk space will be used.

Do you want to continue [Y/n]?



위와 같이 무려 57개의 패키지를 설치해아 하므로 추천드리진 않습니다.



7. 접속하기


이제 끝입니다.


인터넷 브라우저에 http://MyCloud내부IP/public 을 넣으면




▲ 짜잔~~ 나옵니다.



외부에서 접속하려면 DDNS 및 포트포워딩 (80포트를 80포트나 8080 이나 8887 같은 외부포트로) 하면 됩니다.




참고로 h5ai 세부사항은


http://MyCloud내부IP/_h5ai


위 주소로 들어가면 볼 수 있습니다.




▲ 순정상태라면 위와 같이 이미지 썸네일, 동영상 썸네일, PDF썸네일 생성이 되지 않습니다.


그래도 이미지를 클릭하면 출력은 되므로 큰 문제는 없습니다.



소스리스트 수정하여 패키지를 깔면




 위와 같이 모든 모듈이 활성화되는 것을 볼 수 있습니다.



옵션 설정 부분은


http://thebenet.net/bbs/board.php?bo_table=doc&wr_id=13


위 링크를 참조하세요.



nano /var/www/htdocs/_h5ai/conf/options.json


위 명령어로 옵션부분 수정 가능합니다.



8. 암호 추가하기 (선택)



기본 설정은 누구나 접근 가능하기 때문에 암호를 이용하여 보호할 수 있습니다.


nano /etc/apache2/sites-available/h5ai.conf


위 명령어로 h5ai 전용 아파치 설정으로 들어갑니다.




<Directory /var/www/htdocs/public/>
DirectoryIndex index.html index.php /_h5ai/server/php/index.php
AuthType basic
AuthName h5ai
AuthuserFile /DataVolume/shares/Public/.htpasswd
require valid-user
Order allow,deny
Allow from all
</Directory>
AccessFileName .htaccess



위와 같이 수정합니다.


컨트롤 + O, 엔터, 컨트롤 + X로 저장 후 빠져나옵니다.


또한 태그를 똑같이 하신뒤 Directory의 경로만 바꿔주시면 부분 암호걸기가 가능합니다.


암호 부분은 김병준님과 Simon Ok님의 피드백으로 수정하였습니다.




nano /DataVolume/shares/Public/.htaccess



AuthType basic

AuthName h5ai

AuthuserFile /DataVolume/shares/Public/.htpasswd

AuthGroupFile /dev/null

require valid-user


위 내용을 추가합니다.



htpasswd -cb /DataVolume/shares/Public/.htpasswd 아이디 비번


위와 같은 형식으로 아이디 비번을 생성합니다.



service apache2 restart


위 명령어로 아파치를 재시작합니다.

, , , , , ,

59 Comments
우성군 2015.10.29 22:20  
음... 그렇다면 그냥 무식한 방법으로

실제 파일을 다운 받은 후 WINSCP를 이용하여 마클로 넘기는 게 좋아보입니다
닭비둘기 2016.01.17 23:18  
그냥 네이버 블로그에 자료 올려두고 파일 링크를 wget -O h5ai.zip ttp://blogattach.naver.com/xxxxxx
해도 되네영.(혹시 모르니까 http 풀로 안썼습니돠)

그리고 권한 수정할때 /h5ai-master/ 이렇게 써주면 되요!!

좋은자료 언제나 감사합니다!
우성군 2016.01.17 23:48  
[@닭비둘기] 다행이네요 ㅎㅎ
닭비둘기 2016.01.18 00:58  
[@우성군] 아니면 프로젝트 홈페이지 들어가서 다운로드 링크만 따도 되네요.
그리고 gitgub에서 받으면 안되는거 같습니다.
우성군 2016.01.18 00:59  
[@닭비둘기] 헐... 글쿤요...
닭비둘기 2016.01.18 01:08  
[@우성군] 아 오타..github..

4. 아파치 파일
DirectoryIndex index.html index.php /_h5ai/public/index.php
로 수정하시면 되요.

5. 설치
chmod -R 755 /var/www/htdocs/_h5ai/

chmod o+w /var/www/htdocs/_h5ai/public/cache/
//이부분만 수정하시면 될거같아요.

chown -R www-data /var/www/htdocs/_h5ai/

ln -s /DataVolume/shares/Public/ /var/www/htdocs/public

7. 접속하기
http://MyCloud내부IP/public
까진 맞고

세부사항 경로가 바뀌었더군요.
http://xxx.xxx.xxx/_h5ai/public/index.php
요렇게요.

마지막으로 세부사항 비밀번호는 NAS로 올리기전에 압축을 푼후
h5ai-0.28.1\_h5ai\private\conf\options
에서 "passhash":를 바꿔주면 되네요.
주석에 해쉬생성해주는 링크가 걸려있습니다.

다했다면 다시 압축하고 나스로 올리면 되요!!
우성군 2016.01.18 01:56  
[@닭비둘기] 좋은 정보 감사합니다~!
Honggu Lim 2017.02.07 23:36  
안녕하세요 우성군님 ^^
퍼블릭 폴더는 잘 붙는데 나스에 있는 Share 폴더를 쓰고싶어서
ln -s /DataVolume/shares/Share/ /var/www/htdocs/share
를 했는데 웹으로 접속하면
권한이 없다면서
Forbidden
You don't have permission to access /share/ on this server.
이렇게 뜨네요...
어떻게 해야하나요? ㅠ
대시보드에서 공유 설정은 해놨습니다.
우성군 2017.02.09 01:13  
[@Honggu Lim] 음.. 아무래도 대시보드상 폴더의 권한이 제대로 안되어 있는 듯 합니다.

퍼블릭 폴더는 완전히 개방되어 있을텐데...

대시보드에 공용 억세스에 체크해보세요.

그래도 안되면... 힘들듯 합니다.
Facebook Twitter GooglePlus KakaoStory KakaoTalk NaverBand