ft_server

ft_server 따라잡기 (도커, nginx 서버, php웹서버)

코딩클로스 2021. 1. 21. 17:01

 

목차

    1. wsl2 설치 및 도커 설치

    www.44bits.io/ko/post/wsl2-install-and-basic-usage

     

    WSL2(Windows Subsystem for Linux 2) 설치 및 사용 방법

    지난 5월 윈도우10의 대규모 업데이트가 있었습니다. 이번 업데이트에는 WSL2 정식 릴리스가 포함되어있습니다. WSL은 경략 가상화 기술을 통해 윈도우에서 리눅스 배포판을 사용할 수 있게 도와

    www.44bits.io

    2. 데비안 버스터 이미지 가져오기 

    docker pull debian:buster

    명령어를 사용한다. 내 컴퓨터에 데미안 버스터 이미지가 없기 때문에 도커 허브에서 받아온다.

     

    3. 데비안 버스터 터미널에 들어가기

    터미널에 들어가서 여러가지 설정해야 할 것이 많다. 

    nginx라는 웹서버 설치 , ssl 인증서 설치 등등 그렇기에 직접 컨테이너 안에 들어가서 명령어를 실행해야 한다. 

    아니 그러면 만약 내가 웹서버를 배포할꺼면 매번 이렇게 이미지 받고 명령어를 쳐야 하냐? 귀찮네 라고 의문이 들수도있다. 그래서 우리가 도커 파일을 배우게 될것이다. 일단 도커파일을 만들기 전에 우리가 구축해야 하는 환경을 차근차근해보자.

    docker run -it -p 80:80 -p 443:443 debian:buster

    명령어의 의미를 알아야 한다. 의미도 모르고 쓰면 안 된다.

    run 새 컨테이너에서 명령 실행
    -it  -i와 t를 동시에 사용한 것으로 터미널 입력을 위한 옵션
    STDIN 표준 입출력을 열고 가상 tty (pseudo-TTY) 를 통해 접속하겠다는 의미이다. 
    -p  publish의 약자 컨테이너와 호스트의 포트를 연결 (포워딩)

    -p는 엄청 중요하다 호스트 ip 80번 포트로 접속하면 도커 컨테이너의 80번으로 접속이 가능하다는 뜻이다.

    Docker host에 container 가 배포되면 각 container 에는 격리된 네트워크 환경(namespace)이 제공된다. 이 네트워크 환경은 오로지 각각의 container 만을 위한 네트워크 환경이다. 각 container에는 통신을 위한 인터페이스도 새롭게 할당되며, prviate IP도 부여받게 된다. 

    포트 포워딩 관련 dololak.tistory.com/390

    https 기본 포트 443

    http 기본 포트 80  

    포트번호를 다르게 변경해도 별 상관없다.

    명령어를 실행하면 

    컨테이너로 접속한 결과를 알 수가 있다. ctrl + d로 나가보자

    docker ps -a

    컨테이너 목록을 출력하는 ps 명령이다 

    컨테이너가 잘 생성됐다. 그럼 다시 저기에 접속해야 한다. 

    어떻게 하냐?

    docker run -it -p 80:80 -p 443:443 debian:buster  - > 아니다!!!!!!

    아니다 이건 또 컨테이너를 생성하는 것이다. 그렇기에 

     

    docker attach <name> or <id>

    그럼 이런 오류가 발생할 수 있는데 컨테이너는 실행되고 있어야 컨테이너 환경 안으로 접속할 수가 있다.

    컨테이너 시작 (중지된 컨테이너 시작) 및 재시작 (실행 중인 컨테이너 재부팅)

    docker start <name> or <id>
    docker restart <name> or <id>

    4. 데비안 버스터 컨테이너 환경에 들어가서 nginx 설치

     os환경을 최신 버전으로 받아주자.

    그다음 엔진엑스를 받아주자 그런데 명령어를 잘 살펴보면 -y가 붙는 명령어가 있다 이건 뭐냐면 yes옵션을 넣는 것이다 나중에 도커파일할때 명심해야한다 지금은 우리가 터미널에서 yes를 입력할 수 있지만 도커파일에선 yes를 입력할수가 없다 그렇기에 명령어 자체에 yes 옵션을 넣는것이다

    apt-get update
    apt-get upgrade
    apt-get -y install nginx

    엔진엑스 웹서버를 설치했는데 어떻게 확인하고 실행하냐?? 

     

    service nginx start 엔진엑스 서버 가동
    service nginx satuts 엔진엑스 서버 상태
    service nginx restart 엔진엑스 서버 재가동

    이제 웹페이지를 켜서 도메인 창에 localhost 또는 ipv4 주소로 접속하자

    내 ip번호 해킹하지 마라 부탁합니다... 

     

    아까 내가 컨테이너 실행할 때 포트 포워딩했기에 지금 이렇게 잘 접속하는 것이다.

     

     

    5. 보안을 위한 ssl 설치 및 리다이렉션 설정

    openssl 설치

    apt-get -y install openssl

    개인키 및 인증서 생성

    openssl req -newkey rsa:4096 -days 365 -nodes -x509 -subj "/C=KR/ST=Seoul/L=Seoul/O=42Seoul/OU=Gam/CN=localhost" -keyout localhost.dev.key -out localhost.dev.crt

    req : 인증서 요청

    -newkey : 개인키 생성을 위한 옵션

    -keyout <name> : <name>이란 이름으로 키 파일을 생성

    -out <crt_name> : <crt_name> 이란 이름으로 인증서를 생성

    -nodes : 이 옵션은 개인키를 암호화하지 않기 위한 옵션이다. 이 옵션이 없을 경우 최소 4자의 암호를 입력해야 함

    -x509 : 인증서 요청 대신 자체 서명된 인증서를 출력하는 옵션으로 테스트 인증서 혹은 자체 서명된 루트 CA를 생성하는 데 사용한다.

    -subj"": 이 옵션은 subject를 입력하기 위한 옵션으로 해당 옵션과 뒤의 내용을 기입하지 않으면 표준으로 입력해주어야 한다. CN의 경우 사용하려는 domain이름과 같아야 하며

     

    출처 

     

    밑의 명령어들을 실행하자

    mv localhost.dev.crt etc/ssl/certs/      -> 나중에 default 파일에서 서버설정할때 위치 인증서와 키 위치를 적어줄거임
    mv localhost.dev.key etc/ssl/private/   -> 나중에 default 파일에서 서버설정할때 위치 인증서와 키 위치를 적어줄거임
    chmod 600 etc/ssl/certs/localhost.dev.crt etc/ssl/private/localhost.dev.key  -> root 계정에 권한을 줌

    이제 문서작업을 해야 하니 밑에 명령어를 실행하자

    apt-get -y install vim
    vim etc/nginx/sites-available/default

    밑의 그림과 같이 적어주자.

    http 80 포트로 들어오는 모든 트래픽을 https로 리다이렉션 시켜줘야 한다. 

    listen 80 서버 블록은 지정된 도메인의 포트 80에서 들어오는 연결을 수신한다.
    listen [::] : 80 이 라인은 위와 동일하지만 모든 IPv6 HTTP 트래픽에 대해 작동한다
    return 301 https://$host$request_uri;  "301"은 트래픽을 리디렉션하는 데 사용된다. 
    "https : // $ host $ request_uri;" - > 모든 트래픽이 리디렉션되는 대상

    ex) http://localhost/index.php 이런 URL로 접속한다면 host = localhost,  request_uri = index.php

     

    service nginx restart 명령어로 다시 서버를 실행하자

     

    리다이렉션이 제대로 적용됐는지 테스트해보자 

    3개 주소 모두 밑의 화면이 뜬다면 제대로 잘 작동하고 있다.

    주의 요함이 뜬다고 걱정마라 브라우저가 가지고 있는 CA 리스트에는 당연히 내가 만든 인증서는 없기에 공식 인증서로 인식하지 못하기 때문이다. 

    만약 공식 CA인증서를 받는다면 밑과 같이 뜰 것이다. 필자는 나중에 웹서버를 개발하고 도메인을 사게 된다면 무료 CA공식 인증을 받아볼 생각이다. 

     

    리다이렉션 참고 문서 

    sepiros.tistory.com/42

    serversforhackers.com/c/redirect-http-to-https-nginx

    www.psychz.net/client/question/ko/nginx-redirect-http-to-https.htm

    linuxize.com/post/redirect-http-to-https-in-nginx/

    phoenixnap.com/kb/redirect-http-to-https-nginx

     

    Nginx HTTP redirect to HTTPS 및 포트 포워딩 개념 추가 

    jackerlab.com/nginx-redirect-port-forwarding/

    6. 데비안 버스터에 php-fpm 설치 및 nginx x php-fpm 연동

    nginx는 웹서버이면서 정적인 콘텐츠만을 제공한다. 동적 페이지를 구현하기 위해서 웹 서버 대신 동적 콘텐츠를 읽은 뒤 html로 변환시켜 웹 서버에게 다시 전달해주는 외부 프로그램(php 모듈)이 필요하다.

     

    우리는 동적 페이지를 구현하기 위해 php를 사용한다.

     

    php란?

    PHP(PHP: Hypertext Preprocessor)는 C언어를 기반으로 만들어진 서버 측에서 실행되는 서버 사이드 스크립트 언어다. PHP로 작성된 코드를 HTML 코드 안에 추가하면, 웹 서버는 해당 PHP 코드를 해석하여 동적 웹 페이지를 생성한다.

     

    우린 DB작업도 할 것이고 사용자 즉 클라이언트의 행동에 따라 즉시 웹페이지 화면이 바뀌는 동적인 웹페이지를 제공해야 하기 때문에 php-fpm를 사용하여 nginx와 php를 연동시켜주는 것이다

     

    일단 설치부터 하자 그리고  또 sites-available에 위치한 default 파일을 설정해주자.

    apt-get -y install php-fpm
    vim /etc/nginx/sites-available/default

    fpm 버전은 자기가 설치한 버전과 동일하게 잘 적어줘야 한다.

     

    fpm-php와 nginx를 연동하기 위한 default파일 설정

    php-fpm 작동 확인

    service php7.3-fpm start   
    service php7.3-fpm status
    service nginx restart

     

    지금 계속 설정 파일들을 건들고 있다. 그러니깐 이 설정 파일들의 의미와 원리에 대해 정리해보았다.

    • sites-available: 가상 서버 환경들에 대한 설정 파일들이 위치하는 부분. 가상 서버를 사용하거나 사용하지 않든 간에 그에 대한 설정 파일들이 위치하는 곳이다.
    • sites-enabled: sites-available에 있는 가상 서버 파일들 중에서 실행시키고 싶은 파일을 symlink로 연결한 폴더.. 실제로 이 폴더에 위치한 가상 서버 환경 파일들을 읽어서 서버를 세팅한다.
    • nginx.conf: Nginx에 관한 설정 파일로 Nginx 설정에 관한 블록들이 작성되어 있으며 이 파일에서 sites-enabled 폴더에 있는 파일들을 가져온다.

    말만 보면 이해 가기가 어렵다. 나중에 내가 다시 읽었을 때 이해하지 못할 거 같다. 미래의 나를 위해서 이해하기 쉽게 정리를 하겠다. sites-available은 일단 웹서버에 대한 설정 파일들을 작성할 수 있다. 그러나 실제로 컴퓨터는 sites-enabled에 있는 파일들을 읽어서 웹서버 환경을 구축한다. 그럼 의문이 갈 수도 있다. 아니 어떻게? sites-available파일을 수정했는데 환경이 바뀌는가?? 바로 심볼릭 링크이다. 심볼릭 링크를 걸어놔서 sites-available에 있는 default파일을 수정하면 sites-enabled에도 반영되는 것이다. 그러면 sites-available에 환경을 설정할 수 있는 여러 파일들을 미리 비축해서  나중에 사용하고 싶은 환경을 심볼릭 링크로 걸어주면 된다. 이러한 예시를 정말 잘 보여주는 블로그가 있어서 남겨 두겠다.

    twpower.github.io/50-make-nginx-virtual-servers 

    autoindex 설정하기

    The ngx_http_autoindex_module module processes requests ending with the slash character (‘/’) and produces a directory listing. Usually a request is passed to the ngx_http_autoindex_module module when the ngx_http_index_module module cannot find an index file.

    일단 autoindex의 기능은 URL로 접근해서 index목록에 해당하는 파일이 없다면 리스트 형태로 파일들을 보여주는 옵션이다

    vim /etc/nginx/sites-available/default

     

    cd /var/www/html/

    여기서 index.nginx-debian.html  파일을 삭제하거나 다른 곳으로 옮겨주면 autoindex 가 제대로 작동하는지 확인할 수 있다.

     

    7. MariaDB(mysql) 설치 및 계정 생성

    apt-get -y install mariadb-server php-mysql 컨테이너에 mysql 설치
    service mysql start mysql 서비스 가동
    mysql -u root root 계정으로 mysql 접속
    create database wordpress; wordpress라는 데이터베이스(스키마) 생성
    CREATE USER 'parkjiyul'@'localhost' IDENTIFIED BY '1234'; 계정생성 parkjiyul 비밀번호 1234
    GRANT ALL PRIVILEGES ON wordpress.* TO 'parkjiyul'@'localhost' WITH GRANT OPTION; parkjiyul 이란 계정에 wordpress라는 데이터베이스에 대하여 권한을 줌 

    밑과 같이 테스트해보면 테이블이 하나도 생성되어 있지 않은 것을 알 수 있다.

     

    8. Wordpress 설치

    wget https://wordpress.org/latest.tar.gz 워드프레스 최신버전을 받아온다
    tar -xvf latest.tar.gz  압축파일을 푼다
    mv wordpress/ var/www/html/  html로 옮긴다
    chown -R www-data:www-data /var/www/html/wordpress 유저 그룹 권한 설정
    nginx.conf를 보면 user로 www-data가 작성되어있다. wordpress의 유저 그룹을 그에 맞게 설정해준 것이다.

    wp-config.php 파일 수정 작업을 시작하겠다.

     

    참고 문서

    wordpress-tip.tistory.com/1

    cp -rp /var/www/html/wordpress/wp-config-sample.php /var/www/html/wordpress/wp-config.php wp-config-sample.php 을 복사해 wp-config.php 를 만든다.
    vim var/www/html/wordpress/wp-config.php DB_NAME DB_USER DB_PASSWORD를 수정해야한다

    7번 단계에서 내가 아이 뒤 parkjiyul 비밀번호 1234로 설정했다. 그림같이 제대로 작성하지 않으면 작동하지 않는다

     

    service php7.3-fpm restart로 다시 리로드도 하자

    이렇게  아까 mysql에 내가 만든 계정과 같게 잘 적어주면 된다.

    밑의 그림이 나오면 성공이다.

    이건 wordpress 관리 툴을 회원 가입하는 장면이다

    7번 과정에서 비어 있던 테이블들이 생성되었다.

    9. phpmyadmin 설치 및 설정

    phpmyadmin은 웹에서 DB를 관리할 수 있다.

     

    phpmyadmin 설치 

    apt-get install -y wget wget을 설치한다
    wget https://files.phpmyadmin.net/phpMyAdmin/5.0.2/phpMyAdmin-5.0.2-all-languages.tar.gz 웹 다운로드실행
    tar -xvf phpMyAdmin-5.0.2-all-languages.tar.gz 파일압축 풀기
    mv phpMyAdmin-5.0.2-all-languages phpmyadmin 파일명 변경
    mv phpmyadmin /var/www/html/ phpmyadmin 폴더를 엔진엑스 웹파일들이 모여있는곳으로 이동

    phpmyadmin 설정 (쿠키 권한을 위한 blowfish 암호 설정)

    phpmyadmin 폴더에 들어가 보면 정말 많은 파일들이 있다. 그중 config.sample.inc.php을 복사해 config.inc.php 파일을 만든다.

    cp -rp var/www/html/phpmyadmin/config.sample.inc.php var/www/html/phpmyadmin/config.inc.php 

    vim
     var/www/html/phpmyadmin/config.inc.php

    blowfis password 생성사이트

    phpsolved.com/phpmyadmin-blowfish-secret-generator/?g=%5Binsert_php%5Decho%20$code;%5B/insert_php%5D

     

     

     

     

     

    https://localhost/phpmyadmin/

    에 접속해보자

     

     

    이렇게 댓글을 남겨보면

     

    이렇게 잘 DB가 연동되어 있다.

     

    참고 문서

    velog.io/@hidaehyunlee/ftserver-%EC% B4%9D-%EC% A0%95% EB% A6% AC-%EB% 8F%84% EC% BB% A4-%EC%84% A4% EC% B9%98% EB% B6%80% ED%84% B0-%EC% 9B% 8C% EB%93% 9C% ED%94%84% EB% A0%88% EC% 8A% A4-%EA% B5% AC% EC% B6%95% EA% B9% 8C% EC% A7%80

     

    [ft_server] 총 정리 : 도커 설치부터 워드프레스 구축까지

    과제 시작부터 마무리까지 기록한 내용들.

    velog.io

     

    'ft_server' 카테고리의 다른 글

    HTTPS 와 SSL 인증서  (0) 2021.01.19