2018年5月30日のブックマーク (5件)

  • Service Workerの基本とそれを使ってできること - Qiita

    Service Workerとは ブラウザが Web ページとは別にバックグラウンドで実行するスクリプト オフラインのアプリを実現・サポートするために作られたものです ちなみに、ブラウザの対応状況はこんな感じ http://caniuse.com/#search=service%20workers 特徴 DOM にアクセスできない DOM を操作したい場合は、Service Worker がコントロールしているページ(js)と postMessage でメッセージのやり取りをして行う リクエストをプロキシすることが可能 Service Worker はブラウザが必要に応じて起動・終了するので、変数の値を保持しておけない Cache、IndexedDB 等で値を保存して、必要になった時に取り出すようにする Promise を多用する https か localhost 上でしか動作しない ラ

    Service Workerの基本とそれを使ってできること - Qiita
  • 【3ステップではじめる】PWAによる「ホーム画面に追加」バナーの実装 - エンジニアのたまご

    概要 PWAのService Workerを使って、Webサイトに訪れた時に、「ホームに追加する」バナーの表示をする機能を実装をしました 割りと簡単に実装できたので、その方法をご紹介します! ↓こんなバナーが表示されるようになります ▲Polymer Shop demoのバナー表示例 概要 PWA(Progressive Web Apps)とは Service Workerについて SWの動作環境 【3ステップではじめる】「ホーム画面に追加」バナーの表示 通知条件 1. アイコンやアプリ名などの設定を行う:manifest.json 2. serviceWorker.jsを作成する 3. 作成したファイルをheaderで読み込む デバッグ方法 Android実機からの確認 Desktop Chromeからの確認 気をつけておくこと PWA(Progressive Web Apps)とは P

    hapilaki
    hapilaki 2018/05/30
    chrome://flags/#bypass-app-banner-engagement-checks にアクセスし、「有効化」を選択する chrome://flags/#enable-app-banners にアクセスし、「有効化」を選択する Chromeを再起動する ChromeのDev toolからApplicationタブを開き、[Add to Homescreen][web制作]
  • Introduction to Service Worker: How to use Service Worker - HTML5 Rocks

    Service Worker は非常に有用ですが、最初は扱いが難しい場合があります。Workbox により、Service Worker が使いやすくなります。 ただし、Service Worker は困難な問題を解決するため、そのテクノロジーの抽象化も、理解がなければ難しいものです。したがって、Workbox の詳細に入る前に、これらのドキュメントの最初の数部分で基盤となるテクノロジーについて説明します。 実行中の Service Worker のリストを表示するには、アドレスバーに「chrome://serviceworker-internals/」と入力します。 Service Worker がもたらすもの Service Worker は、ウェブブラウザとウェブサーバー間のプロキシとして機能する特別な JavaScript アセットです。オフライン アクセスの提供による信頼性の向上

  • ServiceWorkerとCache APIを使ってオフラインでも動くWebアプリを作る - Qiita

    はじめに Thetaの360°画像にぼかしを入れるWebアプリSphereBlur.comを作った際に、オフラインでも動くようにするために、HTML5の新しい技術Service Workerを使った。なお、下の動画でホーム画面からネイティブアプリっぽく起動しているのはWeb App Manifestのおかげである。 Service Worker Service Workerは、通常のページの環境とは別に、バックグラウンドで実行されるJavaScript実行環境で、ページからのネットワークリクエストを横取りしたり、ウェブサイトからのPush通知を受けとって表示するといった、今まではできなかった処理をすることができる。Push通知の方は、去年Facebookが使い始めたので有名になったが、今回はPush通知ではなく、ネットワークリクエストを横取りする機能を使ってオフライン対応をした。 ネットワ

    ServiceWorkerとCache APIを使ってオフラインでも動くWebアプリを作る - Qiita
    hapilaki
    hapilaki 2018/05/30
    Service Worker 書き方具体例
  • 部活内暴力の思い出

    「その部活って顧問による洗脳じゃん」 嫁に思い出話をしたら、そう言われた。 高校時代の部活で顧問による体罰事件があり、顧問の先生が罰されても、なお先生に泣きながら復帰してくださいと懇願する生徒たちの姿を洗脳と言っていた。僕も当時は一種の洗脳だと思ったが、とても言い出せる雰囲気ではなかった。 さて、いきなり嫁との会話を書いてしまったが順を追って書こうと思う。 そもそもこの話を書こうと思ったは、今マスコミを賑わしている日大アメフト部のコーチによる暴力が原因だ。顧問による暴力と聞くと、僕も高校時代に顧問による暴力に多少縁があったからだ。また、このニュース記事の見出しの「盲目」という単語が目についた。僕の顧問の先生も、人を盲目的にさせる天才だったなと。 http://news.tbs.co.jp/newseye/tbs_newseye3380718.html あれから10年、そろそろ言葉にして残し

    部活内暴力の思い出
    hapilaki
    hapilaki 2018/05/30