배포 bundle과 같은 commit의 정적 버전 문서를 생성하고, 열린 탭이 DB mutation 없이 변경을 감지하도록 한다. 동일 버전은 tab session에서 한 번만 안내하며 강제 새로고침은 하지 않는다.
46 lines
1.7 KiB
TypeScript
46 lines
1.7 KiB
TypeScript
import { onBeforeUnmount, onMounted } from 'vue';
|
|
import { createDeploymentVersionChecker } from '../config/deploymentVersion';
|
|
import { useGameFeedback } from './useGameFeedback';
|
|
|
|
const pollIntervalMs = 60_000;
|
|
const noticeMessage = '새 버전이 준비되었습니다. 새로고침하면 변경사항이 반영됩니다.';
|
|
|
|
const resolveSessionStorage = (): Pick<Storage, 'getItem' | 'setItem'> | undefined => {
|
|
try {
|
|
return window.sessionStorage;
|
|
} catch {
|
|
return undefined;
|
|
}
|
|
};
|
|
|
|
export const useDeploymentVersionNotice = (): void => {
|
|
const currentCommitSha = import.meta.env.VITE_BUILD_COMMIT_SHA?.trim() ?? '';
|
|
const versionUrl = `${import.meta.env.BASE_URL}deployment-version.json`;
|
|
const { info: showInfoToast } = useGameFeedback();
|
|
const checker = createDeploymentVersionChecker({
|
|
currentCommitSha,
|
|
versionUrl,
|
|
storage: resolveSessionStorage(),
|
|
onVersionChanged: () => showInfoToast(noticeMessage),
|
|
});
|
|
let pollTimer: ReturnType<typeof setInterval> | null = null;
|
|
|
|
const checkWhenVisible = (): void => {
|
|
if (document.visibilityState === 'visible') void checker.check();
|
|
};
|
|
|
|
onMounted(() => {
|
|
void checker.check();
|
|
pollTimer = setInterval(checkWhenVisible, pollIntervalMs);
|
|
document.addEventListener('visibilitychange', checkWhenVisible);
|
|
window.addEventListener('online', checkWhenVisible);
|
|
});
|
|
|
|
onBeforeUnmount(() => {
|
|
if (pollTimer) clearInterval(pollTimer);
|
|
pollTimer = null;
|
|
document.removeEventListener('visibilitychange', checkWhenVisible);
|
|
window.removeEventListener('online', checkWhenVisible);
|
|
});
|
|
};
|