'Push' 태그의 글 목록

Push

Flutter - Firebase Cloud Messaging 연동 - 2. Firebase 에 APNs Key 등록하기

<난장> 2020. 5. 14. 13:05

2020. 5. 14. 13:05

Firebase는 구글에서 만든건 아니고 2014년에 인수한 모바일 및 웹 애플리케이션 개발 플랫폼이다.

Google Console을 통해서 작업했던 것들이 대부분 Firebase로 옮겨진 것 같다.

이번에 해보려는 것은 앞에서 작성한

2020/05/14 - [난장 Dev/Flutter] - Flutter - Firebase Cloud Messaging 연동 - 2. Firebase 에 APNs Key 등록하기

에서 생성된 키를 Push 서비스 사용을 위해 Firebase에 등록하는 단계를 진행해보고자 한다.

먼저 Firebase 사이트에 들어가보자

https://console.firebase.google.com/

로그인 - Google 계정

하나의 계정으로 모든 Google 서비스를 Google 계정으로 로그인

accounts.google.com

일단 로그인 하는 것은 알아서 할 수 있을터이니...

플레이 스토어에 올릴 생각이라면 같은 개발 계정을 하는 것이 좋지 않을까?

어쨌든 개발자로 로그인

기존 프로젝트는 무시하고 새로 만들어서 올려야 하니 "프로젝트 추가"를 누른다.

이름은 사용할 이름으로 하고, 이번 FCM 연동을 위한 테스트 이므로 Flutter Test라고 입력하고 진행해보겠다.

단계별로 진행하고 "계속"이 나오도록 구글 뜻대로 진행하면 된다.

애널리틱스 구성부분인데, 이게 은근히 편리하다. 어차피 만들어야 하니 새로 프로젝트명과 동일하게 해서 만들어 본다.

동일한 이름이 아니여도 크게 상관은 없다.

위치도 선택하고, 아래 약관 3개 모두 체크해야 "프로젝트 만들기"가 활성화된다.

어차피 넘어가기 위해선 모두 체크해야 하니 어쩔수 없다...

완료 중인게 뜨고

완료가 뜨면 앞으로 사용할 프로젝트가 생성되었다.

프로젝트로 들어오면 "앱"을 추가해야 한다. 특별히 모든 단계를 할 필요는 없고, 가벼운 마음으로 iOS를 선택한다.

iOS 번들 ID는 중요하다. 보통 패키지라고 불리는데 모든 앱마다 고유한 패키지 정보를 가지고 있다. iOS와 안드로이드 모두 동일한 패키지를 사용하는게 좋을듯.

앱 닉네임까지 등록하고 "앱 등록"을 누른다.

앱이 등록되면 다음 단계를 진행할 필요가 없다.

왼쪽 상단에 보이는 "X"를 누르고 끈다.

iOS앱이 추가 된 것이 보이면, 이제 안드로이드를 추가해보도록 하자.

"앱 추가"를 누르고 안드로이드를 선택한다.

iOS에서 사용한 것과 동일한 패키지 이름을 작성했다. 달라도 상관없는데, Flutter에서 프로젝트를 생성하면 모두 동일하게 생성되니 그걸 염두해두고 동일하게 생성하는걸 다시 한번 추천한다.

역시나 앱 닉네임까지만 입력하고 "앱 등록"을 누른다.

나머진 진행하지 않아도 됨으로 왼쪽 상단에 보이는 "X"버튼을 눌러 종료한다.

이제 iOS와 안드로이드가 추가된 것을 보게 된다면 기본 설정은 끝이다.

이젠 전 단계에서 발급받은 키를 등록할 차례. iOS를 클릭하고 팝업 오른쪽에 보이는 기어 모양을 눌러 설정페이지로 들어간다.

지금 바로 사용할 것은 Setting의 "클라우드 메시징" 부분이므로 바로 클릭한다.

보이는 서버키는 Firebase 접속을 위해 꼭 필요한 정보이며, 외부에 공개되면 앱 전체에도 메시지를 보낼 수 있으므로 보안에 신경쓰도록 한다.

