お試しでPWA化

This commit is contained in:
yuki540 2018-06-15 14:07:20 +09:00
parent 50dc52c83c
commit 65776c19c5
6 changed files with 100 additions and 4 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 257 KiB

View File

@ -16,7 +16,7 @@
-->
<title>魔法少女サイト - DropOut</title>
<meta name="description" content="『僕は魔法少女------そう思っていた』">
<meta name="keywords" content="魔法少女サイト,yuki540,satella.io,yuki540.com,DropOut">
<meta name="keywords" content="魔法少女サイト,yui540,satella.io,magical-girl.site,DropOut">
<meta name="viewport" content="width=device-width,user-scalable=no,maximum-scale=1">
<meta property="og:url" content="https://magical-girl.site">
<meta property="og:image" content="https://magical-girl.site/images/ogp.png">
@ -26,12 +26,14 @@
<meta property="og:description" content="『僕は魔法少女------そう思っていた』">
<meta property="og:locale" content="ja_JP">
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@eriri_jp" />
<meta name="twitter:site" content="@yui540" />
<meta name="twitter:title" content="魔法少女サイト - DropOut" />
<meta name="twitter:description" content="『僕は魔法少女------そう思っていた』" />
<meta name="twitter:image" content="https://magical-girl.site/images/ogp.png" />
<link rel="shortcut icon" href="https://magical-girl.site/images/profile/yui540.png" />
<link rel="apple-touch-icon" href="https://magical-girl.site/images/profile/yui540.png" />
<meta name="theme-color" content="#484053" />
<link rel="manifest" href="/manifest.json">
<link rel="shortcut icon" href="https://magical-girl.site/images/icons/icon-192.png" />
<link rel="apple-touch-icon" href="https://magical-girl.site/images/icons/icon-192.png" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<link rel="stylesheet" href="./stylesheets/font.css" />
<link rel="stylesheet" href="./stylesheets/style.css" />
@ -44,6 +46,14 @@
gtag('config', 'UA-53682384-7');
</script>
<script>
if('serviceWorker' in navigator) {
navigator.serviceWorker.register('./sw.js')
.then(() => {
console.log('Service Worker Registered.')
})
}
</script>
</head>
<body>
<main id="root">

18
public/manifest.json Normal file
View File

@ -0,0 +1,18 @@
{
"name": "魔法少女サイト - DropOut",
"short_name": "魔法少女サイト",
"description": "『僕は魔法少女------そう思っていた』",
"background_color": "#484053",
"theme_color": "#484053",
"icons": [{
"src": "./images/icons/icon-256.png",
"sizes": "256x256",
"type": "image/png"
},{
"src": "./images/icons/icon-192.png",
"sizes": "192x192",
"type": "image/png"
}],
"start_url": "./?utm_source=homescreen",
"display": "standalone"
}

68
public/sw.js Normal file
View File

@ -0,0 +1,68 @@
const CACHE_NAME = 'magical-girl.site_version6.0.0'
const urlsToCache = [
'/',
'/stylesheets/font.css',
'/stylesheets/style.css',
'/scripts/app.min.js',
'https://use.fontawesome.com/releases/v5.0.10/css/all.css',
'./images/load-view/poster/1.png',
'./images/load-view/poster/2.png',
'./images/load-view/poster/3.png',
'./images/load-view/poster/4.png',
'./images/load-view/sd/1.png',
'./images/load-view/sd/2.png',
'./images/load-view/sd/3.png',
'./images/load-view/sd/4.png',
'./images/load-view/text/1.png',
'./images/load-view/text/2.png',
'./images/load-view/text/3.png',
'./images/load-view/text/4.png',
'./images/bg.png',
'./images/calling/say.png',
'./images/calling/icons/eriri_large.png',
'./images/calling/icons/eriri.png',
'./images/calling/icons/gab_large.png',
'./images/calling/icons/gab.png',
'./images/calling/icons/yui_large.png',
'./images/calling/icons/yui.png',
'./images/end-animation/end.png',
'./images/end-animation/end-roll/1.png',
'./images/end-animation/end-roll/2.png',
'./images/end-animation/end-roll/3.png',
'./images/gab-animation/bg.png',
'./images/gab-animation/gab.png',
'./images/gab-animation/message.png',
'./images/gab-animation/comic/1.png',
'./images/gab-animation/comic/2.png',
'./images/gab-animation/comic/3.png',
'./images/gab-animation/comic/4.png',
'./images/gab-animation/comic/bg.png',
'./images/gab-animation/name/1.png',
'./images/gab-animation/name/2.png',
'./images/gab-animation/name/3.png',
'./images/gab-animation/name/4.png',
'./images/gab-animation/name/5.png',
'./images/top-page/gab.png',
'./images/top-page/logo.png',
]
self.addEventListener('install', e => {
e.waitUntil(
caches.open(CACHE_NAME)
.then(cache => {
return cache.addAll(urlsToCache)
})
)
})
self.addEventListener('activate', e => {})
self.addEventListener('fetch', e => {
e.respondWith(
caches.match(e.request)
.then(res => {
if(res) return res
return fetch(e.request)
})
)
})