・WEB push通知
・バックグラウンド処理
・オフライン動作
・PWA（Progressive Web Apps）化
などなど、その初めの一歩としてService Workerを最小構成で導入してみた
全て同じディレクトリに配置
├ index.html
├ main.js
└ sw.js
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Service Worker Test</title>
<script src="main.js"></script>
</head>
<body>
<header class="header">
<h1 class="header__title">Service Worker Test</h1>
</header>
</body>
</html>main.js
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('./sw.js').then(function(reg) {
//Service worker
console.log(reg);
}).catch(function(error) {
//エラーログ
console.log('Service worker:' + error);
});
}sw.js
this.addEventListener('install', function(event) {
//処理
});これだけではまだService Workerがインストールされるだけですが、ここから処理を追加していきたいと思います
0 件のコメント :
コメントを投稿