[vue-cordova] 푸시 알림 사용 하기 (onesignal, firebase)

suhanLee·2022년 7월 2일

Firebase cordova notifications onesignal push vue

cordova

목록 보기

6/16

출처 : https://onesignal.com/blog/how-to-add-push-notifications-to-a-cordova-android-app/#part-2-push-notification-setup-for-android-in-cordova

1. onesignal 계정 생성 및 플랫폼(안드로이드) 선택

2. firebase 서버 키, 발신자 ID 셋팅

firebase 프로젝트 셋팅 방법

https://velog.io/@completed1991/firebase-cordova-%ED%91%B8%EC%8B%9C-%EA%B4%80%EB%A0%A8-%EC%85%8B%ED%8C%85-1nq281ks

3. SDK 선택

4. 생성 된 App ID 복사

5. onesignal-cordova-plugin 플러그인 설치

$ cordova plugin add onesignal-cordova-plugin --save

6. addEventListener 코드 작성 ( 앱아이디 셋팅 )

// Add to index.js or the first page that loads with your app.
document.addEventListener('deviceready', OneSignalInit, false);
function OneSignalInit() {
    // Uncomment to set OneSignal device logging to VERBOSE  
    // window.plugins.OneSignal.setLogLevel(6, 0);
    
    // NOTE: Update the setAppId value below with your OneSignal AppId.
    window.plugins.OneSignal.setAppId(process.evn.VUE_APP_PUSH_APP_ID); <-- 앱아이디 셋팅
    window.plugins.OneSignal.setNotificationOpenedHandler(function(jsonData) {
        console.log('notificationOpenedCallback: ' + JSON.stringify(jsonData));
    });
    
    // iOS - Prompts the user for notification permissions.
    //    * Since this shows a generic native prompt, we recommend instead using an In-App Message to prompt for notification permission (See step 6) to better communicate to your users what notifications they will get.
    window.plugins.OneSignal.promptForPushNotificationsWithUserResponse(function(accepted) {
        console.log("User accepted notifications: " + accepted);
    });
}