course/spartacoding

[웹개발 종합반] 5주차 (2) 배포 (런칭)

hjkim0502 2021. 11. 5. 17:46

1. 배포: 누구나 내 서비스를 이용할 수 있도록 프로젝트를 서버에 올리는 것

클라이언트-서버 통신

  • 클라이언트의 요청(html,css,js 요청 & 데이터 요청)을 언제나 응답할 수 있도록
    • 항상 켜져있으며, 프로그램이 실행 중이어야 함
    • 모두가 접근할 수 있게 공개 IP주소로 접근할 수 있게 해야 함
  • 어떠한 컴퓨터나 서버의 역할을 수행할 수 있음 -> 개인 컴퓨터를 서버로 활용 시 보안에 취약
  • 수많은 본체를 모아놓고 서버실을 운영하기도 함
  • 통상적으로 클라우드 서비스를 활용해 코드를 인터넷 환경에 업도르 하고 그 서버를 통해 서비스 이용하게 함

※ IP주소와 포트

DNS

  • IP주소: 컴퓨터마다 통신할 수 있도록 가지는 고유한 주소. 서버마다 주소 하나씩
    • 하나의 IP에 여러 포트가 있고, 하나의 포트마다 하나의 프로그램 실행 가능
  • URL은 숫자로된 IP를 우리가 보기 좋게끔 알파벳으로 바꾼 것. 이 변환 시스템이 DNS

 

2. AWS: Amazon Web Service

  • 인스턴스 : (나의 서버가 될)컴퓨터
  • 리눅스의 우분투 서버로 구매 (1년간 무료)
  • 키페어가 있어야 구매한 인스턴스 접속 가능 (다운로드 후 관리 중요!)
  • 1년 넘어가기 전에 인스턴스 사용 종료 : 인스턴스 상태 -> 종료 or 중지
  • 인스턴스 원격 접속
    • SSH(Secure Shell Protocol)
      • 다른 컴퓨터에 접속할 때 사용하는 프로그램
      • 보안이 상대적으로 뛰어남
      • 접속할 컴퓨터가 22번 포트가 열려있어야 함 (AWS EC2는 이미 22번이 열려있음)
    • 맥은 SSH가 있어 바로 명령어로 가능하지만 윈도우는 없으므로 git bash 이용
      • ssh -i /c/Users/USER/Desktop/sparta/spartaKeyPair.pem ubuntu@15.164.220.69
      • git bash를 종료할 때는 exit 명령어를 입력하여 ssh 접속을 먼저 끊기
    • 리눅스는 마우스가 없고, 그 역할을 모두 명령어들이 대신 함
      ls: 내 위치의 모든 파일을 보여준다.
      
      pwd: 내 위치(폴더의 경로)를 알려준다.
      
      mkdir: 내 위치 아래에 폴더를 하나 만든다.
      
      cd [갈 곳]: 나를 [갈 곳] 폴더로 이동시킨다.
      
      cd .. : 나를 상위 폴더로 이동시킨다.
      
      cp -r [복사할 것] [붙여넣기 할 것]: 복사 붙여넣기
      
      rm -rf [지울 것]: 지우기
      
      sudo [실행 할 명령어]: 명령어를 관리자 권한으로 실행한다.
      sudo su: 관리가 권한으로 들어간다. (나올때는 exit으로 나옴)
      • shell에서 ubuntu@ 로 시작하면 원격접속 중
      • 리눅스 커널에서 ↑ 누르면 직전에 사용한 명령어 나옴

 

3. 서버 세팅

  • filezilla: 로컬 컴퓨터와 원격 컴퓨터 사이에 파일 업로드, 다운로드 해주는 프로그램
    • filezilla 설정(host는 내 인스턴스 IP)
    • 마우스 드래그&드롭으로 파일 옮기기
    • shell에서 인스턴스의 sparta 디렉토리에서 python3 test.py 명령어 입력시 해당 파일 실행
  • 서버 환경 통일 (EC2 한방에 세팅)
    • sudo chmod 755 initial_ec2.sh
      권한 변경
    • ./initial_ec2.sh
      파일 실행
    • initial_ec2.sh: 업그레이드, DB설치, 명령어 통일 등의 세팅을 위한 코드 모음
      • 예) python3가 python으로 통일됨 -> python app.py 로 실행

 

