우분투 서버에 가벼운 웹하드 h5ai 설치하기

Ubuntu Server

우분투 서버에 가벼운 웹하드 h5ai 설치하기

1. h5ai란?


Nginx나 Apache의 경우 autoindex 로 파일 및 폴더를 목록으로 뿌려주는 기능이 있습니다.


하지만 그렇게 깔끔하진 않죠.


다운 받는 기능 밖에 없고, 폴더별로 다운 받기는 불가능합니다.


그래서 웹서버와 PHP만 깔려있으면 폴더별 다운 받기, 드래그 후 원하는 파일만 zip으로 압축하여 받기, 간단하게 드래그하여 파일 업로드 하기 등등


꼭 필요한 기능을 쉽게할 수 있는 프로그램이 바로 h5ai입니다.


공식 홈페이지는 http://larsjung.de/h5ai/  <- 여기 있고, 공식 샘플은  http://larsjung.de/h5ai/sample/  <- 여기 있습니다.





▲ 물론 저도 위와 같이 데모 사이트를 운영 중입니다. URL은 http://data.wsgvet.com  입니다.



2. Apache2에서 h5ai 설치하기


관련링크 1을 참조하세요!



3. Nginx에서 h5ai 설치하기


기본적으로 관련링크2를 참조하였습니다.


보통 Nginx + PHP-FPM이 셋트로 깔려있겠죠?


apt-get install php5-gd ffmpeg zip imagemagick


위와 같이 추가로 필요한 패키지를 설치합니다.


zip으로 압축하여 다운 받기, 이미지 썸네일 만들기, PDF 썸네일 만들기, 동영상 썸네일 만들기가 가능해집니다.



service php5-fpm reload


위 명령어로 php에 적용될 것이구요.



http://larsjung.de/h5ai/


위 공식 사이트에 가서 최신버전을 다운받습니다.


압축을 풀고 원하는 위치에 올려줍니다.


저는 /var/webhard 에 올려줬습니다.






▲ WINSCP에서 보면 위와 같은 구조가 될 것입니다.



그리고 Nginx에서 설정을 해야겠죠.


nano /etc/nginx/sites-available/default


에서



server {
listen 80;
server_name your.domain.com;
charset UTF-8; 
root /var/webhard;
location / {
autoindex off;
index /_h5ai/server/php/index.php;
}
location ~* .(jpg|jpeg|png|gif|mp4|css|js|wmv|mkv|avi|asf|flv|swf|txt|zip|ico)$ {
expires 7d;
log_not_found off;
valid_referers none blocked your.domian.com your.domain1.com;
if ($invalid_referer) { return 403; }
}
location ^~ /Security {
root /var/webhard;
auth_basic "RESTRICTED ACCESS";
auth_basic_user_file /path/to/passwd/.htpasswd;
}
location ~ .php$ {
fastcgi_pass unix:/var/run/php5-fpm.sock;
fastcgi_index index.php;
include fastcgi_params;
fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
}
}



▲ 저는 위와 같이 코드를 넣어줬습니다.



server_name your.domain.com;


우선 서버네임부터 바꿔주시구요.



주목해야 할 점은 


index /_h5ai/server/php/index.php;


윗 부분인데요.


root폴더에 index파일이 없기 때문에 해당 상대경로의 index파일을 읽는 다는 말입니다.



그리고 옵션으로 몇가지 넣어줬는데요.


