我使用Firebase FCM令牌，并且我想对服务工作进程隐藏键值。但环境变量不适用于...请告诉我解决办法
我想通过onMessage函数接收payload。
这是我现在的代码

// public/firebase-messaging-sw.js
importScripts('https://www.gstatic.com/firebasejs/9.14.0/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/9.14.0/firebase-messaging-compat.js');

// 이곳에 아까 위에서 앱 등록할때 받은 'firebaseConfig' 값을 넣어주세요.
const config = {
  apiKey: "value you want to hide",
  authDomain: "value you want to hide",
  projectId: "value you want to hide",
  storageBucket: "value you want to hide",
  messagingSenderId: "value you want to hide",
  appId: "value you want to hide",
  measurementId: "value you want to hide"
};
 
// Initialize Firebase
firebase.initializeApp(config);
 
const messaging = firebase.messaging();
self.addEventListener('push', function(event) {
  console.log("받은 푸시 데이터를 처리해 알림으로 띄우는 내용")
});
self.addEventListener('notificationclick', function(event) {
  console.log("띄운 알림창을 클릭했을 때 처리할 내용")
});

// /src/components/Message.tsx
import React, { useEffect, useState } from 'react';
import { messageState } from '@/libs/recoilState';
import { initializeApp } from 'firebase/app';
import { getMessaging, getToken, onMessage } from 'firebase/messaging';
import { useRecoilState } from 'recoil';

export interface MessageType {
  title: string;
  reservationId: string;
  description: string;
  [key: string]: string;
}

const Message = () => {
  const [message, setMessage] = useRecoilState<MessageType>(messageState);
  const onMessageFCM = async () => {
    const permission = await Notification.requestPermission();
    if (permission !== 'granted') return;

    const firebaseApp = initializeApp({
      apiKey: process.env.NEXT_PUBLIC_API_KEY,
      authDomain: process.env.NEXT_PUBLIC_AUTH_DOMAIN,
      projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
      storageBucket: process.env.NEXT_PUBLIC_STORAGE_BUCKET,
      messagingSenderId: process.env.NEXT_PUBLIC_MESSAGING_ID,
      appId: process.env.NEXT_PUBLIC_APP_ID,
      measurementId: process.env.NEXT_PUBLIC_MEASUREMENT_ID,
    });

    const messaging = getMessaging(firebaseApp);

    getToken(messaging, {
      vapidKey: process.env.NEXT_PUBLIC_VAPID_KEY,
    })
      .then((currentToken) => {
        if (currentToken) {
          console.log(currentToken);
        } else {
          console.log(
            'No registration token available. Request permission to generate one.',
          );
        }
      })
      .catch((err) => {
        console.log('An error occurred while retrieving token. ', err);
      });

    onMessage(messaging, (payload) => {
      console.log('Message received. ', payload); // I'm trying to get data from here.
      setMessage(payload?.data as MessageType); 
    });
  };

  useEffect(() => {
    onMessageFCM();
  }, []);

  return <></>;
};

export default Message;

我认为配置代码是多余的，所以我删除了service worker的Firebase配置代码，但onMessage功能没有发生。