在 Firebase 客户端应用中实现可调用的云功能 [英] Implement callable cloud functions in Firebase client app

问题描述

我最近发现了 Firebase 可调用函数，它允许我调用 HTTPS 触发器来自客户端的类似功能(并具有 auth() 支持).

I have recently discovered the Firebase callable functions which allows me to call HTTPS trigger like function from the client side (and with auth() support).

我很难在我现有的 Firebase 网络客户端应用程序中实现这一新功能.

I struggle to implement this new feature in my already existing Firebase web-client application.

我有一些云函数正在运行，其中有一些 HTTPS 函数我想转换为 HTTPS 可调用函数(使用 functions.https.onCall).

I have some cloud functions running, among them are some HTTPS functions I would like to transform into an HTTPS callable function (with functions.https.onCall).

文档表明:

Set up your client development environment
<script src="https://www.gstatic.com/firebasejs/4.12.0/firebase.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.12.0/firebase-functions.js"></script>

我的代码是:

import firebase from 'firebase';
import 'firebase/firestore';

const firebaseApp = firebase.initializeApp({
  apiKey: '....',
  authDomain: '....',
  databaseURL: '....',
  projectId: '....',
  storageBucket: '....',
  messagingSenderId: '....',
});

const db = firebaseApp.firestore();
const auth = firebaseApp.auth();
const functions = firebaseApp.functions();

export { db, auth, functions };

当我运行我的应用程序时，出现以下错误:

When I run my app, I got the following error:

Uncaught TypeError: firebaseApp.functions is not a function

我尝试了 yarn add firebase-functions，然后 import 'firebase-functions 但是应用需要 firebase-admin.我担心客户端应用程序太多了，所以我可能会走错方向.

I have tried yarn add firebase-functions and then import 'firebase-functions but then the app requires firebase-admin. I am affraid it is too much for a client-app so I might go in the wrong direction.

有人可以帮我解决这个问题吗?(!) 此问题不是与服务器端 Firebase SDK for Cloud Functions (Node JS) 有关.它是关于直接从 Firebase 网络应用程序调用云函数.谢谢！

Can someone help me with this issue? (!) This issue is NOT about the server-side Firebase SDK for Cloud Functions (Node JS). It is about calling Cloud functions directly from a Firebase web app. Thank you!

更新:感谢@Andrew 的帖子，这解决了我的问题:

UPDATE: Thanks to @Andrew's post, this solves my issue:

我的配置

import firebase from 'firebase';
import 'firebase/firestore';
import '@firebase/functions';
import firestoreConfig from '@/config/firestore';

const firebaseApp = firebase.initializeApp(firestoreConfig /* The JSON configuration from my Firebase project */);

const db = firebaseApp.firestore();
const auth = firebaseApp.auth();
const functions = firebaseApp.functions();

export { db, auth, functions };

使用配置:

import { db, functions } from '@/database/firestoreInit';

export default {
  addMessage(text) {
    const addMessage = functions.httpsCallable('addMessage');
    return addMessage({ text }).then(result => result);
  },
}

推荐答案

我自己也遇到了同样的问题，通过安装和导入 @firebase/functions npm 包解决了这个问题.我在这里找到了github上的解决方案:https://github.com/firebase/firebase-js-sdk/blob/master/packages/functions/README.md

I just ran into this same problem myself and solved it by installing and importing the @firebase/functions npm package. I found the solution on github here: https://github.com/firebase/firebase-js-sdk/blob/master/packages/functions/README.md

来自 github 上的 README:

From the README on github:

ES 模块

import firebase from '@firebase/app';
import '@firebase/functions'
// Do stuff w/ `firebase` and `firebase.functions`

CommonJS 模块

const firebase = require('@firebase/app').default;
require('@firebase/functions');

// Do stuff with `firebase` and `firebase.functions`

希望对您有所帮助！实际的文档并不太清楚必须这样做才能调用函数.

Hope that helps! The actual documentation is not very clear about having to do this in order to call the functions.

这篇关于在 Firebase 客户端应用中实现可调用的云功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！