기록 시작

@capgo/capacitor-notifications Capgo의 첫 번째 파티 플러그인으로, native iOS 및 Android 푸시 알림을 위한 Capgo의 대시보드, 공개 API, 분석 엔진 장치 등록, 캠페인 통계, 배지 업데이트 및 靜默 라이브 업데이트 확인을 위한 것입니다.

요구 사항

• A Capacitor 앱이 이미 Capgo에 등록되어 있습니다.
• Capgo 앱의 알림 탭에 접근합니다.
• Capgo API 키가 백엔드 증명 인쇄와 API 전송을 위해 쓰기 권한이 있습니다.
• 앱의 iOS 및/또는 Android 플랫폼 푸시 권한입니다.
• @capgo/capacitor-updater silent 푸시 업데이트 체크를 원한다면.

1. Capgo 플랫폼 인증서를 구성합니다.

Capgo에서 앱을 열고, 알림.

각 플랫폼을 지원하려면 플랫폼별로 하나씩 인증 정보를 추가하세요.

• Android Android입니다. - 앱 패키지 ID와 Android 푸시 프로젝트 메타데이터가 필요합니다.
• iOS - 애플리케이션 ID, 팀 ID, 키 ID 및 iOS 푸시 키 메타데이터와 일치하는 iOS 푸시 키 메타데이터.

Capgo은 API 워커 내에 존재해야 하는 정확한 환경 비밀 이름을 보여줍니다. 플랫폼이 구성된 것으로 표시되기 전에 플랫폼이 저장하는 메타데이터와 기대되는 비밀 참조입니다. 워커 환경 내의 실제 자격 증명은 유지됩니다.

2. 설치

가장 빠른 설정을 위해 앱 프로젝트에서 Capgo CLI을 실행하세요:

npx @capgo/cli@latest notifications setup com.example.app

명령어는 알림 패키지를 설치하고 Capacitor 플러그인 설정을 저장하고 작은 헬퍼 파일을 생성하고 Capacitor sync를 실행합니다. 새로운 앱에 대해 이 경로를 사용하거나 파일을 수동으로 연결해야 하는 경우를 제외하고는 이 경로를 사용하세요.

수동 설치:

bun add @capgo/capacitor-notifications @capgo/capacitor-updater
bunx cap sync

만약 Capgo silent 업데이트 확인이 사용되지 않는다면 생략할 수 있습니다. @capgo/capacitor-updater.

3. 플러그인 설정

앱이 시작될 때 플러그인을 한 번만 설정합니다.

import { CapgoNotifications } from '@capgo/capacitor-notifications'

await CapgoNotifications.configure({
  appId: 'com.example.app',
  autoUpdater: true,
  updateInstallMode: 'next',
})

Use updateInstallMode: 'next' __CAPGO_KEEP_0__를 즉시 설치하고 싶을 때만 사용합니다. 업데이터가 안전하게 업데이트를 설치할 수 있는 즉시. updateInstallMode: 'set' 업데이트를 설치할 수 있는 가장 빠른 시점에 업데이트를 설치하도록 Capgo를 설정할 때만.

제목 "4. 신분증명 생성"

애플리케이션에 Capgo API 키를 넣지 마십시오. 백엔드에서는 Capgo에서 키를 요청해야 합니다. identityProof Configure the plugin once when your app starts.

curl -X POST 'https://api.capgo.app/notifications/recipients/proof' \
  -H 'Content-Type: application/json' \
  -H 'x-api-key: CAPGO_API_KEY' \
  -d '{
    "appId": "com.example.app",
    "externalId": "customer-user-123"
  }'

리턴 identityProof 자신의 세션 응답과 함께 앱으로 돌아갑니다.

5. 장치 등록

고객 사용자가 로그인 한 것을 알 때까지 등록만 합니다.

const registration = await CapgoNotifications.register({
  externalId: 'customer-user-123',
  identityProof,
  tags: ['paid', 'beta'],
  attributes: {
    plan: 'team',
    locale: 'en-US',
  },
  consent: true,
})

console.log(registration.recipientKey, registration.deviceKey)

콜 register 다시 할 때:

• 앱이 시작될 때
• 네이티브 푸시 토큰이 변경될 때
• 로그인한 사용자가 변경되었습니다.
• 태그, 속성 또는 동의가 변경되었습니다.
• 앱이 오랜 시간 등록을 갱신하지 않았습니다.

6. 이벤트 리스너 추가

앱이 시작될 때 리스너를 등록하여 JavaScript에서 전면, 열려있는, 배경 이벤트를 표시하십시오.

await CapgoNotifications.addListener('registrationChanged', () => {
  void CapgoNotifications.register({
    externalId: currentUser.id,
    identityProof: currentUser.capgoNotificationProof,
    tags: currentUser.notificationTags,
    consent: currentUser.pushConsent,
  })
})

await CapgoNotifications.addListener('notificationReceived', (notification) => {
  console.log('Notification received', notification)
})

await CapgoNotifications.addListener('notificationOpened', (event) => {
  console.log('Notification opened', event.notification.id)
})

