홈서버관리 대시보드 organizr 설치 - nginx & php8.4 기반

Table of Contents

[Open][Close]

소개
설치 방법
Organizr 설정
관련 글들..

아래글의 내용중 홈서버관리 대시보드 organizr 설치 – nginx & php8.4 기반 가이드입니다.

#auto

casaos 기반 나스 우분투 설정가이드 – 마니의 블로그

우분투에 casaos를 설치하여 나스처럼 사용하는 가이드 입니다. 설치 부터 nginx 설정까지 처음 부터 상세히 적고 순서대로 차근 차근 따라오게끔 작성하였습니다. casaos는 설치도 쉬워 따라하기 쉽습니다.

소개

홈서버 관리 대시보드 역활을 하는 Organizr V2 입니다.

나스에 많은 서비스와 IP와 포트를 외울 필요 없이 organizr 을 사용하여 하나의 웹페이지에 나타낼수가 있습니다.

#display

많은 정보를 보시려면 아래 홈페이지에 접속하셔서 직접 확인하시기 바랍니다.

https://github.com/causefx/Organizr

GitHub – causefx/Organizr: HTPC/Homelab Services Organizer – Written in PHP

HTPC/Homelab Services Organizer – Written in PHP. Contribute to causefx/Organizr development by creating an account on GitHub.

참고로 홈대시보드로 사용되는 프로그램은 아래와 같습니다.

organizr과 gethomepage 두가지 추천 드립니다.

설치 방법

웹서버 nginx – php8.4로 설치 진행 합니다. 기껏 nginx설치해 봤는데 nginx + php 조합으로 설치해보겠습니다.

먼저 nginx 설치는 아래 글 참고 바랍니다.

Nginx – extras 설치와 기본 설정

Nginx extras 설치와 기본 설정 방법을 안내합니다. 패키지별 차이점, 설치 방법, 사이트별 설정(sites-available, sites-enabled)을 통해 도메인 호스팅을 설정하고, default 파일 삭제로 깔끔한 환경을 만들어보세요.

php8.4 설치

php8.4 버전을 설치합니다.

sudo apt update && sudo apt install -y php8.4-fpm

php8.4 확장 모듈을 설치합니다.

sudo apt install -y php8.4-common php8.4-mysql php8.4-xml php8.4-xmlrpc php8.4-curl php8.4-gd php8.4-imagick php8.4-cli php8.4-dev php8.4-imap php8.4-mbstring php8.4-opcache php8.4-redis php8.4-soap php8.4-zip php8.4-mysql php8.4-sqlite3 sqlite3

php8.4 설정

관리자 권한으로 로그인 후 진행합니다.

sudo su

cd /etc/php/8.4/fpm

설정파일 백업

cp /etc/php/8.4/fpm/php.ini /etc/php/8.4/fpm/php.bak

아래 내용을 적용하기 위에 진행합니다.

메모리 제한: memory_limit → 1024M
업로드 파일 크기 제한: upload_max_filesize → 256M
POST 데이터 크기 제한: post_max_size → 256M
세션 유지 시간: session.gc_maxlifetime → 7200초
스크립트 실행 시간: max_execution_time → 18000초
기본 시간대: date.timezone → Asia/Seoul
최대 입력 변수: max_input_vars → 5000
입력 데이터 처리 시간: max_input_time → 60초

아래 명령어를 복사해 바로 붙여넣기 합니다. 한줄 씩 따로 붙여넣기 할 필요없습니다.

sed -i "s/memory_limit = .*/memory_limit = 1024M/" /etc/php/8.4/fpm/php.ini && \
sed -i "s/upload_max_filesize = .*/upload_max_filesize = 256M/" /etc/php/8.4/fpm/php.ini && \
sed -i "s/post_max_size = .*/post_max_size = 256M/" /etc/php/8.4/fpm/php.ini && \
sed -i "s/session.gc_maxlifetime = .*/session.gc_maxlifetime = 7200/" /etc/php/8.4/fpm/php.ini && \
sed -i "s/max_execution_time = .*/max_execution_time = 18000/" /etc/php/8.4/fpm/php.ini && \
sed -i "s/;date.timezone =/date.timezone = Asia\/Seoul/g" /etc/php/8.4/fpm/php.ini && \
sed -i "s/;max_input_vars = .*/max_input_vars = 5000/" /etc/php/8.4/fpm/php.ini
sed -i "s/max_input_time = .*/max_input_time = 60/" /etc/php/8.4/fpm/php.ini

organizr github 복사

아래 원하는 구매한 도메인명으로 폴더를 생성합니다. – domain 을 자신의 도메인으로 변경하세요

홈대시보드로 사용하기에 home.domain.com으로 진행하겠습니다. – 서브 도메인은 선택사항입니다.

sudo mkdir -p /var/www/home.domain.com

해당 git 다운로드 – domain 을 자신의 도메인으로 변경하세요

sudo git clone https://github.com/causefx/Organizr /var/www/home.domain.com