4. flask 서버 실행

  • 로컬 컴퓨터에서 했던 것처럼 똑같이 원격 컴퓨터에도 flask, pymongo 등의 모듈 설치 필요 -> pip
    • pip install flask
  • 원격 컴퓨터의 sparta 디렉토리에서 python app.py 로 서버 실행, ctrl + c로 서버 종료
  • 크롬에서 http://[내 EC2 IP]:5000/ 접속 -> 오류 발생 -> AWS 설정 필요
  • EC2 서버 (원격 컴퓨터) 포트 설정 외에도, AWS 자체적인 방화벽이 있어 관련 포트 설정 필요
    • 해당 인스턴스 선택 -> 보안 탭에서 보안그룹 링크 클릭 -> 인바운드 규칙 -> 규칙 추가 클릭 -> 포트 추가
      • 80포트: HTTP 접속을 위한 기본포트
      • 5000포트: flask 기본포트
      • 27017포트: 외부에서 mongoDB 접속을 하기위한 포트

 

5. 원페이지 쇼핑몰 업로드

  • robo 3T로 원격 컴퓨터의 mongoDB 접속
  • address는 내 원격컴퓨터 IP 주소, 보안을 위한 이름, 비밀번호 설정
  • 우리의 pymongo에도 이름, 비밀번호 입력
    • # client = MongoClient('localhost', 27017) 대신
      client = MongoClient('mongodb://test:test@localhost', 27017)
      # id: test, pw: test
  • filezilla에서 homework 디렉토리를 원격 컴퓨터에 업로드

 

6. 포트포워딩 (port forwarding)

80포트로 오는 요청을 5000포트로 전달

  • http 요청에서는 80포트가 기본이기 때문에, 굳이 :80을 붙이지 않아도 자동으로 연결 가능
  • 우리 웹페이지는 5000포트에서 실행 중이므로 :5000을 붙여야함 (세팅은 이미 서버환경 통일에서 함)
  • 포트 번호를 입력하지 않아도 자동으로 접속되기 위해, 80포트로 오는 요청을 5000 포트로 전달하게 하는 포트포워딩(port forwarding) 을 사용 (리눅스 기본 제공)

 

7. nohup 설정: 로컬 컴퓨터에서 SSH 접속을 끊어도 원격 서버가 계속 실행되게 해주는 설정

nohup python app.py &

 

# 아래 명령어로 미리 pid 값(프로세스 번호)을 본다
ps -ef | grep 'app.py'

# 아래 명령어로 특정 프로세스를 죽인다
kill -9 [pid값]

서버 강제 종료

 

8. 도메인 연결

  • 도메인을 구매한다는 것은, 네임서버를 운영해주는 업체에, IP와 도메인 매칭 유지비를 내는 것
  • 가비아 페이지 -> my가비아 -> DNS 관리툴 -> 설정 -> 레코드 수정 -> 레코드 추가
    • 호스트: @, 값: 인스턴스 IP 주소 로 설정 후 확인, 저장
  • 네임서버에 도메인-IP 매칭하는데에 시간이 꽤 걸릴수도 있음
  • 이제 http://내도메인/ 으로 접속 가능!

 

9. og 태그

  • static 폴더에 이미지 (800x400 사이즈) 저장
  •     <meta property="og:title" content="원페이지쇼핑몰"/>
        <meta property="og:description" content="수제버거 팝니다"/>
        <meta property="og:image" content="{{ url_for('static', filename='ogimage.jpg') }}"/>
    head 적절한 곳에 메타태그 삽입
  • 서버 종료 후 이미지를 바꾸고 다시 켰다해도 내 웹을 공유한 플랫폼(카카오톡, 페이스북 등)이 시간을 두고 크롤링해가기 때문에 바로바로 업데이트 되지 않는다