카카오클라우드 4탄-25.CDN으로 서비스 웹서버 제공
<0> 사전 준비
<1> 베스천 호스트 설정
<2> 관리형 Mysql 설치
<3> 어플리케이션 서버 설정
<4> 어플리케이션 로드 밸런서 구축
<5> 오브젝트 스토리지 환경 구축하기
<6> 예제 프로젝트 업로드
<7> CDN 설정 및 배포
<8> 참고 사이트
<0> 사전 준비
access-key, secret-key
kr-central-2
<1> 베스천 호스트 생성
1
우분트로 생성
2
보안그룹 허용
10000-10010 = 포워딩용 포트
81 = nginx 관리자 페이지 접속 포트
22 = 로그인 포트
3
베스천 로그인
4
# nginx-proxy-manage 설치
sudo curl -o /tmp/init-bastion.sh https://raw.githubusercontent.com/kakaoenterprise/kc-handson-config/vm-3tier/init-bastion.sh
bash /tmp/init-bastion.sh
(10분)
5
http://${BASTION_PUBLIC_IP}:81/login
# 아이디 : admin@example.com
# 비밀번호 : changeme
6
> Streams
10000번 포트 접속시 서버1 접속
10001번 포트 접속시 서버2 접속
10002번 포트 접속시 서버3 접속
10003번 포트 접속시 서버4 접속
<2> 관리형 Mysql 설치
콘솔 > Data Store > Mysql
handson-mysql
admin
root1234
단일 1
m2a.large (디폴트)
100
<3> 어플리케이션 서버 설정
디비로 접속하는 애플리케이션 VM서버 2대 만들자
1
handson-app
2대
우분트
20
퍼블릭 서브넷에 생성 - 여기서는 NAT등 구성하지 않고 편하게 테스트하기 위해 퍼블릭 사용.
2
베스천에서 접속 가능하도록 보안그룹 생성.
베스천에서 22 허용
icmp
8080 허용.
3
푸티나 ssh로 app서버접속.
# app-1
ssh -i ${PRIVATE_KEY}.pem ubuntu@${BASTION_PUBLIC_IP} -p 10000
# app-2
ssh -i ${PRIVATE_KEY}.pem ubuntu@${BASTION_PUBLIC_IP} -p 10001
4
예제
git clone https://github.com/kakaoenterprise/kic-library-react
cd kic-library-react
5
패키지 설치
bash install-requirements.sh
(5 걸림)
7
vim app-env.sh
export PROFILE='dev'
export MYSQL_HOST='${MYSQL_PRIMARY_ENDPOINT}'
export DB_USERNAME='admin'
export DB_PASSWORD='root1234'
8
프로젝트 빌드
bash app-build.sh
(5 걸림)
9
실행
bash start-app.sh
접속 종료.
<4> 어플리케이션 로드 밸런서 구축
1
handson-abl1
퍼블릭 서브넷에 생성
리스너 포트 443
2
# 타켓 그룹 만들기
타켓 그룹 프로토콜 http
유형 HTTP
/api/v1.0/management/category/all
3
handson-app-18080
handson-app-28080
<5> 오브젝트 스토리지 환경 구축하기
hands-on
암호화 아니오
권한 > 접근 > 접근설정 > 퍼블릭 액세스 허용 (모든 IP에서 허용된다.)
<6> 예제 프로젝트 업로드
1
cd ~/Downloads
git clone https://github.com/kakaoenterprise/kic-library-react
cd kic-library-react/client
2
# mac(homebrew)
brew install nodejs
# ubuntu 20.04
wget -c https://nodejs.org/dist/v18.13.0/node-v18.13.0-linux-x64.tar.gz && tar xzv -f node-v18.13.0-linux-x64.tar.gz
sudo cp -r ./node-v18.13.0-linux-x64/* /usr
3
환경 변수 설정 - LB 공인 IP로 지정
cd src
vim config.js
# config.js
# const BASE_URL = "https://${APP_LB_PUBLIC_DOMAIN_NAME}"
# ...
4
리액스 빌드
bash ~/Downloads/kic-library-react/client/web-build.sh
5
빌드 결과 확인.
ls ~/Downloads/kic-library-react/client/build
6
빌드된 파일이 저장된 build 폴더를 생성한 Object Storage에 업로드
7
버킷 상세 페이지 > [파일 업로드] > [폴더 추가]를 통해 ${home}/Downloads/kic-library-react/client/build 폴더를 업로드합니다.
8
hands-on 버킷의 build 디렉터리에 파일이 추가되었는지 확인합니다.
# 우분트에서 aws cli 설치
sudo apt install curl unzip
curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip"
unzip awscliv2.zip
sudo ./aws/install
aws --version
aws configure
kr-central-2
aws --endpoint-url=https://objectstorage.kr-central-2.kakaoi.io.kakaoi.io s3 ls
파일 업로드
aws --endpoint-url={endpoint} s3 cp {local_path} s3://{bucket_name}/{upload_path}
파일 다운로드
aws --endpoint-url={endpoint} s3 cp s3://{bucket_name}/{file_path} {local_path
<7> CDN 설정 및 배포
1
CDN에 접속하여 [서비스 만들기]
오리진
hands-on-cdn
호스트 서버 KC CDN
오리진 서버 KC Object Storage
버킷 hands-on
https
443
/build
Gzip 사용.
루트 경로 설정
/index.html
2
브라우저에서 생성된 CDN의 서비스 도메인에 접속합니다
3
확인합니다
<8> 참고 사이트
https://docs.kakaocloud.com/tutorial/fundamentals/cdn-web-server-offloading
몰아보기
https://brunch.co.kr/@topasvga/3651
감사합니다.
