Heroku for node.js with MySQL

broccoli·2021년 4월 19일
1

deployment

목록 보기
1/3
post-thumbnail
post-custom-banner

Heroku는 사용자(주로개발자)에게 application을 위한 cloud platform을 제공해준다. 그래서 application을 쉽게 배포하고 관리할 수 있게 해줌.

개인적으로 heroku를 사용하는 가장 궁극의 목적은 무료로 플랫폼을 제공해주고 배포만하면 도메인https까지 한번에 사용가능해서 테스트용으로 사용하기에 적당하다고 판단해서이다.
후기로써 적자면...솔직히 처음 시도하는 입장에서 도전이 그리 쉬운편은 아니었지만 구글링을 통해 많은 레퍼런스를 찾을 수 있으므로 한번 성공해보면 재미있을 수 있음.

현재 heroku 배포 테스트 개발환경 🤹🤹

로컬개발환경

  • engine: node.js @14.15.1
  • mysql : 8.0.23
  • redis: 3.1.1
  • connect-redis: 5.1.0

프론트는 간단히 pug를 사용함.

🏅 목적

passport를 이용한 sns 로그인들을 테스트해보기 위해서. 페이스북 같은 경우 Oauth용 앱을 라이브로 사용하기 위해서는 https를 요구해서 겸사겸사 heroku 배포도 한번도전함.

tutorial

전부 완료한 후 찾게 된 것이긴 하지만(뒷북..) node.js로 Heroku를 사용하는 방법을 자세히 설명한 문서가 있다. 구글링을 통해 찾지 못한 문제는 이곳에서 한번 찾아보는것도 좋을 것 같다.

Install

우분투 설치 위주로 진행할 예정이다 다른 환경에서의 다운로드 및 인스톨 방법은 링크참조하자.

우분투 16+ 버전에서는 아래 명령어로 설치가능하다.

sudo snap install --classic heroku

heroku

설치가 완료되면 저렇게 heroku 명령어가 사용가능하다. 명령어 메뉴얼은 -h옵션으로 확인 가능하다.

Login

이후 아래와 같이 터미널에 로그인 명령어를 친다

heroku login

웹페이지가 뜨고 로그인을 진행하면 터미널에 본인의 메일로 로그인이 된 것을 확인할 수있다.

create a heroku app

깃을 생성했다면 아래와 같이 앱이름으로 heroku app을 생성해주면 된다.

heroku create 앱이름

이렇게 앱을 생성하면 자동으로 heroku의 remote가 heroku로 생성이 됨을 아래명령어로 확인 가능하다.

git remote -v

deploy(배포)

일단 heroku app을 배포하는데 있어 모든 준비를 마친 소스패키지의 경우엔 바로 아래 명령어를 치면 된다.

git push heroku master

그럼 배포가 종료되고 터미널에 앱의 url로 접속하면 끝이다.

하지만 본인은 많은 시행착오가 있었.....🚣‍🚣‍♀️

Trouble-Shooting

내가 겪은 경우도 있고 검색했을때 나온것들도 추가로 작성함.

1. engine 버전 고정

✅ node 엔진 고정하기

//package.json
{
  "name": "패키지명",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  ...
  "engines": {
    "node": ">=10.0.0",
    "npm": ">=6.0.0"
  }
}

engine 고정 같은 경우는 heroku배포시 미리 설정해 놓아서 내 경우에 해당하진 않았지만 검색해보니 설정을 fix안 한경우 문제가 발생하는 경우도 있다고 해서 참고로 적음.

2. pm2 사용시

preinstallpm2global 미리 설치하기

//package.json
{
  "name": "패키지명",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "nodemon app.js",
    "preinstall": "npm install pm2 -g",
    "start": "NODE_ENV=production pm2-runtime app.js -i 0"
  },
  ...
  "engines": {
    "node": ">=10.0.0",
    "npm": ">=6.0.0"
  }
}

pm2로 인한 배포 문제는 생각해보지 못했었다. pm2로 인한 배포 실패시 개인적으로heroku가 알려준 에러메세지를 이해하지 못했다.

단지 로컬로 production으로 실행했을 때 nodemon의 경우는 문제가 없었기에 pm2로 인한 문제란걸 깨닫고 알아차렸다.

하지만 생각해보면 간단하다. 너무 로컬에서 테스트를 쉽게 했기에 잊고 있었는데 pm2를 로컬에서 실행할 때는 global로 설치해서 사용하거나 npx 붙여서 쓰거나 scripts로 사용했었는데...

그래서 package.jsonpreinstall을 추가하고 start에는 pm2가 아닌 pm2-runtime으로 실행했다.

ℹ️ pm2-runtimedocker container사용시에 고안된 명령어인데 도커를 사용하지 않아도 동작하는데 문제는 없었다. pm2도 사용하는데 문제는 없을것이라 생각한다.

3. heroku에 local environment 설정 올리기

heroku에 로그인한 상태에서 아래명령어를 통해 .env 설정 올린다.

