PWA Fix (#5432)

* PWA Fix

* SWが/api/へのリクエストに関与しないように

* fix semicolon

* Update base.pug

* Update base.pug

src/client/app/boot.js

@@ -98,15 +98,10 @@
 
 	// If mobile, insert the viewport meta tag
 	if (isMobile) {
-		const meta = document.createElement('meta');
-		meta.setAttribute('name', 'viewport');
-		meta.setAttribute('content',
-			'width=device-width,' +
-			'initial-scale=1,' +
-			'minimum-scale=1,' +
-			'maximum-scale=1,' +
-			'user-scalable=no');
-		head.appendChild(meta);
+		const viewport = document.getElementsByName("viewport").item(0);
+		viewport.setAttribute('content',
+			`${viewport.getAttribute('content')},minimum-scale=1,maximum-scale=1,user-scalable=no`);
+		head.appendChild(viewport);
 	}
 
 	// Switch desktop or mobile version

src/client/app/sw.js

@@ -4,13 +4,53 @@
 
 import composeNotification from './common/scripts/compose-notification';
 
+// eslint-disable-next-line no-undef
+const version = _VERSION_;
+const cacheName = `mk-cache-${version}`;
+
+const apiUrl = `${location.origin}/api/`;
+
 // インストールされたとき
 self.addEventListener('install', ev => {
 	console.info('installed');
 
-	ev.waitUntil(Promise.all([
-		self.skipWaiting(), // Force activate
-	]));
+  ev.waitUntil(
+		caches.open(cacheName)
+			.then(cache => {
+				return cache.addAll([
+					"/",
+					`/assets/desktop.${version}.js`,
+					`/assets/mobile.${version}.js`,
+					"/assets/error.jpg"
+				]);
+			})
+			.then(() => self.skipWaiting())
+  );
+});
+
+self.addEventListener('activate', ev => {
+	ev.waitUntil(
+		caches.keys()
+			.then(cacheNames => Promise.all(
+				cacheNames
+					.filter((v) => v !== cacheName)
+					.map(name => caches.delete(name))
+			))
+			.then(() => self.clients.claim())
+	);
+});
+
+self.addEventListener('fetch', ev => {
+	if (ev.request.method !== 'GET' || ev.request.url.startsWith(apiUrl)) return;
+	ev.respondWith(
+		caches.match(ev.request)
+			.then(response => {
+				return response || fetch(ev.request);
+			})
+			.catch(() => {
+				return caches.match("/");
+			})
+	);
 });
 
 // プッシュ通知を受け取ったとき

src/server/web/views/base.pug

@@ -12,7 +12,9 @@ html
 		meta(name='referrer' content='origin')
 		meta(name='theme-color' content='#105779')
 		meta(property='og:site_name' content= instanceName || 'Misskey')
+		meta(name='viewport' content='width=device-width, initial-scale=1')
 		link(rel='icon' href= icon || '/favicon.ico')
+		link(rel='apple-touch-icon' href= icon || '/apple-touch-icon.png')
 		link(rel='manifest' href='/manifest.json')
 
 		title