registration.showNotificationは関数ではありません

Question

私はserviceworker-webpack-pluginを使用して、私のreactjsアプリでサービスワーカーを作成しています。

私はthe exampleに従って、メインスレッドにサービスワーカーを登録しました。私はHtml5 NotificationがAndroidのChromeで動作しないことを知ったので、new Notification('...')の代わりにregistration.showNotification('Title', { body: 'Body.'});を使用して通知をプッシュしました。しかし、私はデスクトップクロームでそれをテストしたとき、それは

registration.showNotification is not a function 

このエラーがスローされますがAndroidのクロムのではなく、デスクトップ上でのみ利用可能registration.showNotificationですか？

public componentDidMount(){ 

    if ('serviceWorker' in navigator && 
     (window.location.protocol === 'https:' || window.location.hostname === 'localhost') 
    ) { 
     const registration = runtime.register(); 

     registerEvents(registration, { 
      onInstalled:() => { 

       registration.showNotification('Title', { body: 'Body.'}); 
      } 
     }) 
    } else { 
     console.log('serviceWorker not available') 
    } 
} 

Answer 1

runtime.register()約束はshowNotification()メソッドを持っていないので、あなたがnot a functionエラーを得ている理由であるJavaScriptの約束を返します。

実際にregistrationオブジェクトを取得するには、.then()コールバックをチェーンする必要があります（または、async/awaitを使用することもできます）。

runtime.register().then(registration => { 
    registration.showNotification(...); 
})