[KW-594] fix: QR 스캔 화면 이탈 시 카메라 정리 로직 추가

src/App.tsx

@@ -1,13 +1,67 @@
-import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
+import { BrowserRouter as Router, Routes, Route, useLocation } from 'react-router-dom';
+import { useEffect } from 'react';
+
 import LoginSwitcher from './components/switcher/LoginSwitcher';
 import BuildingSelectPage from './pages/BuildingSelectPage';
 import ZoneSelectPage from './pages/ZoneSelectPage';
 import QRCodeScanner from './pages/QRCodeScanner';
 
+function GlobalPopStateHandler() {
+  useEffect(() => {
+    const handlePopState = () => {
+      const currentPath = window.location.pathname;
+      console.log("[Global] popstate 발생:", currentPath);
+
+      const scannerInstance = (window as any).scannerRef?.current;
+      if (scannerInstance?.clear) {
+        scannerInstance.clear()
+          .then(() => {
+            console.log("[Global] 카메라 정리 완료 (popstate)");
+          })
+          .catch(console.error)
+          .finally(() => {
+            (window as any).scannerRef = null;
+          });
+      } else {
+        console.log("[Global] scannerRef가 없음");
+      }
+    };
+
+    window.addEventListener("popstate", handlePopState);
+    return () => window.removeEventListener("popstate", handlePopState);
+  }, []);
+
+  return null;
+}
+
+function LocationWatcher() {
+  const location = useLocation();
+
+  useEffect(() => {
+    if (!location.pathname.startsWith('/qr')) {
+      const scannerInstance = (window as any).scannerRef?.current;
+      if (scannerInstance?.clear) {
+        scannerInstance.clear()
+          .then(() => {
+            console.log("[Global] 카메라 정리 완료 (location change)");
+          })
+          .catch(console.error)
+          .finally(() => {
+            (window as any).scannerRef = null;
+          });
+      }
+    }
+  }, [location.pathname]);
+
+  return null;
+}
+
 function App() {
 
   return (
     <Router>
+      <GlobalPopStateHandler />
+      <LocationWatcher />
       <Routes>
         <Route path="/" element={<LoginSwitcher />} /> 
         <Route path="/login" element={<LoginSwitcher />} />

src/pages/QRCodeScanner.tsx

@@ -80,6 +80,9 @@ const QRCodeScanner = () => {
     }
   };
 
+  scannerRef.current = scanner;
+  (window as any).scannerRef = scannerRef;
+
   showMessage(STATUS_MESSAGES.SCANNING);
 
   scanner.render(
@@ -118,22 +121,6 @@ const QRCodeScanner = () => {
     () => {}
   );
 
-  scannerRef.current = scanner;
-
-  return () => {
-    const instance = scannerRef.current;
-    if (instance && instance.qrCodeScanner) {
-      const html5QrInstance = instance.qrCodeScanner;
-
-      html5QrInstance
-        .stop()
-        .then(() => html5QrInstance.clear())
-        .catch(console.error)
-        .finally(() => {
-          scannerRef.current = null;
-        });
-      }
-    };
   }, []);
 
   useEffect(() => {