Mock Service Worker で開発用のモックAPIを作る
フロントエンドの開発時に仮の API を使いたいってシチュエーションはわりとあると思います。 そんな時に、Mock Service Worker を使うと便利だったのでまとめます。 Mock Service Worker とは？ Mock Service Worker は、ネットワークレベルで API リクエストをインターセプトして mock のデータを返すためのライブラリです。API リクエストを含む処理のテストや、開発時の mock サーバーの代替として利用出来ます。 テストでの利用については以前こちらの記事でまとめました。 今回は開発時のモック API としての利用について書きます。 開発用の API というと、JSON Serverが有名ですが、Mock Service Worker では Service Worker を使ってリクエストを返すため、別プロセスでローカルサーバーを立
Firebase を利用したプッシュ通知の実装 - Qiita
はじめに 仕事で解決したいことがあり、Web Push と Service Worker（以下 SW）の利用を検討しようかなと思っています 調べると Firebase Cloud Messaging（以下 FCM）を使うと簡単に実装できそうだったので、サンプルアプリを作成してみようと思います 今回実装したコードは以下です https://github.com/kurosame/glossary FCM の設定（管理画面） 以下から初期設定を行う 管理画面上での設定は以上で、その後実装する上で必要な情報は「プロジェクトの設定」で確認できます Firebase の初期設定 以下の情報は「プロジェクトの設定」で見れます 隠してますけど、これらの情報は公開してもセキュアです ただし、Firestore などのリソースにアクセスできてしまうと思うので、使っている場合は適切なルールを設定しておく必要は
一休.comにService Worker(Workbox)を導入しました - 一休.com Developers Blog
こんにちは。宿泊事業本部の宇都宮です。 この記事は、一休.com Advent Calendar 2019の2日目の記事です。 今日は、一休.com( https://www.ikyu.com )にService Worker + Workboxを導入した件について書きます。 Service Workerとは Service Workerはブラウザのバックグラウンドで動作するJavaScriptで、PWA(Progressive Web Apps)の基盤技術です。 Service Worker の紹介 https://developers.google.com/web/fundamentals/primers/service-workers?hl=ja はじめてのプログレッシブウェブアプリ https://developers.google.com/web/fundamentals/cod
ServiceWorkerをproductionで使ってる話 - 橋本商会
https://gyazo.com/343caf0f14cc565ce656a43e9a02aad2https://gyazo.com/471d8cab15bf364febe29e6f2cafb5ad
Service Worker スクリプトのインストールと更新処理
Service Worker の実装が主要ブラウザで揃い始めて盛り上がってきましたね。その流れに便乗して久しぶりに Service Worker の仕様や実装に関する記事を書いてみました。今回は Service Worker スクリプトのインストールと更新処理についてです。 この記事は Service Worker スクリプトを少しでも手書きして動かしたことがある人を想定読者にしています。Service Worker について全く知らない人はまず別の入門記事を参照してください。また、細かいことを気にせずに Service Worker を使いたい人は Workbox といったライブラリやフレームワークの利用をおすすめします。 更新履歴 2019/09/24: Chrome 78 から importScripts() も更新対象になりました。それについて加筆しました。 2018/06/07:
リニューアルした日経電子版が高速すぎてヤバイ件｜こんぴゅ
日本経済新聞は国内を代表する経済誌だ。その電子版はwebでの継続課金を大成功させ、いまや50万以上の有料会員を擁するモンスターサイトだ。 その日経電子版が11月6日に全面リニューアルしたのだが、公開後、web業界がにわかにざわついた。表示速度が爆速だったのだ。日経公式もモバイルで2倍の表示速度を達成したと堂々と宣言していた。 webサービスは継続率こそ神KPIで、その継続率には速度が大きく影響する。 これはチェキらないとヤバイと感じ、友人のkitakさんとスピードの秘密を調査してみた。 Fastlyをコンテンツキャッシュに使う殆どのデータはFastlyを経由して取得されていた。Fastlyは最近注目を集めているCDN（世界中にエッジサーバーを配置し、高速にコンテンツを配信するサービス）で、非常に高機能でユニークなサービスだ。 一般に、CDNはいったん世界中にコンテンツをばらまくと、それを無
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通知ではなく、ネットワークリクエストを横取りする機能を使ってオフライン対応をした。 ネットワ
株式会社リクルート
Services まだ出会ったことのない情報を、 より早く、より近くに届けるために 株式会社リクルートは人と情報をつなぐ メディア＆ソリューションカンパニーです。 サービスを見る
ウェブにプッシュ通知をもたらすウェブサービス「bpush」を作った - Qiita
2017年3月26日追記 bpushは2年弱の運営の後、OSSとして生まれ変わりました。詳しくは下記の記事をご覧ください。 国内初のウェブプッシュサービスbpushのOSS化と運営して学んだことについて ブラウザだけでプッシュ通知ができるようになった Chromeのバージョン42からプッシュ通知が可能になったという記事は読まれましたでしょうか？ 「Google Chrome 42」安定版リリース プッシュ通知機能追加と45件の脆弱性対 Chrome 42から、Service Workerという新しい仕組みによって、ブラウザを閉じていても、スマートフォンのプッシュ通知のようにサービス側からお知らせを届けることができるようになりました。この機能はデスクトップ版とAndroid版のChromeに導入されています。通知の仕組みにGoogle Cloud Messaging(GCM)を使っているため
the-offline-cookbook-ja/ja.md at master · kuu/the-offline-cookbook-ja
Japanese translation from the original post in English. 原文: [The offline cookbook by Jake Archibald] (http://jakearchibald.com/2014/offline-cookbook/) #The offline cookbook Posted 09 December 2014 #オフラインクックブック 投稿日：2014年12月9日 When AppCache arrived on the scene it gave us a couple of patterns to make content work offline. If those were the patterns you needed, congratulations, you won the AppCache l
ServiceWorkerでモックサーバーを作る - Qiita
実験環境は Chrome Canary 43.0.2314.0 だけど動かしてる分は現時点の安定版(40)でも動くはず やりたいこと http://localhost:3000/api/* へのリクエストを全部serviceworkerに任せたい。 先行実装として Jxck/response-injection がある。 やり方 sw.js(になるsw.coffee) console.log 'worker started' self.onfetch = (event) -> console.log 'onfetch', event.request.url if event.request.url.indexOf(location.origin+'/api') > -1 event.respondWith new Response '{"foo": "bar"}', status: 200
Google I/O 2014 ── ServiceWorker でネイティブアプリとの差を縮めよう
Google I/O 2014 ── ServiceWorker でネイティブアプリとの差を縮めよう 矢倉 眞隆（myakura） 今回お届けするのは、Jake Archibald氏とAlex Russell氏によるServiceWorkerのセッション「Appy Times with ServiceWorker – Bridging the gap between the web and apps」です。 Alex氏はService Workers仕様のEditorで、古くはDojoやChrome Frameに携わっています。TC39やW3CのTAGのメンバーとしても活動し、Extensible Web構想を推し進める一人です。 Jake氏はService Workers仕様の「ゴーストオーサー」だそうです。とても面白い人で、今回も彼のユーモアが炸裂、笑いに包まれた楽しいセッションとなり
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
PWA Night Conf: ScrapboxでのServiceWorkerとCacheの活用 - daiiz
ServiceWorker Side XXX
加速するフロントエンドとPWA