Merge pull request #94 from Duri-Salon/refactor/geocoding

[refactor] google maps geocoding
Duri-Salon · Dec 20, 2024 · a66d824 · a66d824
2 parents d6699dd + b0b8b30
commit a66d824
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 34 deletions.
diff --git a/apps/salon/index.html b/apps/salon/index.html
@@ -20,6 +20,7 @@
   </head>
   <body>
     <div id="app"></div>
+
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/apps/salon/src/components/my/info/OwnerInfo.tsx b/apps/salon/src/components/my/info/OwnerInfo.tsx
@@ -14,10 +14,10 @@ interface OwnerInfoProps {
   shopId: number;
   image: string;
   shopName: string;
-  shopEmail: string;
+  // shopEmail: string;
 }
 
-export const OwnerInfo = ({ image, shopName, shopEmail }: OwnerInfoProps) => {
+export const OwnerInfo = ({ image, shopName }: OwnerInfoProps) => {
   const navigate = useNavigate();
 
   const handleNavigate = () => {
@@ -32,7 +32,6 @@ export const OwnerInfo = ({ image, shopName, shopEmail }: OwnerInfoProps) => {
           <br />
           안녕하세요!
         </Text>
-        <Text>{shopEmail ? shopEmail : 'email'}</Text>
         <Flex justify="flex-start">
           <MoveToPortfolio href="/portfolio">
             내 포트폴리오 보기

diff --git a/apps/salon/src/pages/My/index.tsx b/apps/salon/src/pages/My/index.tsx
@@ -61,7 +61,6 @@ const MyPage = () => {
               shopId={shopProfile.id}
               shopName={shopProfile.name}
               image={groomerProfile.image}
-              shopEmail={groomerProfile.email}
             />
             <Flex direction="column" margin="40px 0 0">
               <Status

diff --git a/apps/salon/src/utils/getGeocoding.ts b/apps/salon/src/utils/getGeocoding.ts
@@ -1,23 +1,29 @@
 import { Coordinates } from '@salon/types';
 import axios from 'axios';
 
-const NAVER_MAP_CLIENT_ID = import.meta.env.VITE_NAVER_MAP_CLIENT_ID;
-const NAVER_MAP_CLIENT_KEY = import.meta.env.VITE_NAVER_MAP_CLIENT_KEY;
+const GOOGLE_MAP_API_KEY = import.meta.env.VITE_GOOGLE_MAP_API_KEY;
 
 /** 도로명주소 -> 위도/경도 */
 export const getGeocoding = async (query: string): Promise<Coordinates> => {
-  const response = await axios.get('/naver-api/map-geocode/v2/geocode', {
-    params: {
-      query: query,
-    },
-    headers: {
-      'x-ncp-apigw-api-key-id': NAVER_MAP_CLIENT_ID,
-      'x-ncp-apigw-api-key': NAVER_MAP_CLIENT_KEY,
-      Accept: 'application/json',
-    },
-  });
-  const { y, x } = response.data.addresses[0];
-  const lat = parseFloat(y);
-  const lon = parseFloat(x);
-  return { lat, lon };
+  try {
+    const response = await axios.get(
+      `https://maps.googleapis.com/maps/api/geocode/json`,
+      {
+        params: {
+          address: query,
+          key: GOOGLE_MAP_API_KEY,
+        },
+      },
+    );
+
+    if (response.data.status !== 'OK') {
+      throw new Error('지오코딩 실패');
+    }
+
+    const { lat, lng } = response.data.results[0].geometry.location;
+    return { lat, lon: lng };
+  } catch (error) {
+    console.error('지오코딩 에러:', error);
+    throw new Error('주소를 검색할 수 없습니다.');
+  }
 };
diff --git a/apps/salon/vercel.json b/apps/salon/vercel.json
@@ -1,9 +1,3 @@
 {
-  "rewrites": [
-    { "source": "/(.*)", "destination": "/" },
-    {
-      "source": "/naver-api/:path*",
-      "destination": "https://naveropenapi.apigw.ntruss.com/:path*"
-    }
-  ]
+  "rewrites": [{ "source": "/(.*)", "destination": "/" }]
 }
diff --git a/apps/salon/vite.config.ts b/apps/salon/vite.config.ts
@@ -19,12 +19,5 @@ export default defineConfig({
   },
   server: {
     port: 3001,
-    proxy: {
-      '/naver-api': {
-        target: 'https://naveropenapi.apigw.ntruss.com',
-        changeOrigin: true,
-        rewrite: (path) => path.replace(/^\/naver-api/, ''),
-      },
-    },
   },
 });
-Original file line number
+Diff line change
@@ Expand Up / @@ -20,6 +20,7 @@ @@
       </head>
       <body>
         <div id="app"></div>
         <script type="module" src="/src/main.tsx"></script>
       </body>
     </html>