$30 off During Our Annual Pro Sale. View Details »

Service Workers Push API Hands-on

Take
April 17, 2015

Service Workers Push API Hands-on

infiniteloop 社内勉強会資料 2015/04/17

Take

April 17, 2015
Tweet

More Decks by Take

Other Decks in Technology

Transcript

  1. Service Workers Ͱग़དྷΔࣄ ɾCache ɹApplicationCache ΑΓ΋ߴ౓ͳΩϟογϡػೳ ɾPush ɹPUSH ௨஌ ɾSync

    ɹࢦఆͨ͠೚ҙͷλΠϛϯάͰىಈ IUUQXXXXPSH53TFSWJDFXPSLFST
  2. Service Workers PUSH API ($. 4FSWFS (PPHMF$MPVE.FTTBHJOH $ISPNFͷ৔߹ Πϕϯτ௨஌ Πϕϯτ௨஌

    σʔλऔಘ Πϕ ϯ τ ௨ ஌ εϚϗ౳ͷ
 ϒϥ΢β ᶃ ᶄ ᶅ
  3. Google Cloud Messaging ࢀߟ: Google Cloud ϝοηʔδϯάʢGCMʣͷ࢖༻ - Google Play

    σϕϩούʔ ϔϧϓ https://support.google.com/googleplay/ android-developer/answer/2663268?hl=ja
  4. manifest.json { "name": "push test", "short_name": "push!", "icons": [{ "src":

    "html5.png", "sizes": "64x64", "type": "image/png" }], "start_url": "/", "display": "standalone", "gcm_sender_id": "849903130382", "gcm_user_visible_only": true } HDN@TFOEFS@JE
  5. Web Server Service Workers Λࢼ͢ʹ͸ɺ Web Server ͕ ඞཁɻ ϗετ໊͕

    localhost ͷ৔߹ʹݶͬͯ HTTP Server Ͱ΋࢖͑Δɻ
 ͦΕҎ֎ͷ৔߹͸ HTTPS Server ͕ඞཁɻ
  6. ࣮ࡍͷ Push Event ͷൃՐํ๏ curl --header "Authorization: key=API_KEY" --header "Content-Type:

    application/json" https://android.googleapis.com/gcm/send -d "{\"registration_ids\":[\"SUBSCRIPTION_ID\"]}" Invoke-RestMethod -Headers @{Authorization="key=API_KEY"} -ContentType "application/json"ɹɹɹɹɹɹɹɹɹɹɹɹɹɹɹɹ -Uri "https://android.googleapis.com/gcm/send" -Method POST -Body "{`"registration_ids`":[`"SUBSCRIPTION_ID`"]}" .BD -JOVYͷ৔߹ 8JOEPXT 1PXFS4IFMM ͷ৔߹ ೖྗ͢Δࡍʹվߦ͸ෆཁͰ͢
  7. ࢀߟࢿྉ Ⅰ Service Worker ͷ঺հ: Service Worker ͷ࢖͍ํ - HTML5

    Rocks http://www.html5rocks.com/ja/tutorials/service-worker/ introduction/ ServiceWorker API - Web API ΠϯλʔϑΣΠε | MDN https://developer.mozilla.org/ja/docs/Web/API/ServiceWorker_API Push Notifications on the Open Web http://updates.html5rocks.com/2015/03/push-notificatons-on-the- open-web
  8. ࢀߟࢿྉ Ⅱ Is ServiceWorker ready? (ϒϥ΢βͷରԠঢ়گ) https://jakearchibald.github.io/isserviceworkerready/ W3C Working Draft

    http://www.w3.org/TR/service-workers/ GCM HTTP Connection Server | Android Developers https://developer.android.com/google/gcm/http.html Chrome - Service Worker ։ൃ͢Δͱ͖ͷσόοάํ๏ - Qiita http://qiita.com/tmtysk/items/f77e31d6e9380e1c94a2