Merge pull request #163 from sipe-team/feat/5th-recruit

G-hoon · web-flow · commit 72be381da19c · 2025-12-15T22:15:34.000+09:00
feat: 캐시 무효화를 위한 asset version 추가
diff --git a/@types/environment.d.ts b/@types/environment.d.ts
@@ -7,5 +7,6 @@ namespace NodeJS {
     KEY: string;
     NEXT_PUBLIC_GA_MEASUREMENT_ID: string;
     NEXT_PUBLIC_ORIGIN: string;
+    NEXT_PUBLIC_ASSET_VERSION: string;
   }
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -9,6 +9,7 @@ import { pretendardFont } from '@/app/_fonts';
 import ClientProvider from '@/components/global/ClientProvider';
 import Footer from '@/components/global/Footer';
 import Navigation from '@/components/global/Navigation';
+import { ASSET_VERSION } from '@/libs/constants/assetVersion';
 import { DEFAULT_METADATA } from '@/libs/constants/metadata';
 
 import styles from './layout.module.scss';
@@ -19,18 +20,21 @@ function RootLayout({ children }: { children: React.ReactNode }) {
   return (
     <html lang="ko" className={pretendardFont.className}>
       <head>
-        <link rel="mask-icon" href="/assets/safari-pinned-tab.svg" />
+        <link
+          rel="mask-icon"
+          href={`/assets/safari-pinned-tab.svg?v=${ASSET_VERSION}`}
+        />
         <link
           rel="icon"
           type="image/png"
           sizes="32x32"
-          href="/assets/favicon-32x32.png"
+          href={`/assets/favicon-32x32.png?v=${ASSET_VERSION}`}
         />
         <link
           rel="icon"
           type="image/png"
           sizes="16x16"
-          href="/assets/favicon-16x16.png"
+          href={`/assets/favicon-16x16.png?v=${ASSET_VERSION}`}
         />
       </head>
       <body>
diff --git a/src/app/manifest.ts b/src/app/manifest.ts
@@ -1,5 +1,7 @@
 import { MetadataRoute } from 'next';
 
+import { ASSET_VERSION } from '@/libs/constants/assetVersion';
+
 function manifest(): MetadataRoute.Manifest {
   return {
     name: 'SIPE',
@@ -11,27 +13,27 @@ function manifest(): MetadataRoute.Manifest {
     theme_color: '#131518',
     icons: [
       {
-        src: '/favicon.ico',
+        src: `/favicon.ico?v=${ASSET_VERSION}`,
         sizes: '48x48',
         type: 'image/x-icon',
       },
       {
-        src: '/assets/favicon-16x16.png',
+        src: `/assets/favicon-16x16.png?v=${ASSET_VERSION}`,
         sizes: '16x16',
         type: 'image/png',
       },
       {
-        src: '/assets/favicon-32x32.png',
+        src: `/assets/favicon-32x32.png?v=${ASSET_VERSION}`,
         sizes: '32x32',
         type: 'image/png',
       },
       {
-        src: '/assets/android-chrome-192x192.png',
+        src: `/assets/android-chrome-192x192.png?v=${ASSET_VERSION}`,
         sizes: '192x192',
         type: 'image/png',
       },
       {
-        src: '/assets/android-chrome-512x512.png',
+        src: `/assets/android-chrome-512x512.png?v=${ASSET_VERSION}`,
         sizes: '512x512',
         type: 'image/png',
       },
diff --git a/src/libs/constants/assetVersion.ts b/src/libs/constants/assetVersion.ts
@@ -0,0 +1,11 @@
+/**
+ * 자산 캐시 무효화를 위한 버전 관리
+ *
+ * - Vercel 환경: NEXT_PUBLIC_ASSET_VERSION 환경 변수 사용
+ * - 로컬 개발: 현재 날짜 기반 버전 사용
+ *
+ * 외부 플랫폼(Notion, Slack 등)의 메타데이터 캐시를 무효화하기 위해
+ * OG 이미지, favicon 등의 경로에 버전 파라미터로 추가됩니다.
+ */
+export const ASSET_VERSION =
+  process.env.NEXT_PUBLIC_ASSET_VERSION || 'sipe-5th';
diff --git a/src/libs/constants/metadata.ts b/src/libs/constants/metadata.ts
@@ -1,8 +1,10 @@
 import { Metadata } from 'next';
 
+import { ASSET_VERSION } from './assetVersion';
+
 const title = 'SIPE';
 const description = '개발자들이 함께 교류하며 성장하는 IT 커뮤니티';
-const images = ['/assets/logos/og-image.png'];
+const images = [`/assets/logos/og-image.png?v=${ASSET_VERSION}`];
 const defaultURL = process.env.NEXT_PUBLIC_ORIGIN;
 const metadataBase = new URL(defaultURL);
 

Original file line number	Diff line number	Diff line change
`@@ -7,5 +7,6 @@ namespace NodeJS {`
`7`	`7`	`KEY: string;`
`8`	`8`	`NEXT_PUBLIC_GA_MEASUREMENT_ID: string;`
`9`	`9`	`NEXT_PUBLIC_ORIGIN: string;`
	`10`	`+ NEXT_PUBLIC_ASSET_VERSION: string;`
`10`	`11`	`}`
`11`	`12`	`}`