Development

src/api/auth/request.ts

@@ -1,30 +1,27 @@
-import http from "../instance";
+import http from '../instance'
 
-import type { SignInRequest, SignInResponse } from "../../type/auth";
+import type { SignInRequest, SignInResponse } from '../../type/auth'
 
 // API 엔드포인트
 const AUTH_API = {
-  BASE: "/auth",
-  SIGN_IN: "/admin/sign-in",
-};
+  BASE: '/auth/admin/sign-in',
+}
 
 // API 함수들
 export const authApi = {
-
   // 로그인
-  signIn: async (
-    data: SignInRequest
-  ): Promise<SignInResponse> => {
+  signIn: async (data: SignInRequest): Promise<SignInResponse> => {
     try {
       const response = await http.post<SignInResponse>({
-        url: AUTH_API.BASE + AUTH_API.SIGN_IN,
+        url: AUTH_API.BASE,
         data,
         useAuth: false,
-      });
-      return response;
-    } catch {
+      })
+      return response
+    } catch (error) {
+      console.log(error)
       // TODO : responseCode 분기
-      throw new Error("로그인 실패");
+      throw new Error('로그인 실패')
     }
-  }
-}
+  },
+}

src/page/resume/[id]/component/pdf-viewer/index.tsx

@@ -6,8 +6,7 @@ import { Document, Page, pdfjs } from 'react-pdf'
 import { Spinner } from '@/shared/component/spinner'
 import { cn } from '@/shared/lib/util'
 
-pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;
-
+pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`
 
 type Props = {
   className?: string
@@ -26,7 +25,7 @@ export const PDFViewer = ({ filePath, className, width = 800 }: Props) => {
     <div className={cn('flex h-full w-full flex-col', className)}>
       <div className="relative flex-1 overflow-auto">
         <Document
-          file={`http://localhost:3000/cdn/${filePath}`}
+          file={`/cdn/${filePath}`}
           onLoadSuccess={handleDocumentLoadSuccess}
           className="flex flex-col items-center"
           loading={<Spinner />}

vercel.json

@@ -1,9 +1,33 @@
 {
+  "headers": [
+    {
+      "source": "/api/(.*)",
+      "headers": [
+        {
+          "key": "Access-Control-Allow-Origin",
+          "value": "https://www.dev.admin.plus82.co"
+        },
+        {
+          "key": "Access-Control-Allow-Methods",
+          "value": "GET, POST, OPTIONS"
+        },
+        {
+          "key": "Access-Control-Allow-Headers",
+          "value": "Content-Type, Authorization"
+        },
+        { "key": "Access-Control-Allow-Credentials", "value": "true" }
+      ]
+    }
+  ],
   "rewrites": [
     {
       "source": "/api/:path*",
       "destination": "https://dev.back.plus82.co/api/:path*"
     },
-    { "source": "/(.*)", "destination": "/" }
+    {
+      "source": "/cdn/:path*",
+      "destination": "https://d1zl1w0yhwh5x4.cloudfront.net/:path*"
+    },
+    { "source": "/(.*)", "destination": "/index.html" }
   ]
 }

vite.config.ts

@@ -1,13 +1,13 @@
-import react from "@vitejs/plugin-react";
-import { defineConfig } from "vite";
-import svgr from "vite-plugin-svgr";
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vite'
+import svgr from 'vite-plugin-svgr'
 
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react(), svgr()],
   resolve: {
     alias: {
-      "@": "/src",
+      '@': '/src',
     },
   },
   server: {
@@ -19,8 +19,9 @@ export default defineConfig({
       '/cdn': {
         target: `https://d1zl1w0yhwh5x4.cloudfront.net`,
         changeOrigin: true,
+        rewrite: path => path.replace(/^\/cdn/, ''),
       },
     },
     port: 3000,
   },
-});
+})