location ~* \.(jpg|jpeg|png|gif|mp4|css|js|wmv|mkv|avi|asf|flv|swf|txt|zip|ico)$ {


윗 부분은 해당 확장자를 가진 파일들의 외부링크를 막고, 만료기간을 줬습니다.



valid_referers none blocked your.domian.com your.domain1.com;


위에 빨간 글자들은 자신의 사이트에 맞게 교체해주세요.


해당 URL이 있는 곳에선 외부링크가 허용됩니다.



location ^~ /Security {

root /var/webhard;

auth_basic "RESTRICTED ACCESS";

auth_basic_user_file /path/to/passwd/.htpasswd;

}


그리고 윗 부분은 암호를 거는 폴더를 지정했습니다.


/var/webhard/Security 라는 폴더에 접근을 원할 시 암호를 넣어야 하는데요.


.htpasswd 파일을 웹에서 접근 불가능한 곳에 위치시키면 더 안전하겠죠.


우분투 Nginx 디렉토리 폴더에 암호 거는 방법


아파치에서 암호 거는 방법 : http://refe.tistory.com/203



암호 추가를 원하시면 위 링크를 참조하세요!


나머지 부분은 원하시는데로 바꿔주시면 됩니다.



FTP나 삼바나 WINSCP 등등으로 /var/webhard 밑에 폴더나 파일을 넣으면




▲ 위와 같이 넣어지구요.


실제로 보여지는 부분은




▲ 위와 같이 나옵니다.


간단하게 설명드리면 _h5ai 로 시작되는 폴더나 파일들은 실제 뷰에서 보여지지 않습니다. 


마치 숨긴 폴더 및 파일로 되는거죠.


그리고 _h5ai.footer.html는 해당 폴더의 밑에 설명 부분을 넣는 파일이구요.


_h5ai.header.html는 해당 폴더의 위에 설명 부분을 넣는 파일입니다. (


그리고 ko.json은 한글 언어팩이며, /_h5ai/conf/l10n 에 넣으면 자동으로 한글로 나옵니다. (언어과 설명 파일은 테베님 자료실에서 받았습니다. 링크 바로가기)


여기 게시물 첨부파일에도 있고, http://data.wsgvet.com/Public/h5ai%20files/ 여기 제 자료실에도 있으니 받아서 보시면 됩니다.


참고로 html 파일은 ultraedit 또는 editplus 같은 편집 전용 프로그램을 써야 잘 나옵니다.


옵션 부분도 있는데요, 관련링크 2를 참조하세욧!



그리고 테베님 정말 고맙습니다!



4. 시놀로지에 h5ai 설치하기


시놀로지에도 설치 가능합니다.


DSM 5.0 4458 Update 2 에서 구동 확인했습니다.


파일 스테이션이라는 걸출한 프로그램이 있지만, 가볍게 쓰시려면 h5ai도 좋습니다.



우선 web 폴더 밑에 data라는 폴더를 생성합니다. 여기에 h5ai를 설치할 것입니다.



Putty로 들어가서


vi /etc/httpd/sites-enabled-user/h5ai.conf


위 명령어를 내립니다.


빈 화면이 나오는데요.


영문자 i 를 누르고



<Directory /var/services/web/data>
Options MultiViews FollowSymLinks ExecCGI
DirectoryIndex /data/_h5ai/server/php/index.php
</Directory>



위 내용을 넣고


esc키를 누르고 :wq 엔터를 칩니다.


그럼 저장이 되구요.


시놀로지를 재부팅 시킵니다.


그리고 http://시놀로지IP나DDNS/data로 들어가면 






위와 같이 나옵니다. 아파치 암호 거는 부분은 검색 해보시구요 (참조링크 : http://www.ppomppu.co.kr/zboard/view.php?id=nas&no=938)


그리고 시놀로지 특성상 추가 패키지 설치가 불가능하기 때문에 아무래도 폴더 통채로 받는거나, 동영상 썸네일 생성 부분이 잘 안되는 것 같더군요;;






아무튼 시놀로지에서는 파일스테이션이나 h5ai나 선택해서 쓸 수 있을 듯 합니다.



이상 가벼운 웹하드 서비스 _h5ai 설치하는 방법을 마치겠습니다.

, , , , , , , , , , , ,

36 Comments
하루하루 2014.08.06 04:02  
댓글내용 확인
우성군 2014.08.06 04:09  
음... 그 현상은 마치 경로 설정을 잘못한 것처럼 보이거든요.

NGINX인지 아파치인지 모르겠지만

경로 부분을 한번 자세히 비교해보세요.

그리고 썸네일 활성화 및 파일 드래그 부분은 옵션에서 만질 수 있습니다.

옵션 부분은

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

위 링크에서 확인하세요!
하루하루 2014.08.06 04:20  
댓글내용 확인
우성군 2014.08.06 04:44  
넵 그건 웹에서 재생하기 어렵습니다.

그 이유는 크게 두가지로 볼 수 있는데요.

각 브라우저마다 웹에서 재생할 수 있는 확장자가 정해져 있습니다.

크롬의 경우 mp4는 그냥 재생하구요.

기타 파이어 폭스나 IE의 경우 등등 전부 다릅니다.

그리고 브라우저와 상관없이 웹 플레이어로 재생하는 방법이 있지만

거기에도 avi mkv는 재생 불가능합니다.

보통 mp4 flv 등등이 많이 쓰이구요.

제일 무난한 웹플레이어는 jwplayer입니다.

해당 홈페이지에서 지원하는 확장자를 확인할 수 있습니다.
Dkmage 2015.02.05 16:33  
오드로이드U3 에서 h5ai 를 올려서 사용하고 있는데,
음악을 켜면 오래걸리지 않는데 동영상을 스트리밍으로 틀려고 하면 초기 실행때 로딩시간이 길더군요.
일단 처음 실행시킨 동영상이 돌아가면 그다음영상부턴 로딩이 거의 없었습니다.
그래서 그게 왜그런가 해서 h5ai 옵션을 이것저것 만저보던도중에 알게된게,
썸네일 기능을 끄면 첫동영상부터 바로바로 나오더라고요.

그래서 질문은 결국 초기 로딩은 썸네일 생성떄문인거같은데, 이 썸네일 생성시간을 제한건다던지, 속도를 빠르게 하는 방법은 없을까요?
우성군 2015.02.06 00:25  
음... 썸네일 때문인지 아니면 스트리밍이 아닌 파일을 다 다운 받은 뒤 재생되는지 확인 할 필요가 있겠네요.

아무튼... 동영상 부분은 잘 모르겠습니다.