Merge pull request #258 from SCBJ-7/feature/#257-fix-notify

[#257] 알림 허용 안 할 시 fcm토큰 발급 요청 안되도록 수정

src/apis/fetchLogin.ts

@@ -7,7 +7,7 @@ import { axiosInstance } from "./axiosInstance";
 interface LoginProps {
   email: string;
   password: string;
-  fcmToken: string;
+  fcmToken?: string;
 }
 
 export const postLogin = async ({

src/firebase.ts

@@ -1,4 +1,5 @@
 import { initializeApp } from "firebase/app";
+import { getMessaging } from "firebase/messaging";
 
 // firebase
 const firebaseConfig = {
@@ -12,6 +13,7 @@ const firebaseConfig = {
 };
 
 export const app = initializeApp(firebaseConfig);
+export const messaging = getMessaging(app);
 
 // Get registration token. Initially this makes a network call, once retrieved
 // subsequent calls to getToken will return from cache.

src/pages/signInPage/SignIn.tsx

@@ -5,8 +5,7 @@ import useToastConfig from "@hooks/common/useToastConfig";
 import { PATH } from "@constants/path";
 import { useUserInfoStore } from "@/store/store";
 import { postLogin } from "@apis/fetchLogin";
-import { getMessaging, getToken } from "firebase/messaging";
-import { app } from "@/firebase";
+import getNotificationPermission from "@/utils/getNotificationPermission";
 
 type FormValues = {
   email: string;
@@ -33,11 +32,7 @@ const SignIn = () => {
   const handleOnSubmit = async (data: FormValues) => {
     const { email, password } = data;
 
-    const messaging = getMessaging(app);
-
-    const fcmToken = await getToken(messaging, {
-      vapidKey: import.meta.env.VITE_FIREBASE_VAPID,
-    });
+    const fcmToken = await getNotificationPermission();
 
     await postLogin({ email, password, fcmToken })
       .then((loginData) => {

src/utils/getNotificationPermission.ts

@@ -0,0 +1,29 @@
+import { messaging } from "@/firebase";
+import { getToken, onMessage } from "firebase/messaging";
+
+async function getNotificationPermission() {
+  console.log("권한 요청 중...");
+
+  const permission = await Notification.requestPermission();
+  if (permission === "denied") {
+    console.log("알림 권한 허용 안됨");
+    return;
+  }
+
+  console.log("알림 권한이 허용됨");
+
+  const fcmToken = await getToken(messaging, {
+    vapidKey: import.meta.env.VITE_FIREBASE_VAPID,
+  });
+
+  if (fcmToken) console.log("token: ", fcmToken);
+  else console.log("Can not get Token");
+
+  onMessage(messaging, (payload) => {
+    console.log("메시지가 도착했습니다.", payload);
+  });
+
+  return fcmToken;
+}
+
+export default getNotificationPermission;