Organizr Nginx 서버 설정 작성

Organizr Nginx 서버 설정을 작성합니다. – domain 을 자신의 도메인으로 변경하세요

서브도메인으로 작성해봅니다. home.domain.com 이런식으로 원하는 서브도메인명을 정하면 됩니다.

서브도메인 정하고 꼭 cloudflare에 서브도메인 등록하셔야 합니다.

sudo nano /etc/nginx/sites-available/home.domain.com

nginx 설정은 아래와 같이 작성합니다. – domain 을 자신의 도메인으로 변경하세요

아래 plex, gethompage는 서브패스로 사용할 예정이라 관련 설정이 길어졌습니다. (주석 참조)

# HTTP에서 HTTPS로 리디렉션 설정
server {
    listen 80;
    server_name home.domain.com;

    # HTTP 요청을 HTTPS로 리디렉션
    return 301 https://$host$request_uri;
}

# HTTPS 설정
server {
    
    listen 443 ssl http2;
    server_name home.domain.com;
    root /var/www/home.domain.com;

    # 서버 토큰 숨기기
    server_tokens off;
    index index.php index.html index.htm;

    # SSL certificates
    ssl_certificate /etc/ssl/certs/domain.com.pem;
    ssl_certificate_key /etc/ssl/private/domain.com.key;
    ssl_dhparam /etc/ssl/certs/dhparam.pem;

    # SSL settings
    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_prefer_server_ciphers on;

    # 보안 헤더 설정 organizr ifame 허용
    add_header X-Content-Type-Options "nosniff" always;
    add_header X-XSS-Protection "1; mode=block" always;
    add_header X-Frame-Options "ALLOW-FROM https://home.domain.com";  # organizr 페이지 url
    add_header Content-Security-Policy "frame-ancestors 'self' https://home.domain.com"; 


    # Prevent access to hidden files
    location ~ /\. {
        deny all;
    }

    # 기본 location 블록 추가
    location / {
        try_files $uri $uri/ /index.php$is_args$args;
    }

    # PHP 처리 설정
    location ~ \.php$ {
        include fastcgi_params;
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/run/php/php8.4-fpm.sock;
        fastcgi_param SCRIPT_FILENAME $document_root/$fastcgi_script_name;
        
        # fastcgi 버퍼 설정 추가
        fastcgi_buffers 32 32k;
        fastcgi_buffer_size 32k;
    }

    # Organizr 인증 설정
    location ~ /organizr-auth/(.*) {
        internal;
        rewrite ^/organizr-auth/(.*) /api/v2/auth/$1;
    }

    # API 위치 블록 수정
    location /api/v2 {
        try_files $uri $uri/ /api/v2/index.php$is_args$args;
        
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_pass unix:/run/php/php8.4-fpm.sock;
        fastcgi_index index.php;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }
    ### plex를 서브패스에 연결할 내용입니다.
    location /web {
        proxy_pass http://localhost:32400/web;
        proxy_set_header Host $host;
        proxy_redirect http:// https://;
        proxy_http_version 1.1;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }

    

       ### gethomepage 설치 후 서브패스에 적용할 내용입니다.
       location ~ ^/homepage($|/.*) {
            set $app 'homepage';

            # Strip prefix path from request URL to pass to the server
            rewrite ^/homepage/?(.*)$ /$1 break;
            proxy_pass http://localhost:3100;

            # Redirect location header of proxied server responses
            proxy_redirect ^ /$app;

            # Sub filters to replace hardcoded paths in served web content
            proxy_set_header Accept-Encoding "";
            sub_filter_once off;
            sub_filter_types *;
            sub_filter '/_next/' '/$app/_next/';
            sub_filter '/api/' '/$app/api/';
            sub_filter '/android-' '/$app/android-';
            sub_filter '/apple-' '/$app/apple-';
            sub_filter '/favicon-' '/$app/favicon-';
        }
    

}

아래 명령어로 심볼링 링크를 걸어줍니다. – domain 을 자신의 도메인으로 변경하세요

sudo ln -s /etc/nginx/sites-available/home.domain.com /etc/nginx/sites-enabled/

Nginx 재시작

sudo systemctl restart nginx

Organizr 초기 접속 설정

https://home.domain.com 를 입력해 설정 페이지로 이동합니다. – domain 을 자신의 도메인으로 변경하세요

아래에서 부터는 시놀로지 설치와 동일해 시놀로지 docker설치 내용 그대로 사용합니다.

아래 설치 타입을 개인용도로 선택해줍니다.

유저 ID와 이메일 패스워드를 입력해줍니다.

아래 해시키와 등록 비밀번호는 그냥 위에 설정했던 패스워드랑 동일하게 진행해주시고 넘어갑니다. (API값은 자동 생성됨)

(아래는 구글 번역으로 보이는 화면입니다.)

데이터 베이스 생성부분입니다.

SQLite3로 선택해주시고 데이터베이스는 organizr로 선택 후