await CapgoNotifications.addListener('backgroundNotification', async (event) => {
  try {
    console.log('Background notification', event.notification.data)
  } finally {
    await event.finish()
  }
})

Always call finish() 7. iOS 설정

7. iOS 설정

__CAPGO_KEEP_0__

• 푸시 알림
• 배경 모드 > 원격 알림

원격 알림을 전달하기 위해 ios/App/App/AppDelegate.swift:

func application(_ application: UIApplication, didReceiveRemoteNotification userInfo: [AnyHashable: Any], fetchCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void) {
    NotificationCenter.default.post(name: Notification.Name("CapgoNotificationsRemoteNotification"), object: userInfo)
    completionHandler(.newData)
}

그런 다음 실행:

bunx cap sync ios

실제 iOS 장치에서 배경 알림 테스트를 하십시오. 시뮬레이터는 UI 작업에 유용하지만 실제 배경 푸시 동작을 나타내지 않습니다.

8. 안드로이드 설정

실행:

bunx cap sync android

그 다음 확인하세요:

• Capgo에서 Android 플랫폼 인증 정보가 구성되어 있습니다.
• 앱 패키지 ID는 플랫폼 푸시 설정에 사용된 패키지 ID와 일치합니다.
• Android 13 이상의通知 권한을 요청하기 전에 표시되는通知를 기대하지 마십시오.
• 앱은 브랜드와 일치하는通知 아이콘과 채널 전략을 가지고 있습니다.
• Google Play 서비스가 있는 실제 장치 또는 에뮬레이터에서 테스트합니다.

앱이 시작할 때 기본 Android 채널을 생성하세요:

await CapgoNotifications.configure({ appId: 'com.example.app' })

await CapgoNotifications.register({
  externalId: currentUser.id,
  identityProof: currentUser.capgoNotificationProof,
  consent: true,
})

플러그인은 Android 푸시 메시징 서비스를 선언합니다. 호스트 앱에서 백업, 데이터 추출, 네트워크 보안 및通知 아이콘 정책을 유지하세요.

9. 테스트 알림을 전송하세요

사용 通知 > 테스트 전송 Capgo에서 사용하거나, 백엔드에서 API을 공개적으로 호출하세요:

curl -X POST 'https://api.capgo.app/notifications/send' \
  -H 'Content-Type: application/json' \
  -H 'x-api-key: CAPGO_API_KEY' \
  -d '{
    "appId": "com.example.app",
    "target": { "externalId": "customer-user-123" },
    "payload": {
      "title": "Hello from Capgo",
      "body": "This is a test notification.",
      "data": { "screen": "inbox" }
    }
  }'

캠페인인 경우, 대시보드에서 생성하거나 /notifications/campaigns, 그리고 외부 ID, 태그, 세그먼트 또는 방송 청중으로 전송하세요.

10. 배지 설정

await CapgoNotifications.setBadge(4)
await CapgoNotifications.incrementBadge()
await CapgoNotifications.clearBadge()

백엔드에서:

curl -X POST 'https://api.capgo.app/notifications/badge' \
  -H 'Content-Type: application/json' \
  -H 'x-api-key: CAPGO_API_KEY' \
  -d '{
    "appId": "com.example.app",
    "target": { "externalId": "customer-user-123" },
    "badge": 4
  }'

11. 무음 업데이트 확인을 활성화하세요

무음 업데이트 확인은 이 플러그인을 @capgo/capacitor-updater.

앱에서:

await CapgoNotifications.enableUpdaterIntegration({
  enabled: true,
  installMode: 'next',
})

앱의 Capgo에서 사용자에게 업데이트 푸시 앱의 알림 설정에서 활성화한 다음, API에서 업데이트 확인을 보내세요:

curl -X POST 'https://api.capgo.app/notifications/update-check' \
  -H 'Content-Type: application/json' \
  -H 'x-api-key: CAPGO_API_KEY' \
  -d '{
    "appId": "com.example.app",
    "target": { "externalId": "customer-user-123" },
    "installMode": "next"
  }'

업데이트 확인은 무음으로 작동하고, 플랫폼이 콜라프스 기능을 지원하는 경우 콜라프스 ID를 사용하여 반복되는 업데이트 확인을 대체합니다.

유효성 검사 체크리스트

• Capgo에서 예상한 수신자 검색에서 앱이 나타난다. externalId.
• 권한이 부여되거나 granted 사용자가 알림 권한을 수락했을 때
• 등록된 플랫폼은 android 또는 ios.
• registrationChanged Live Update가 발생한 후 토큰을 갱신하는 경우
• 앱이 전면 테스트를 로깅합니다. notificationReceived.
• 알림을 열 때 로깅합니다. notificationOpened.
• 대시보드 통계는 큐드되고 전송된 이벤트를 보여주고, 장치가 그들을 보고하면 받은/열린 이벤트를 보여줍니다.
• silent update 체크는 결과를 로깅합니다. runUpdateCheck 또는 업데이터 통합.

시작하기에서 계속하기

설정이 작동하지 않으면 사용 디버깅 앱 code 전에 변경하기 전에