일단 APN 인증 키 부분에 p8 파일과 키 ID, 팀 ID등을 입력해야 iOS환경이 마무리 된다.

APN 인증 키에 보이는 "업로드" 버튼을 클릭하면 다음과 같이 뜬다.

키를 생성하면서 다운받은 p8 파일을 등록하고 키 ID와 팀 ID를 입력, 그리고 "업로드"를 누른다.

이렇게 등록되어진다면, Firebase 세팅은 모두 완료 되었다.

그리고 상단에 보이는 탭을 "일반"으로 들어가면 하단에 내 앱에서 안드로이드와 iOS를 각각 클릭해서 구성 파일을 다운로드 받아 놓도록 한다.

추후 추가되어야 하니, 꼭 받아 놓도록 한다.

여기까지가 Firebase Cloud Messaging 을 사용하기 위한 설정을 마무리 했다.

저작자표시 비영리 변경금지 (새창열림)

Flutter - Firebase Cloud Messaging 연동 - 1. iOS Push 사용을 위한 Keys 만들기

<난장> 2020. 5. 13. 23:10

2020. 5. 13. 23:10

Firebase에서 안드로이드 환경은 손쉽게 구성이 가능하다.

iOS도 예전과는 다르게 Keys라는 것으로 대체된 듯싶은데, 이게 참 편리한 것 같다.

처음에 iOS시작할 때는 앱마다 따로 Push 권한을 주고 푸시 서비스를 위한 인증서를 구성했는데, Keys에서 인증서와 팀 ID, 키 ID로 팀 ID로 개발된 앱은 모두 한 개의 key로 푸시 서비스(APNs)를 이용할 수 있다(제대로 이해한 건지 싶지만... 해보니 그런 것 같더라..).

3rd에서 직접 푸시 서버를 구성해서 사용하는 것도 방법이지만, Google의 Firebase Cloud Messaging(이하 FCM)을 이용하면 안드로이드와 iOS를 따로 구현할 필요 없이 FCM에 메시지를 보내면 푸시 서비스를 사용할 수 있다.

간단하게

https://fcm.googleapis.com/fcm/send

로 header 에 Authorization 키와 body에 아래 형식에 맞게 보내면 "notification" 부분과 "data"가 디바이스로 넘어간다.

※ data는 사용자 임의로 입력해서 보낼 수 있음

{
  "priority":"HIGH",
  "notification":{
  	"title":"알림 타이틀",
  	"body":"내용"
  },
  "data":{
	"title":"데이터 타이틀",
	"message":"데이터 값 또는 메시지"
  },
  "to":"디바이스 토큰"
}

자세한 내용은 4번째 푸시 테스트에서 남겨보도록 하겠다.

어쨌든 위와 같이 사용하기 위해서 Apple Developer Account내에서 key를 발급받아야 하는데, 일단 발급하려면 Apple Developer Program이 가입되어야 한다.

안드로이드는 한번 결재 해놓으면 평생 사용할 수 있지만, 애플은 1년마다 129,000원을 납부해야 개발하고 앱스토어에 올릴 수 있는 권한(?)을 준다.

욕 나오지만, 어쩔 수 없다.

먼저 개발자 사이트로 로그인한다.

1. 개발자 사이트 로그인: https://developer.apple.com/account/

로그인 - Apple

idmsa.apple.com

2. 로그인되어 있다면 바로 아래의 화면처럼 보이게 된다.

3. 여기서 왼쪽 메뉴 중 4번째에 보이는 "Certificates, IDs & Profiles"를 클릭하고, 이동된 페이지에서 "Keys" 메뉴를 선택한다.

4. "Keys" 옆에 있는 + 버튼을 클릭하면 아래와 같이 보인다. 참고로 사전에 만들어 놓은 키가 있어서 MapKit JS, MusicKit, Sign in with Apple 등이 비활성화되어 있다. 적당한 이름을 입력하고 "Apple Push Notifications service(APNs)"를 체크하고 "Continue"를 누른다.