// heroku env설정 올리는 플러그인 설치
heroku plugins:install heroku-config

// .env 설정 올리기
heroku config:push

// .env 설정 올린것 확인하기
heroku config

.env 파일은 절대 git에 올릴 수 없는 파일이기 때문에 설정내용을 등록해둬야한다.
그래야 process.env.xx 등의 변수를 읽을 수 있기 때문이다.

heroku뿐만아니라 netlifygenkins를 통한 배포에도 같은 과정은 필요하다. heroku config 정보는 본인 heroku 사이트를 통해서도 확인가능하다.

대시보드 > 본인 앱 > settings > Config Vars > CLEARDB_DATABASE_URL

4. heroku 실제 터미널에 접근해서 빌드해보기

heroku의 빌드실패시 직접 터미널에 접근해서 nodemon으로 운영빌드를 진행해서 원인을 파악해보자.

heroku run bash

개인적으로 heroku는 처음 사용해봤던 도구이기 때문에 빌드실패시 내가 설정을 잘못해서 난 에러인지 아니면 다른문제가 있던 것인지 파악하기 어려웠고 에러메세지도 그리 친절하지 않았다. 그래서 직접 터미널로 접근해서 원인을 발견해서 고치곤 했음. 이때는 pm2를 사용하지 않았고 nodemon을 통해서 바로 메세지를 확인해서 진행했다.

5. port는 직접하드코딩으로 지정하지 않기

heroku는 배포시 url을 https로 설정해주고 port는 443으로 해준다.

app.listen(process.env.PORT, () => {
  console.log(`server on ${process.env.PORT}`)
})

따라서 process.env.PORT라는 변수를 이용해 .env파일에 따로 작성해 포트번호를 사용하자. 개인적으로 로컬테스트시 3065라는 포트를 사용해서 나의 process.env.PORT는 3065였지만 heroku가 실행시 포트를 443으로 바꿔주기 때문에 따로 scripts에 포트를 443으로 해줄 필요는 없다.

예) 따로 포트지정없이 아래와 같은 운영배포 스크립트를 사용함

"start": "NODE_ENV=production pm2-runtime app.js -i 0"

6. mysql사용시 ClearDB MySQL 설정하기

✅ 로컬시 mysql을 pc에 설치했던 것처럼 운영기를 위한 DB를 설치할 필요가 있다.

6-1. clearDB 설치

✅ 설치하기

//clearDB 설치하기
heroku addons:create cleardb:ignite

addon 설치는 위와같이 터미널로도 가능하고 사이트를 통하 GUI로도 가능하다.

clear DB를 설치하기 위해서는 신용카드 등록이 필요하다. 터미널이나 사이트상에 해당 경로를 알려주니 그쪽에서 카드등록을 마친다.

무료버전을 사용하니 과금은 걱정안해도 될 것 같다.

6-2. MySQL connection 설정하기

✅ 6-2-1. connection 정보확인하기(포트번호는 그대로 3306이다.)

heroku config | grep CLEARDB_DATABASE_URL

DB CONNECTION 정보는 heroku config에 등록되어 아래에 처럼 확인가능하다. 물론 heroku 사이트의 내 앱 설정에서도 확인가능하다.

위에 명령어를 치면 DATABASE_URL이 나오는데 아래와 같이 확인가능하다.

mysql://USER:PASSWORD@HOST/DATABASE?reconnect=true

✅ 6-2-2. 운영 db connection 정보 .env에 추가하기

//.env
process.env.DB_PROD_USER=USER
process.env.DB_PROD_PASSWORD=PASSWORD
process.env.DB_PROD_HOST=HOST
process.env.DB_PROD_DATABASE=DATABASE

.env 파일에 운영환경을 위한 값을 위와 같이 넣어주고

// .env 설정 올리기
heroku config:push

// .env 설정 올린것 확인하기
heroku config

heroku 설정을 다시 push 해준다.

✅ 6-2-3. 연결이 잘 되는지는 workbench나 터미널을 통해 확인해본다.

mysql --user=USER --host=HOST --password=PASSWORD

7. session 옵션에 proxy=true 설정

히로쿠문서에 대해 잘 읽어보지 않아서 원인은 잘 모르겠지만
secure: true를 설정했을 때 쿠키를 읽지 못하는 경우가 있다. 이때는 secure: trueproxy: true를 같이 적용하면 될것이다.

{secret: process.env.SECRET,
 resave: false,
 saveUninitialized: true,
 proxy: true,
 cookie: {
   secure: true,
   httpOnly: true
 },

참고링크

ℹ️ https://bezkoder.com/deploy-node-js-app-heroku-cleardb-mysql/
ℹ️ https://velog.io/@anrun/Heroku-MySQL-Heroku-ClearDB-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0
ℹ️ https://devcenter.heroku.com/articles/troubleshooting-node-deploys

profile
🌃브로콜리한 개발자🌟
post-custom-banner

0개의 댓글