Question

我正在使用AngularFire2在Angular应用上设置Firebase Cloud Messaging，以接收和发送通知。但是，当尝试获取用户的当前令牌时，该应用程序将返回错误。

我已经创建了“ firebase-messaging-sw.js”和“ manifest.json”文件来注册服务工作者，并正确添加了所有内容，但没有成功。

我订阅可观察对象的组件。

export class HomeComponent implements OnInit {
  constructor(
    private afMessaging: AngularFireMessaging,
    private afStore: AngularFirestore,
    private afAuth: AngularFireAuth,
  ) {}

  ngOnInit() {
    this.afAuth.user.pipe(
      exhaustMap(
        user => {
          return this.afMessaging.getToken.pipe(
            tap(
              token => {
                console.log(token);
                this.afStore.collection('users').doc(user.uid).update({
                  fcmToken: token
                });
              }
            )
          );
        }
      )
    ).subscribe();
    this.afMessaging.messages
      .subscribe((message) => { console.log(message); });
  }
}

服务人员：

  // Give the service worker access to Firebase Messaging.
  // Note that you can only use Firebase Messaging here, other Firebase libraries
// are not available in the service worker.
importScripts("https://www.gstatic.com/firebasejs/6.3.4/firebase-app.js");
importScripts("https://www.gstatic.com/firebasejs/6.3.4/firebase-messaging.js");

// Initialize the Firebase app in the service worker by passing in the
// messagingSenderId.
firebase.initializeApp({
  messagingSenderId: "231973795174"
});

// Retrieve an instance of Firebase Messaging so that it can handle background
// messages.
const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload) {
  console.log(
    "[firebase-messaging-sw.js] Received background message ",
    payload
  );
  // Customize notification here
  const notificationTitle = "Background Message Title";
  const notificationOptions = {
    body: "Background Message body.",
    icon: "/firebase-logo.png"
  };

  return self.registration.showNotification(
    notificationTitle,
    notificationOptions
  );
});

清单

{
  "name": "App",
  "gcm_sender_id": "103953800507"
}

Angular.json

"assets": [
    "src/favicon.ico",
    "src/assets",
    "src/firebase-messaging-sw.js",
    "src/manifest.json"
 ],

以下是我得到的详细错误：

未捕获（承诺）：FirebaseError：安装：缺少应用程序配置值。（安装/缺少应用配置值）。 FirebaseError：安装：缺少应用程序配置值。（安装/缺少应用配置值）。在extractAppConfig（index.esm.js：89）在Object.factoryMethod [安装时]（index.esm.js：1110）在FirebaseAppImpl.push ../ node_modules/@firebase/app/dist/index.cjs.js.FirebaseAppImpl._getService（index.cjs.js：191）在FirebaseAppImpl.firebaseAppImpl上。 [作为安装]（index.cjs.js：458）在index.esm.js：415 在步骤（tslib.es6.js：99）在Object.next（tslib.es6.js：80）在tslib.es6.js：73 在新的ZoneAwarePromise（zone-evergreen.js：876）在__awaiter（tslib.es6.js：69）在resolvePromise（zone-evergreen.js：797）在zone-evergreen.js：707 在zone-evergreen.js：723 在ZoneDelegate.invoke（zone-evergreen.js：359）在Object.onInvoke（core.js：39698）在ZoneDelegate.invoke（zone-evergreen.js：358）在Zone.run（zone-evergreen.js：124）在zone-evergreen.js：855 在ZoneDelegate.invokeTask（zone-evergreen.js：391）在Object.onInvokeTask（core.js：39679）

Answer 1

您需要在initializeApp调用中填写所有必需的详细信息：

const firebaseConfig = {
apiKey: "",
authDomain: "<your app>.firebaseapp.com",
databaseURL: "https://<your app>.firebaseio.com",
projectId: "<your app>",
storageBucket: "<your app>.appspot.com",
messagingSenderId: "<your sender id>",
appId: "<your app id>",
measurementId: "<your measurement id>"
  };

您可以从Firebase控制台获取这些详细信息。

尝试使用AngularFire的Cloud Messaging Angular模块会抛出缺少的应用程序配置值

1 个答案: