Error: deadline-exceeded when working with firebase cloud functions

Question

I have written a small contact form, that calls a firebase cloud function to store the request to cloud firestore. Everything works fine, except that after 60seconds the website throws the following error:

Error: deadline-exceeded

I used this reference:https://github.com/firebase/quickstart-js/blob/7d514fb4700d3a1681c47bf3e0ff0fa3d7c91910/functions/functions/index.js

This is my cloud function:

exports.newRequest = functions.https.onCall((data, context) => {
  return admin
    .firestore()
    .collection("requests")
    .add(data)
    .then(ref => {
        console.log(`New request written. ${ref}`)
        return ref.id
    })
    .catch(err => {
      throw new functions.https.HttpsError("unknown", error.message, error)
    })
})

This is the function call:

const functions = firebase.functions()
    const addMessage = functions.httpsCallable(`newRequest`)
    addMessage({
      name: name,
      contact: contact,
      message: message,
      timestamp: new Date(Date.now()).toLocaleString(),
    })
      .then(result => {
        console.log(`Cloud function called successfully. Ref: ${result.data}`)
      })
      .catch(error => {
        // Getting the Error details.
        var code = error.code
        var message = error.message
        var details = error.details
        console.log(code, message, details)
      })

Does anybody know how to fix this?

Edit:

Here is the cloud function log:

7:19:33.751 PM newRequest Function execution started
7:19:33.751 PM newRequest Billing account not configured. External network is not accessible and quotas are severely limited. Configure billing account to remove these restrictions
7:19:33.755 PM newRequest Function execution took 5 ms, finished with status code: 204
7:19:33.896 PM newRequest Function execution started
7:19:33.896 PM newRequest Billing account not configured. External network is not accessible and quotas are severely limited. Configure billing account to remove these restrictions
7:19:34.744 PM newRequest New request written. [object Object]
7:19:34.746 PM newRequest Function execution took 851 ms, finished with status code: 200

My setup in detail:

• I got a gatsby page, where I init firebase.

import * as firebase from "firebase/app"
const firebaseConfig = {}
useEffect(() => {
    if (!firebase.apps.length) {
      firebase.initializeApp(firebaseConfig)
    } else {
      console.log(firebase.apps)
    }
  })

• I got a contact form react component with the following handleSubmit method.

import * as firebase from "firebase/app"
import "firebase/functions"

const handleSubmit = evt => {
    evt.preventDefault()
    const addMessage = firebase.functions().httpsCallable(`newRequest`)
    addMessage({
      name: name,
      contact: contact,
      message: message,
      timestamp: new Date(Date.now()).toLocaleString(),
    })
      .then(result => {
        console.log(`Cloud function called successfully. Ref: ${result.data}`)
      })
      .catch(error => {
        // Getting the Error details.
        var code = error.code
        var message = error.message
        var details = error.details
        console.log(code, message, details)
      })
    resetName()
    resetContact()
    resetMessage()
  }

This is what the chrome dev tools say:

Exception: Error: deadline-exceeded at new HttpsErrorImpl (http://localhost:8000/commons.js:4409:28) at http://localhost:8000/commons.js:4715:20
code: "deadline-exceeded"
details: undefined
message: "deadline-exceeded"
stack: "Error: deadline-exceeded↵    at new HttpsErrorImpl (http://localhost:8000/commons.js:4409:28)↵    at http://localhost:8000/commons.js:4715:20"
__proto__: Error

And this is the promise creator:

/**
 * Returns a Promise that will be rejected after the given duration.
 * The error will be of type HttpsErrorImpl.
 *
 * @param millis Number of milliseconds to wait before rejecting.
 */
function failAfter(millis) {
    return new Promise(function (_, reject) {
        setTimeout(function () {
            reject(new HttpsErrorImpl('deadline-exceeded', 'deadline-exceeded'));
        }, millis);
    });
}

I'm experiencing this problem since several days now and I don't know where it is comming from :(

Answer 1

3 years later! I got this error also on a long running (e.g. 2 mins) firebase function, also using HttpsCallable like the OP

FirebaseError functions/deadline-exceeded

I fixed it by making 2 changes:

(1) increase the firebase function timeout on the server as follows:

exports.myFunction = functions.runWith({
  timeoutSeconds: 540
}).https.onCall(async (data: any) => {
  return await myFunction(data)
})

OR

alternatively you can manually set the firebase function timeout via the GCP console at https://console.cloud.google.com/functions/list?project=YOUR-PROJECT

click the function name and click edit and you can increase the timeout there

(2) set the HttpsCallableOptions timeout option:

const functions: Functions = getFunctions()
const options: HttpsCallableOptions = { timeout: 530 * 1000 } // slightly less than the 540 seconds BE timeout
const callable: HttpsCallable = httpsCallable(functions, 'flowPlayerExists', options)
const promise: Promise<HttpsCallableResult> = callable({ id })

I had to make BOTH these changes to get it to work!

Answer 2

Is it "useEffect" from React Hooks ?

If yes, your firebase init (in useEffect) is done every render.

If you want that useEffect apply only once (like componentDidMount) you should pass an empty array in second param.

useEffect(() => {
    if (!firebase.apps.length) {
      firebase.initializeApp(firebaseConfig)
    } else {
      console.log(firebase.apps)
    }
}, []);