読者です 読者をやめる 読者になる 読者になる

k2wankoの技術的なanything

プログラミングとか技術系の情報とか書いてます。

ServiceWorker ハッカソンに行ってきました。

f:id:k2wanko:20150404203516j:plain

どうもk2wankoです。

気がつけば大学生活も半分終わってました。

春一番Google主催のServiceWrokerハッカソンに参加してきたのでメモを残しておこうと思います。

ServiceWorkerとは

イベント駆動によるJavaScriptの実行環境です。

ページからのリクエストにHookして色々操作することもができ、リクエストというのはXHRだけではなくとかのリクエストも書き換えることができるようです。

最近話題になったPushNotificationなども

ServiceWorkerから利用できます。

なのでWebでPushとか使いたいならServiceWorkerを制しておきましょう。

ServiceWorkerのデバッグ

docs.google.com

ここのスライドを参考にやります。

ChromeCanaryをインストールし

chrome://flagsにアクセスします。

デベロッパー ツールのテストを有効にするを有効にしたら再起動します。

ちなみにServiceWorkerはどこでも利用できるわけではなくlocalhosthttpsのみになります。

リクエストを置き換えられるのでセキュリティ的にhttpsじゃなきゃダメということですね。

とりあえずHTML等とローカルサーバーを用意してデベロッパーコンソールを開き

右にある歯車アイコンをクリックしてSettingを開きます。

左の項目にExperimentsを選択しShiftを6回クリックし非表示の項目を表示させます。

Service workers in Resources panelにチェックを入れるとResourceにServiceWorkersという項目が追加されて デバッグができるようになります。

Push通知の実装は以下のスライドにあります

docs.google.com

まとめ

前々から気になっていたPush通知を試せて良かったです。

今日のハッカソンでPush通知に少しハマったのがServiceWorkerを登録し直すとSubscriptionIdが変わるということに気づかなかったところです。

それとPush通知の利用シーンとしてはアプリを入れるまでもないしユーザー登録をするまでもないようなサービスに最適なんだなーと言うことを学べたので

何かサービスを作れるように頑張って見ようと思います。

参考リンク

Service Worker ハッカソン