Invoke a Callable functions

We get a reference to the callable function, and call it like a regular function.

indicate the firebase project

since the client may work with different projects, we must provide the project's ID. We do so by providing the app object which already includes such ID.

indicate the region

A function may be deployed across multiple regions, so the client must specify which regions it wants.

The region identifier we provide must match the one defined in the callable options.

The option defaults to us-central1. If the function lives in europe, we must specify the europe-west1 location.

initialize the functions object

const functions = getFunctions(app, "europe-west1")

synthesize a caller function

We synthesize it through the httpsCallable function.

const requestPokemon = httpsCallable<ReqData, ResData>(functions, "requestPokemon")

The caller function returns (the promise of) a result, of type HttpsCallableResult<ResData>. It is a wrapper over the data property it embeds. It is not similar in shape and content to a HTTP response.

call and handle the result

we provide a payload, if applicable, of type ReqData

const result = await requestPokemon({ number: 151 })

The response's data, if any, lives in result.data. It has type of ResData

result.data

Alternatively, call it and handle result with then

requestPokemon({ number: 151 })
    .then((result) => {
        result.data
    })
    .catch((error) => {})
earlymorning logo

© 2025 - All rights reserved

Invoke a Callable functions

We get a reference to the callable function, and call it like a regular function.

indicate the firebase project

since the client may work with different projects, we must provide the project's ID. We do so by providing the app object which already includes such ID.

indicate the region

A function may be deployed across multiple regions, so the client must specify which regions it wants.

The region identifier we provide must match the one defined in the callable options.

The option defaults to us-central1. If the function lives in europe, we must specify the europe-west1 location.

initialize the functions object

const functions = getFunctions(app, "europe-west1")

synthesize a caller function

We synthesize it through the httpsCallable function.

const requestPokemon = httpsCallable<ReqData, ResData>(functions, "requestPokemon")

The caller function returns (the promise of) a result, of type HttpsCallableResult<ResData>. It is a wrapper over the data property it embeds. It is not similar in shape and content to a HTTP response.

call and handle the result

we provide a payload, if applicable, of type ReqData

const result = await requestPokemon({ number: 151 })

The response's data, if any, lives in result.data. It has type of ResData

result.data

Alternatively, call it and handle result with then

requestPokemon({ number: 151 })
    .then((result) => {
        result.data
    })
    .catch((error) => {})