[Hotfix] Demo Video 및 배포계 변경 사항 병합

public/_redirects

@@ -0,0 +1,2 @@
+/api/ors/v2/directions/foot-walking/geojson  http://112.162.84.70:8003/ors/v2/directions/foot-walking/geojson  200!
+/* /index.html 200

src/apis/walk/reportMember.ts

@@ -0,0 +1,40 @@
+import { AxiosError } from 'axios'
+import { APIResponse, ErrorResponse } from '~types/api'
+import { axiosInstance } from '~apis/axiosInstance'
+
+export type ReportMemberRequest = {
+  receiverId: number
+  reason: string
+}
+
+export type ReportMemberResponse = {}
+
+export const reportMember = async (req: ReportMemberRequest): Promise<APIResponse<ReportMemberResponse>> => {
+  try {
+    const { data } = await axiosInstance.post<APIResponse<ReportMemberResponse>>(`/reports`, req)
+    return data
+  } catch (error) {
+    if (error instanceof AxiosError) {
+      const { response } = error as AxiosError<ErrorResponse>
+
+      if (response) {
+        const { code, message } = response.data
+        switch (code) {
+          case 400:
+            throw new Error(message || '잘못된 요청입니다.')
+          case 401:
+            throw new Error(message || '인증에 실패했습니다.')
+          case 500:
+            throw new Error(message || '서버 오류가 발생했습니다.')
+          default:
+            throw new Error(message || '알 수 없는 오류가 발생했습니다.')
+        }
+      }
+      // 요청 자체가 실패한 경우
+      throw new Error('네트워크 연결을 확인해주세요')
+    }
+
+    console.error('예상치 못한 에러:', error)
+    throw new Error('다시 시도해주세요')
+  }
+}

src/pages/HomePage/index.tsx

@@ -19,6 +19,7 @@ import NotificationModal from '~modals/NotificationModal'
 import { useModalStore } from '~stores/modalStore'
 import * as S from './styles'
 import { getParticle } from '~utils/getParticle'
+import { useNavigate } from 'react-router-dom'
 
 function HomeContent() {
   const {
@@ -29,6 +30,7 @@ function HomeContent() {
   const unreadNotificationCount = notificationListPages.reduce((count, page) => {
     return count + page.data.content.filter(noti => noti.isRead === 'FALSE').length
   }, 0)
+  const navigate = useNavigate()
 
   return (
     <>
@@ -83,7 +85,7 @@ function HomeContent() {
           </S.WalkDistance>
         </S.WalkInfoWrapper>
       </S.WalkInfoArea>
-      <ActionButton $fontWeight='700' $type='roundedRect'>
+      <ActionButton $fontWeight='700' $type='roundedRect' onClick={() => navigate('/walk')}>
         산책 시작하기
       </ActionButton>
     </>

src/pages/WalkPage/components/MapComponent/index.tsx

@@ -22,7 +22,7 @@ import { useMutation } from '@tanstack/react-query'
 import { fetchWalkComplete } from '~apis/walk/fetchWalkComplete'
 import WalkModal from '~pages/WalkPage/components/WalkModal'
 
-const ORS_API_URL = '/ors/v2/directions/foot-walking/geojson'
+// const ORS_API_URL = '/ors/v2/directions/foot-walking/geojson'
 
 const getGeoOptions = () => ({
   enableHighAccuracy: true,
@@ -919,9 +919,23 @@ export default function MapComponent({ isModalOpen = false, setNearbyWalkers }:
     try {
       const coordinates = positions.map(pos => [pos.lng, pos.lat])
 
-      const response = await axios.post(ORS_API_URL, {
-        coordinates: coordinates,
-      })
+      const response = await axios.post(
+        '/api/ors/v2/directions/foot-walking/geojson',
+        {
+          coordinates: coordinates,
+        },
+        {
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          // 프록시 요청임을 명시
+          proxy: {
+            protocol: 'http',
+            host: '112.162.84.70',
+            port: 8003,
+          },
+        }
+      )
 
       if (!response.data.features?.[0]?.properties?.segments?.[0]?.distance) {
         console.log('유효한 경로를 찾을 수 없습니다')

vite.config.ts

@@ -11,20 +11,36 @@ import tsconfigPaths from 'vite-tsconfig-paths'
 export default defineConfig(({ mode }) => {
   return {
     server: {
-      port: 3000,
-      strictPort: true,
       proxy: {
-        '^/ors/v2/directions/.*': {
+        '/api/ors': {
           target: 'http://112.162.84.70:8003',
           changeOrigin: true,
           secure: false,
-          rewrite: path => path,
-          configure: (proxy, options) => {
-            proxy.on('error', (err, req, res) => {
+          rewrite: path => path.replace(/^\/api\/ors/, '/ors'),
+          headers: {
+            'Access-Control-Allow-Origin': '*',
+            'Access-Control-Allow-Methods': 'GET,HEAD,PUT,PATCH,POST,DELETE',
+            'Access-Control-Allow-Headers': 'Content-Type,Authorization',
+          },
+          configure: (proxy, _options) => {
+            proxy.on('error', (err, _req, _res) => {
               console.log('프록시 에러:', err)
             })
-            proxy.on('proxyReq', (proxyReq, req, res) => {
-              console.log('프록시 요청:', proxyReq.path)
+            proxy.on('proxyReq', (proxyReq, req, _res) => {
+              // POST 요청의 경우 content-length 헤더 재설정
+              if (req.method === 'POST') {
+                let bodyData = ''
+                req.on('data', chunk => {
+                  bodyData += chunk.toString()
+                })
+                req.on('end', () => {
+                  if (bodyData) {
+                    proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData))
+                    proxyReq.setHeader('Content-Type', 'application/json')
+                    proxyReq.write(bodyData)
+                  }
+                })
+              }
             })
           },
         },