차량 모니터 서비스워커 해제
This commit is contained in:
@@ -23,7 +23,7 @@ Car는 차량 모뎀/게이트웨이에서 받은 상태를 수집해 DB에 저
|
|||||||
- 수집 공백을 반영한 차량 상태 경과 시간 표시
|
- 수집 공백을 반영한 차량 상태 경과 시간 표시
|
||||||
- 도어/경계/시동/공조 상태 해석
|
- 도어/경계/시동/공조 상태 해석
|
||||||
- 실시간 차량 도어/트렁크 열림 표시
|
- 실시간 차량 도어/트렁크 열림 표시
|
||||||
- service worker와 PWA icon 제공
|
- PWA icon 제공
|
||||||
|
|
||||||
## 주요 API
|
## 주요 API
|
||||||
|
|
||||||
@@ -61,12 +61,12 @@ Car는 차량 모뎀/게이트웨이에서 받은 상태를 수집해 DB에 저
|
|||||||
- `collector_se.php`: 상태 수집 CLI/cron
|
- `collector_se.php`: 상태 수집 CLI/cron
|
||||||
- `tcp_worker.php`: TCP 큐 처리와 늦은 사용량 정산 worker
|
- `tcp_worker.php`: TCP 큐 처리와 늦은 사용량 정산 worker
|
||||||
- `car-tcp-worker.service`: systemd service 예시
|
- `car-tcp-worker.service`: systemd service 예시
|
||||||
- `sw.js`: service worker
|
- `sw.js`: 과거 등록된 service worker 정리용 파일
|
||||||
- `assets/`: 아이콘과 정적 자산
|
- `assets/`: 아이콘과 정적 자산
|
||||||
|
|
||||||
`asset-version.php`는 차량 모니터의 PHP/JS/CSS/manifest/icon 파일을 읽어 크기, 수정 시각, sha256 hash를 묶은 버전을 만듭니다. `assets/asset-reload.js`는 열린 모니터 화면에서 이 값을 확인하고, 달라지면 Cache Storage를 비운 뒤 현재 화면을 다시 엽니다. 현재 URL의 `assetReload` 토큰이 최신 파일 묶음 hash와 다르면 첫 진입도 토큰을 붙인 URL로 다시 열어 낡은 JS/CSS가 먼저 실행되는 상황을 줄입니다. 모바일/삼성 브라우저 호환을 위해 화면 복귀, 온라인 복귀, 터치/클릭 복귀 이벤트도 확인하고, Web Storage 실패 시 쿠키 fallback으로 이전 버전을 비교합니다.
|
`asset-version.php`는 차량 모니터의 PHP/JS/CSS/manifest/icon 파일을 읽어 크기, 수정 시각, sha256 hash를 묶은 버전을 만듭니다. `assets/asset-reload.js`는 열린 모니터 화면에서 이 값을 확인하고, 달라지면 Cache Storage를 비우고 service worker 등록을 해제한 뒤 현재 화면을 다시 엽니다. 현재 URL의 `assetReload` 토큰이 최신 파일 묶음 hash와 다르면 첫 진입도 토큰을 붙인 URL로 다시 열어 낡은 JS/CSS가 먼저 실행되는 상황을 줄입니다. 모바일/삼성 브라우저 호환을 위해 화면 복귀, 온라인 복귀, 터치/클릭 복귀 이벤트도 확인하고, Web Storage 실패 시 쿠키 fallback으로 이전 버전을 비교합니다.
|
||||||
|
|
||||||
`sw.js`는 기존 정적 캐시를 정리한 뒤 요청을 네트워크로 넘깁니다. `monitor.php`, 인증 요청, AJAX/usage 같은 PHP 응답은 인증 쿠키와 실시간 상태가 엮이므로 service worker 캐시 대상에서 제외합니다.
|
`monitor.php`는 남은 service worker 등록을 해제합니다. 차량 상태와 인증 요청은 실시간 응답이 중요하므로 브라우저 오프라인 캐시를 사용하지 않습니다.
|
||||||
|
|
||||||
## 데이터/저장소
|
## 데이터/저장소
|
||||||
|
|
||||||
|
|||||||
+13
-8
@@ -155,6 +155,18 @@
|
|||||||
}).catch(function () {});
|
}).catch(function () {});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function unregisterServiceWorkers() {
|
||||||
|
if (!navigator.serviceWorker || !navigator.serviceWorker.getRegistrations) return Promise.resolve();
|
||||||
|
|
||||||
|
return navigator.serviceWorker.getRegistrations().then(function (registrations) {
|
||||||
|
return Promise.all(registrations.map(function (registration) {
|
||||||
|
return registration.unregister().catch(function () {});
|
||||||
|
}));
|
||||||
|
}).catch(function () {});
|
||||||
|
}
|
||||||
|
|
||||||
|
unregisterServiceWorkers();
|
||||||
|
|
||||||
function reloadWith(version) {
|
function reloadWith(version) {
|
||||||
var token = version.slice(0, 12);
|
var token = version.slice(0, 12);
|
||||||
var marker = token + ':' + Math.floor(Date.now() / 10000);
|
var marker = token + ':' + Math.floor(Date.now() / 10000);
|
||||||
@@ -163,14 +175,7 @@
|
|||||||
if (assetTokenFromLocation() && sessionGet(reloadKey) === marker) return;
|
if (assetTokenFromLocation() && sessionGet(reloadKey) === marker) return;
|
||||||
|
|
||||||
sessionSet(reloadKey, marker);
|
sessionSet(reloadKey, marker);
|
||||||
withTimeout(deleteCaches(), 2500).then(function () {
|
withTimeout(Promise.all([deleteCaches(), unregisterServiceWorkers()]), 2500).then(function () {
|
||||||
if (navigator.serviceWorker && navigator.serviceWorker.getRegistrations) {
|
|
||||||
navigator.serviceWorker.getRegistrations().then(function (registrations) {
|
|
||||||
registrations.forEach(function (registration) {
|
|
||||||
if (registration && typeof registration.update === 'function') registration.update();
|
|
||||||
});
|
|
||||||
}).catch(function () {});
|
|
||||||
}
|
|
||||||
window.location.replace(addQuery(window.location.href, 'assetReload', token));
|
window.location.replace(addQuery(window.location.href, 'assetReload', token));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
+2
-2
@@ -3350,8 +3350,8 @@ $carMonitorSession = car_monitor_launcher_session();
|
|||||||
<script>
|
<script>
|
||||||
if ('serviceWorker' in navigator) {
|
if ('serviceWorker' in navigator) {
|
||||||
window.addEventListener('load', () => {
|
window.addEventListener('load', () => {
|
||||||
navigator.serviceWorker.register('/car/sw.js?v=20260721_nocache1', {scope: '/car/'})
|
navigator.serviceWorker.getRegistrations()
|
||||||
.then(registration => registration.update())
|
.then(registrations => registrations.forEach(registration => registration.unregister()))
|
||||||
.catch(() => {});
|
.catch(() => {});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user