javascript - 调用 Firebase 函数时，httpsCallable 不是函数

Question

我正在尝试使用 Firebase auth 和 Firebase 函数实现基于角色的身份验证。现在我有一个按预期工作的注册表单，现在我正在尝试添加一个表单，您提交一封电子邮件，该电子邮件调用将向用户附加自定义声明的 Firebase 函数。我已经通过终端将我的函数添加到了 Firebase，并且我正在我的项目中调用函数，但是每当我使用电子邮件提交表单时，我都会收到httpsCallable is not a function错误消息。

这是我的文件：

函数文件夹中的index.js

const functions = require("firebase-functions");
const admin = require("firebase-admin");
admin.initializeApp();

exports.addAdminRole = functions.https.onCall((data, context) => {
  //get user and add custom claim (admin)
  return admin
    .auth()
    .getUserByEmail(data.email)
    .then(user => {
      return admin.auth().setCustomUserClaims(user.uid, {
        admin: true
      });
    })
    .then(() => {
      return {
        message: `Success! ${data.email} has been made admin`
      };
    })
    .catch(err => {
      return err;
    });
});

我的firebaseInit.js配置文件，我在其中调用与 firebase 相关的所有内容

import firebase from "firebase/app";
import "firebase/firestore";
import "@firebase/functions";
import firebaseConfig from "./firebaseConfig";
const firebaseApp = firebase.initializeApp(firebaseConfig);

export const fc = firebase.functions();
export const db = firebase.firestore();
export const fv = firebase.firestore.FieldValue;

export default firebaseApp.firestore();

还有表单所在的Vue组件

<template>
  <div class="home">
    <h3>Welcome to Site</h3>

    <h3>Add user to admin</h3>
    <div class="row">
      <form @submit.prevent="addAdmin()" class="col s12">
        <div class="row">
          <div class="input-field col s12">
            <input id="email" type="email" class="validate" v-model="email" />
            <label for="email">Email</label>
          </div>
        </div>
        <button type="submit" class="btn">Submit</button>
        <router-link to="/members" class="btn grey">Cancel</router-link>
      </form>
    </div>
  </div>
</template>

<script>
import firebase from "firebase/app";
import fc from "../data/firebaseInit";
export default {
  name: "home",
  data() {
    return {
      email: ""
    };
  },
  methods: {
    addAdmin() {
      const addAdminRole = fc.httpsCallable("addAdminRole");
      addAdminRole(this.email).then(result => {
        console.log(result);
      });
    }
  }
};
</script>

有人可以解释为什么我会收到这个错误吗？我是否忘记导入与 firebase 相关的内容？

标签： javascriptfirebasevue.jsgoogle-cloud-functions

Answer 1

你的问题来自这样一个事实

export const fc = firebase.functions();
export const db = firebase.firestore();
export const fv = firebase.firestore.FieldValue;

export default firebaseApp.firestore();

在您的firebaseInit.js文件中，您没有导出fc（fv顺便说一句）

以下应该工作

import firebase from "firebase/app";
import "firebase/firestore";
import "firebase/functions";   // <-- Note that the @ was removed
import firebaseConfig from "./firebaseConfig";
const firebaseApp = firebase.initializeApp(firebaseConfig);

const fc = firebase.functions();
const db = firebase.firestore();
const fv = firebase.firestore.FieldValue;

export { fc, db, fv };

然后，在您的组件中执行以下操作：

import {fc, db, fv} from "../data/firebaseInit";

//....

或以下您只需要fcand db，例如：

import {fc, db} from "../data/firebaseInit";

//....