데이터베이스 위치는 위에 현재 디렉토리 옆에 복사하기 아이콘을 클릭하시면 입력됩니다.

마지막 Finish를 누르시면 설치가 완료됩니다.

Organizr 설정

하나 하나 파고들면 저도 힘들고 보시는 분들도 힘드니 최대한 쓸모있는것만 보여드리겠습니다.

Home 설정

위에 이미지처럼 홈화면을 설정해주는 방법입니다.

탭에디터 – Homepage items – 자기가 사용하는 서비스부분을 선택해주면 설정하는 창이 나오면 설정을 도와줍니다.

Home 화면 Plex 설정

한가지 예를 들어 plex를 설정한다고 하면

왼쪽 enable 항목에서 plex항목을 enable 해주시고 connection 부분에 자신의 서버 localhost:32400 을 집어넣어주고

Get Plex Token 버튼을 누르면 로그인 창이 뜨며 자동적으로 API Key가 채워집니다.

그리고 아래 Gey Plex Machine 을 클릭하면 자신이 운영하는 서버를 선택할 수 있는 항목이 나옵니다.

설정 부분이 쉬우니 하나씩 설정해주시면 되고 꼭 Recent items 항목은 Enable로 해주시면 보기 새로운 항목 추가된걸 홈화면에서 확인하실 수가 있습니다.

다른 서비스설정도 쉬우니 홈화면에 보여줄 서비스를 선택하시고 Plex 처럼 쉽게 설정하시면 되겠습니다.

Tab Editor

아래와 같이 왼쪽의 탭 부분을 설정해주는 작업을 합니다.

아래 화면 보시면 빨간색으로 표시된 부분만 아시면 되겠습니다.

DEFAULT – organizr 접속 시 처음 화면입니다. 원하는 탭에 체크합니다.

ACTIVE – 활성화 해야지 표시가 됩니다.

SPLASH – 처음 접속할때 위에 DEFAULT 화면이 표시되는게 아니고 북마크탭처럼 SPLASH 화면을 보여주게 합니다. 다 체크 해제해주세요!!!

그리고 카테고리를 생성하면 아래와 같이 카테고리별로 묶으실 수도 있습니다.

탭에디터 부분 상단 우측에 + 버튼을 눌러 탭을 생성해봅시다.

아래와 같이 내부 내용 채워 주시면 됩니다.

참고로 기본 제공하는 이미지 외에 다른 아이콘은 파일명 변경하셔서 업로드하시면 됩니다.(아래 이미지 업로드)

iFrame 지원

아래와 같이 iFrame 통해 탭을 연결 하면 바로 oranizr 앱에서 보실 수가 있습니다.

아이콘 이미지 업로드

시놀로지 어플 아이콘은 기본적으로 제공하지 않으니 이미지 매니져로 업로드 후 사용하시면 되겠습니다.

참고로 아이콘 파일명을 어플명으로 변경하셔서 사용하셔야 검색 할 때 편합니다.

원하는 항목이 없으면 아래 항목에서 셀프호스트 대시보드 아이콘 사이트에서 다운 받아 업로드 후 사용 가능합니다.

Self-Hosted Dashboard Icons

A collection of self-hosted dashboard icons and logos

북마크탭

저는 사용하지 않지만 아래처럼 북마크탭을 생성해서 사용 가능합니다.

하지만 전 디자인이 별로라 북마크바 같은 경우 gethomepage 로 대체하시는게 더 나을듯 합니다.

gethomepage 설치와 설정

홈대시보드는 이 두개면 충분합니다. 나머지 다 설치해봤는데 뭔가 부족하더군요!!!

도움 되셨으면 따듯한 커피한잔 부탁드려요!

도움 되셨으면 유튜브 구독 부탁드려요!!!!

홈서버관리 대시보드 organizr 설치 – nginx & php8.4 기반

소개

설치 방법

php8.4 설치

php8.4 설정

organizr github 복사

Organizr Nginx 서버 설정 작성

Organizr 초기 접속 설정

Organizr 설정

Home 설정

Home 화면 Plex 설정

Tab Editor

iFrame 지원

아이콘 이미지 업로드

북마크탭

관련 글들..

Cloudflare SSL/TLS 적용 – 클라우드플래어 https 설정 가이드

도메인 구매와 cloudflare로 이전

casaos 설치 방법 – 우분투 초기 설정 기준

Nginx – extras 설치와 기본 설정

시놀로지 gethomepage 설치와 설정

About the Author: 마니

홈서버관리 대시보드 organizr 설치 – nginx & php8.4 기반

소개

설치 방법

php8.4 설치

php8.4 설정

organizr github 복사

Organizr Nginx 서버 설정 작성

Organizr 초기 접속 설정

Organizr 설정

Home 설정

Home 화면 Plex 설정

Tab Editor

iFrame 지원

아이콘 이미지 업로드

북마크탭

관련 글들..

Share This Story, Choose Your Platform!

About the Author: 마니

Related Posts