Firebase Cloud Messaging报错：getMessaging未定义及send方法问题求助

已完成Android端APP开发，目前搭建网页用于通过Firebase Messaging发送通知至该APP，现有network.js和script.js文件如下，运行时出现三类错误：

1. Uncaught ReferenceError: getMessaging is not defined
2. 调用messaging.send()时提示Uncaught TypeError: messaging.send is not a function
3. 尝试messaging.getMessaging().send时提示Uncaught TypeError: messaging.getMessaging is not a function

附代码文件：

network.js #

import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.1/firebase-app.js";
import {
  getMessaging,
  getToken,
} from "https://www.gstatic.com/firebasejs/9.22.1/firebase-messaging.js";

const firebaseConfig = {
  // 包含Firebase项目的所有信息及密钥
};

const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
const getData = getDatabase(app);
const messaging = getMessaging(app);

export { messaging, getToken };

script.js #

import { messaging , getToken } from "./network.js"

const topic = "cozinha";

const message = {
  notification: {
    title: "Test Title",
    body: "Test Body example text",
  },
  topic: topic,
};

getMessaging()
  .send(message)
  .then((response) => {
    console.log("Successfully sent message:", response);
  })
  .catch((error) => {
    console.log("Error sending message:", error);
  });

错误原因梳理 #

1. getMessaging is not defined：script.js中调用了getMessaging()但未导入该方法，且前端SDK根本不支持用此方式发送消息。
2. send方法不存在：Firebase网页端Messaging SDK仅负责接收消息、获取设备令牌，没有提供发送消息的send方法——发送消息属于服务端权限，前端直接调用会触发安全限制。

完整修复方案 #

1. 清理前端network.js代码

移除未使用的getAnalytics、getDatabase导入，保留核心初始化逻辑：

import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.1/firebase-app.js";
import { getMessaging, getToken } from "https://www.gstatic.com/firebasejs/9.22.1/firebase-messaging.js";

const firebaseConfig = {
  // 你的Firebase项目配置
};

const app = initializeApp(firebaseConfig);
const messaging = getMessaging(app);

export { messaging, getToken };

2. 搭建后端发送接口（Node.js示例）

发送FCM消息必须通过服务端实现，这里用Node.js + Firebase Admin SDK编写示例接口：

const admin = require("firebase-admin");
const express = require("express");
const serviceAccount = require("./serviceAccountKey.json"); // 从Firebase控制台下载的服务端密钥文件

// 初始化Admin SDK
admin.initializeApp({
  credential: admin.credential.cert(serviceAccount)
});

const app = express();
app.use(express.json());

// 定义发送通知的接口
app.post("/send-notification", async (req, res) => {
  const { topic, title, body } = req.body;
  const message = {
    notification: { title, body },
    topic: topic
  };

  try {
    const response = await admin.messaging().send(message);
    res.status(200).json({ success: true, response });
  } catch (error) {
    res.status(500).json({ success: false, error: error.message });
  }
});

app.listen(3000, () => console.log("服务运行在端口3000"));

3. 修改前端script.js调用后端接口

前端不再直接操作FCM发送逻辑，改为调用后端接口：

import { messaging, getToken } from "./network.js";

const topic = "cozinha";
const messageData = {
  topic: topic,
  title: "Test Title",
  body: "Test Body example text"
};

// 调用后端发送接口
fetch("http://localhost:3000/send-notification", {
  method: "POST",
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify(messageData)
})
.then(res => res.json())
.then(data => {
  data.success 
    ? console.log("消息发送成功:", data.response) 
    : console.log("消息发送失败:", data.error);
})
.catch(error => console.log("请求出错:", error));

关键注意事项 #

• 服务端的serviceAccountKey.json必须妥善保管，绝对不能暴露到前端代码中。
• 前端Messaging SDK仅用于客户端接收消息、获取设备令牌，所有发送操作必须通过服务端完成。

内容的提问来源于stack exchange，提问作者Tiago Silva