2월, 2020의 게시물 표시

AWS EC2 + ELB + Auto scaling + Nuxt 환경에서 수동으로 Auto scaling 인스턴스 추가 시 load chunk failed 에러

0. 환경 - AWS EC2 + ELB + auto scaling 그룹은 이미 설정되어 있음 - Nuxt.js 수동으로 auto(?) scaling 인스턴스를 추가해야 했다. auto scaling 인스턴스를 추가하면 자동으로 git에서 소스를 가져와 빌드하고 pm2로 프로세스를 시작하도록 했다. 아래는 인스턴스 시작 시 실행하는 명령어이다. auto scaling 시작 구성의 사용자 데이터 부분에 추가하면 된다. #!/bin/bash sudo -u 사용자 -i git -C 소스경로 --git-dir=소스경로/.git pull sudo -u 사용자 -i npm run build --prefix 소스경로 sudo -u 사용자 -i pm2 start npm --name "이름" -- start --prefix 소스경로 1. 인스턴스 추가 1) EC2 콘솔 > Auto Scaling > Auto Scaling 그룹 메뉴에서 원하는 그룹 우클릭해서 편집 창을 연다. 2) 목표 용량과 최소용량을 최대용량 범위 안에서 원하는 만큼 늘린다. 3) 인스턴스 메뉴에서 확인해보면 자동으로 늘어나있다. 2. git 설정   인스턴스를 처음 추가하면 git 사용자 정보를 설정해줘야 한다. 사용자 정보 설정 후 다시 pull한다. git config --global user.email = 내 이메일 git config --global user.name = 내 이름 3. 프로세스 시작   아래 명령어로 빌드 후 프로세스를 재시작한다. 시작하고 약 1 ~ 2분 정도는 502 에러가 발생할 수 있다. npm run build pm2 stop 이름 pm2 start 이름 4. 오류 발생 시   계속 새로고침해서 load chunk failed가 나오는지 체크한다. 이 오류는 대부분 인스턴스 간 코드가 일치하지 않아서 발생한다. 1) 인스턴스 간 코드가 일치하는지 체크한다. 2) static 파일들이

SSL 인증서 적용 방법

0. 환경 - 인증서는 Sectigo(구 COMODO)에서 발급 - AWS EC2 사용 - ELB는 쓰는 서버와 안쓰는 서버가 있다. - 웹서버는 Nginx 1. 도메인 소유자 인증 - HTML 인증    https://www.comodossl.co.kr/products/comodo-ssl-dcv.aspx  이 페이지에서 시키는 대로 하면 1 ~2시간 후에 인증서 메일이 온다. /.well-known이 설정되어 있지 않다면 nginx 설정에 아래 코드를 추가한다. 설정은 ubuntu 기준 /etc/nginx/sites-available/[FILENAME]에 있다. server { ...   location /.well-known {     alias [경로]   } ... } 2. 인증서 설치 - ELB 사용 안하는 서버 1) 한 서버에 한 도메인    https://www.comodossl.co.kr/certificate/ssl-installation-guides/Nginx.aspx  이 페이지에서 시키는 대로 하면 된다. 인증서 내용을 합친 후에 nginx 설정에 지정한 파일 외에는 삭제해도 되는 것 같다. 2) 한 서버에 여러 도메인(미완)   정확한 원인은 모르겠지만 체인인증서를 적용하면(인증서를 합치면) nginx를 재시작할 때 오류가 발생한다. 일단 인증서를 합치지 않고 서버 인증서(사이트이름.crt)와 인증서 개인키(사이트이름_SHA256WITHRSA.key)만 nginx에서 설정한 경로에 업로드하면 된다. 이런 식으로 인증서를 적용하면 "안전하지 않음"으로 나온다. => 인증서 문제가 아니라 nginx 설정의 ssl_protocols가 구버전TLS를 지원해서 그런 것 같다. TLS1.2 이상만 지원하도록 변경하면 정상적으로 나온다. 3. 인증서 설치 - ELB 사용 1) 한 서버에 한 도메인    https://www.comodossl.co.kr/support/f

React native webview에서 오디오 재생(부분해결)

1. 환경 - React native 0.55 WebView 컴포넌트에 오디오 재생(Audio.play())을 포함한 html 소스를 사용시 "cannot find variable Audio" 오류가 발생했다. 사용하는 소스는 DB에 저장되어 있고 PC 웹에서도 사용하므로 이 소스를 변경할 수는 없다. 2. 해결 1) react-native-audio-toolkit 설치    https://github.com/react-native-community/react-native-audio-toolkit/blob/master/docs/SETUP.md 를 참조해서 패키지를 설치한다. react-native link로 링크 시 app/build.gradle의 dependencies에는 제대로 들어가지 않아서 이부분만 직접 입력했다. 문서에는 수동 링크 부분에 패키지 이름이 react-native-community _ audio-toolkit 이라고 되어있는데 react-native-community / audio-toolkit 으로 입력해야 한다. dependencies {   ...   implementation project(':@react-native-community/audio-toolkit')   ...  } 2) Audio 대신 Player 사용   클래스 상단에 아래 코드를 추가하면 WebView 내에서도 this.Audio로 사용할 수 있다. export default class 클래스 extends Component {   Audio = Player;   constructor () { ... } 그 다음 html 소스에서 "Audio"를 모두 "this.Audio"로 바꾸면 된다. 소스 = 소스.replace(/Audio/gm, 'this.Audio'); WebView 컴포넌트는 아래처럼 설