i os push: 세상에서 가장 간단한 날씨, 대기환경 엡

46
세세세세 세세 세세세 세세 , 세세세세 세 세세세세세 iOS push 세세세 세세세 <[email protected] >

Upload: hannasungkim

Post on 15-Apr-2017

504 views

Category:

Software


3 download

TRANSCRIPT

Page 1: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

세상에서 가장 간단한 날씨 , 대기환경 엡따라해보는 iOS push 서비스

김성훈 <[email protected]>

Page 2: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

왜 ?• 엡을 열어 보는 것도 귀찮다• 그냥 unlock 하면 한번에 날씨 , 하늘 , 대기 정보 보기• iOS Badge 를 이용

• 2,020: 대기 보통 , 맑음 , ( 영상 ) 20 도 • 3,119: 대기 나쁨 , 구름 , ( 영상 ) 19 도• 4,420: 알겠죠 ?

Page 3: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

첫 디자인• 간단하게 Pull 로 하자

• 백그라운드 타이머로 10 분 간격 Pull: 엡 실행중에는 잘 되나 엡이 백그라운드 모드에 있을때 iOS 가 타이머를 죽임 . 결국 동작 안됨

• iOS 가 밧데리 상태등에따라 알아서 작업을 돌려주는 Background fetch: 이건 내가 언제 fetch 할지 결정할수 없어서 엡데이트 안되는 경우가 많음 . 실패

Page 4: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

남은건 PUSH

• 그런데 매우 복잡해 보임• 무슨 키가 많이 필요하고 • 날씨 정보를 어디로 보내야 하는지 ?

• 기기는 어떻게 등록 ? 전반적으로 복잡

Page 5: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

무작정 따라해보자• 그러나 아래 준비물은 필수

• Mac 컴퓨터와 Xcode - iOS 개발할거니까• iPhone - 시뮬레이션으로는 push 테스트 안됨• $99 내고 가입한 apple developer

membership

Page 6: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

무작정 따라하기전 뭐하는지 5 스텝 대충보고 갑니다 .1. 엡생성 : XCode 로 엡만들고 Push 기능 설정2. 기기번호따기 : XCode 로 엡에 기기 번호받는 부분 추가3. 인증서 : Apple 개발자 웹에 가서 푸쉬서버용 인증서 받음4. 인증서 가공 : Mac 에서 인증서 import/export

5. PUSH: ApnsPHP library 이용해 내 엡에 push 보내기

Page 7: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

1. 엡생성 : Xcode 시작 , Single View 엡 생성

Page 8: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

1. 엡생성 : 이름 정하고 Bundle ID 잘 기억해둡니다 .

Page 9: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

1. 엡생성 : Capabilities 에 가서 Push notifications 를 켭니다 .

Page 10: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

1. 엡생성 : 이때 본인의 개발팀을 물어 봅니다 . 성공하면 아래 체크마크가 나오고 ON 됩니다 .

Page 11: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

1. 엡생성 : 엡이 백그라운드모드에서 push 받고 싶으시죠 ? 그럼 아래와 같이 설정 .

Page 12: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : AppDelegate.swift 열기

Page 13: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : http://www.intertech.com/Blog/push-notifications-tutorial-for-ios-9/ 코드를 클래스 안에 붙여넣습니다 .

