diff --git a/apps/sn/app/oper/floodPre/page.tsx b/apps/sn/app/oper/floodPre/page.tsx
index c9686fcd6..66dfdc28f 100644
--- a/apps/sn/app/oper/floodPre/page.tsx
+++ b/apps/sn/app/oper/floodPre/page.tsx
@@ -22,6 +22,35 @@ const Page = () => {
     const [usr, setUsr] = useState('')
     const [pjNm, setpjNm] = useState('')
     // TODO: 초기값 세팅필요
+    const handleDownload = async () => {
+        try {
+          const response = await fetch('/sn/attach-service/api/v1/download/6066b08c-2a55-438c-b8ff-2aed9739a0c6', {
+            method: 'GET',
+          });
+    
+          if (!response.ok) {
+            throw new Error('파일 다운로드 실패');
+          }
+    
+          const blob = await response.blob();
+          const url = window.URL.createObjectURL(blob);
+    
+          // 다운로드를 트리거할 가짜 <a> 태그 생성
+          const link = document.createElement('a');
+          link.href = url;
+          link.download = 'test.jpg'; // 원하는 파일명 지정
+          document.body.appendChild(link);
+          link.click();
+    
+          // 메모리 해제
+          link.remove();
+          window.URL.revokeObjectURL(url);
+        } catch (error) {
+          console.error('다운로드 중 오류 발생:', error);
+        }
+    };
+
+
     return (
         <ContentLayout title='도시침수 예방사업'>
             <SearchDiv>
@@ -78,7 +107,7 @@ const Page = () => {
                     <h3 className="text-2xl font-medium">사업정보 등록현황</h3>
                     <div>
                         <Button className="px-4 py-2 !mr-[1.2rem] bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700" size="sm" >파일 다운로드</Button>
-                        <Button className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700 !mr-[1.2rem]" size="sm" >삭제</Button>
+                        <Button className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700 !mr-[1.2rem]" size="sm" onClick={handleDownload} >삭제</Button>
                     </div>
                 </div>
                 <UiTable headName='' tableData={tableData} headlist={tableHeadlist} pageSize={10} total={10} children={undefined} cellClick={() => { }} onPageChange={function (page: number): void {
diff --git a/apps/sn/next.config.ts b/apps/sn/next.config.ts
index bc9505fef..12162c0a0 100644
--- a/apps/sn/next.config.ts
+++ b/apps/sn/next.config.ts
@@ -1,7 +1,9 @@
 import type { NextConfig } from "next";
 import webpack from "webpack";
 
-const geoserverUrl = process.env.NEXT_PUBLIC_GEOSERVER_URL?.replace(/\/$/, '') ?? '';
+const geoServerUrl = process.env.NEXT_PUBLIC_GEOSERVER_URL?.replace(/\/$/, '') ?? '';
+const cnServerUrl = process.env.NEXT_PUBLIC_SERVER_API_URL?.replace(/\/$/, '') ?? '';
+
 
 const nextConfig: NextConfig = {
   basePath: "/sn",
@@ -46,7 +48,11 @@ const nextConfig: NextConfig = {
     return [
       {
         source: '/geoserver/:hasudo*',
-        destination: `${geoserverUrl}/:hasudo*`,        
+        destination: `${geoServerUrl}/:hasudo*`,        
+      },
+      {
+        source: '/attach-service/:path*',
+        destination: `${cnServerUrl}/attach-service/:path*`,        
       },
     ];
   },