[Web] [Chore] 임시로 클라이언트 사이드에서 모바일 감지 리다이렉트

capstone-kw-jjiggle · Nov 10, 2024 · d370ba2 · d370ba2
1 parent 710a9e7
commit d370ba2
Showing 1 changed file with 18 additions and 0 deletions.
diff --git a/apps/web/src/app/layout.tsx b/apps/web/src/app/layout.tsx
@@ -1,6 +1,9 @@
+'use client';
+
 import { Theme } from '@radix-ui/themes';
 import '@radix-ui/themes/styles.css';
 import type { Metadata } from 'next';
+import { useEffect } from 'react';
 import Footer from '@/shared/components/layout/footer/footer';
 import Header from '@/shared/components/layout/header/header';
 import ReactQueryProviders from '@/shared/apis/ReactQueryClientProvider';
@@ -32,6 +35,21 @@ export default function RootLayout({
   children: React.ReactNode;
   modal: React.ReactNode;
 }>) {
+  useEffect(() => {
+    // 모바일 기기 확인 함수
+    const isMobile = () => {
+      return /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
+        navigator.userAgent,
+      );
+    };
+
+    // 현재 호스트가 모바일용 도메인이 아니고 모바일 기기일 경우 리다이렉트
+    if (isMobile() && window.location.hostname === 'rankit.run') {
+      const newUrl = `https://m.rankit.run${window.location.pathname}`;
+      window.location.replace(newUrl);
+    }
+  }, []);
+
   return (
     <html lang="en">
       <head>