private func convertDeviceTokenToString(deviceToken:NSData) -> String { // http://www.intertech.com/Blog/push-notifications-tutorial-for-ios-9/ // Convert binary Device Token to a String (and remove the <,> and white space charaters). var deviceTokenStr = deviceToken.description.stringByReplacingOccurrencesOfString(">", withString: "", range: nil) deviceTokenStr = deviceTokenStr.stringByReplacingOccurrencesOfString("<", withString: "", range: nil) deviceTokenStr = deviceTokenStr.stringByReplacingOccurrencesOfString(" ", withString: "", range: nil) // Our API returns token in all uppercase, regardless how it was originally sent. // To make the two consistent, I am uppercasing the token string here. deviceTokenStr = deviceTokenStr.uppercaseString return deviceTokenStr } func initializeNotificationServices() -> Void { let settings = UIUserNotificationSettings(forTypes: [.Badge], categories: nil) UIApplication.sharedApplication().registerUserNotificationSettings(settings) // This is an asynchronous method to retrieve a Device Token // Callbacks are in AppDelegate.swift // Success = didRegisterForRemoteNotificationsWithDeviceToken // Fail = didFailToRegisterForRemoteNotificationsWithError UIApplication.sharedApplication().registerForRemoteNotifications() } func application(application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: NSData) { let deviceTokenStr = convertDeviceTokenToString(deviceToken) // ...register device token with our Time Entry API server via REST print(deviceTokenStr) } func application(application: UIApplication, didFailToRegisterForRemoteNotificationsWithError error: NSError) { print("Device token for push notifications: FAIL -- ") print(error.description) }

Page 14: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : 이렇게 되겠죠 ?

Page 15: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : AppDelegate.swift application 함수에서

initializeNotificationServices() 를 불러줍니다 .

Page 16: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 완성 : 실행 버턴을 눌러 이제 엡을 실행합니다 . 처음이면 본인의 Apple개발 아이디 설정으로 들어 갑니다 .

Page 17: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 완성 : 실행이 성공하면 아래 print 실행되며 기기 번호가 화면에 출력 됩니다 .

Page 18: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : 한편 실행되는 iphone 에는 팝업이 보입니다 . 뻿지도 Push 로 오기때문에 Notification 받기로 합니다 .

Page 19: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : 혹 시뮬레이터로 실행 ? 그럼 이런 에러가 나옵니다 . 아이폰을 꼽고 엡을 실행합니다 .

Device token for push notifications: FAIL -- Error Domain=NSCocoaErrorDomain Code=3010 "REMOTE_NOTIFICATION_SIMULATOR_NOT_SUPPORTED_NSERROR_DESCRIPTION" UserInfo={NSLocalizedDescription=REMOTE_NOTIFICATION_SIMULATOR_NOT_SUPPORTED_NSERROR_DESCRIPTION}

Page 20: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

2. 기기번호 따기 : 아이폰을 꼽고 엡을 실행 .아래와 같이 이쁜 기기 번호가 보입니다 .안 보이면 앞 단계를 다시 점검

이 기기 번호를 이용해서 push 합니다 .

Page 21: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

1, 2 단계끝 ! 수고 하셨습니다 .1. 엡생성 : XCode 로 엡만들고 Push 기능 설정2. 기기번호따기 : XCode 로 엡에 기기 번호받는 부분 추가3. 인증서 : Apple 개발자 웹에 가서 푸쉬서버용 인증서 받음4. 인증서 가공 : Mac 에서 인증서 import/export

5. PUSH: ApnsPHP library 이용해 내 엡에 push 보내기

Page 22: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : PUSH 를 보내기 위해서는 Apple서버를 거치기 때문에 이 서버에 접속하여 본인의 엡으로 push 를 보내기 위한 인증서가 필요합니다 .

우선 apple 개발자 사이트에 접속후 멤버 센터로 갑니다 .https://developer.apple.com/

Page 23: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 우리의 관심은 인증서 , 클릭합니다 .

Page 24: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 왼쪽 메뉴에서 App IDs 를 선택하면 오른쪽에 우리가 XCode 에서 만든 App ID 가 보입니다 . 이를 선택합니다 .

Page 25: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : Application Service 항목이 보이는데 우리의 관심은 Push. 이것이 주황색으로 나와야 합니다 . 아님 Xcode 엡 설정에서 Push 서비스를 “ On” 설정 . 그런 다음 Edit 을 선택합니다 .

Page 26: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : Push Notifications 항목으로 들어가면 개발용과 production 모드로 나뉘어지는데 개발모드 선택 ( 추후 서비스 할때 Production 선택 )

Page 27: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 그럼 CSR 이라는 파일을 만들라는 화면이 자세한 설명과 함께 나옵니다 .

Page 28: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : CSR 을 받기 위해 mac 컴푸터에서 Keychain Access 를 실행합니다 . 왼쪽 메뉴에서 My Certificate 를 선택 . 오른쪽에 본인의 iPhone 개발 certificate 와 열림 ( 화살표 ) 버턴을 누르면 본인의

private 키를 볼수 있습니다 .

Page 29: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 본인의 private 키를 선택하고 오른쪽 마우스 메뉴를 선택하거나 , Keychain Access/Certificate Assistant/Request … 를 선택합니다 .

Page 30: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 이메일과 이름이 본인의 개발자 private 키의 것과 반드시 일치하는 것을 확인합니다 . Save to disk 를 선택하고 Continue 를 선택하여 파일을 다운 받아 둡니다 .

Page 31: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 다시 에플 개발자 웹페이지로 돌아 옵니다 . 계속을 누르고 방금 만들어준 CSR 을 업로드 합니다 .

Page 32: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

3. 인증서받기 : 그럼 아래와 같이 certificate가 만들어 졌다는 메시지를 볼수 있습니다 . 이를 다운 받습니다 .

Page 33: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

4. 인증서 가공 : 인증서 받기는 끝났습니다 . 받은 인증서를 필요한 파일로 가공하겠습니다 . 다운 받은 파일을 더블 클릭하면 자동으로 Keychain Access에 import 됩니다 .

Page 34: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

4. 인증서 가공 : import된 certificate 가 My Certificate 에 나타나야 하고 화살표를 누르면 private 키가 같이 포함되어야 합니다 . 그렇지 않으면 이전 CSR 만들때 이름 / 이메일이 맞는지 다시 확인후 apple 개발 사이트에서

certificate 재발급합니다 .

Page 35: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

4. 인증서 가공 : 이 certificate 를 PEM 파일 형식으로 변환하여야 PUSH 서버에 사용가능하여 변환 작업을 합니다 . 우선 Certificate 와 PrivateKey *둘다 * 를 선택한다음 p12 파일로 export 합니다 .

Page 36: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

4. 인증서 가공 : 이 p12 파일에는 private key 가 포함되어 있기때문에 이를 보호하기 위해 비번을 설정합니다 . 이 비빌번호는 다음과정에서 PEM 으로 변환할때 물어 봅니다 .

Page 37: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

4. 인증서 가공 : 이제 shell 로 이동하여 openssl 명령으로 저장된 p12 파일을 변환 합니다 . 이 인증서로 push 를 보낼수 있습니다 .

openssl pkcs12 -in your.p12 -out your.pem -nodes -clcerts

Page 38: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

마지막 단계만 남았습니다 !1. 엡생성 : XCode 로 엡만들고 Push 기능 설정2. 기기번호따기 : XCode 로 엡에 기기 번호받는 부분 추가3. 인증서 : Apple 개발자 웹에 가서 푸쉬서버용 인증서 받음4. 인증서 가공 : Mac 에서 인증서 import/export

5. PUSH: ApnsPHP library 이용해 내 엡에 push 보내기

Page 39: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: 이 PEM 키를 이용하여 AWS SNS (월 1 백만 push 무료 ) 나 다른 서비스들을 이용할수 있습니다 .

Page 40: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: 그러나 여기서는 간단한 PHP library 를 이용합니다 . (Python, Node.js등의 다른 library 들이 많습니다 .)

Page 41: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: clone 한다음 sample_push.php 의 설정 부분을 봅니다 . 첫번째는 p12 를 변환한 pem 파일이고 세번째는 엡을 실행하면 나오는 기기 아이디입니다 .

Page 42: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: 두번째는 여기서 다운받아 파일명만 고치면 됩니다 .

https://www.entrust.net/downloads/binary/entrust_2048_ca.cer

Page 43: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: 그럼 각각의 pem 파일관련 설정을 수정하고 , xcode 엡 실행후 기기 번호를 입력한후 php 를 실행해봅니다 . php 결과에 에러가 없으면 성공 !

내 전화기에 push 메시지와 뺏지에 숫자 3 이 보이면 성공 !

Page 44: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: 이제 PHP 를 수정하여 숫자 3대신 날씨등의 정보를 보내 줍니다 .

https://developer.forecast.io/docs/v2

날씨는 Dark Sky API 등을 사용합니다 . ( 매일 1,000 건이 무료 )

Page 45: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

5. PUSH: 마지막으로 이 프로그램을 crontab 에 넣어 줍니다 .

“crontab -e”

날씨는 매시간별 , 대기 상태는 매시간 30 에 업데이트 되므로 전 매 30 분마다 push 를 보냅니다 .

Page 46: I os push:  세상에서 가장 간단한  날씨, 대기환경 엡

축하드립니다 !• 더 해보면 좋은것들

• 설치되거나 엡이 실행되면 기기 번호를 자동 등록 -http post 등 사용

• AWS SNS 등 사용해보기• 실제 중요한 데이타 보내 보기

• Badge 를 이용한 다른 재미있는 엡 만들어 보기