Firebase function returning null in Flutter despite running successfully

Question

I've seen very similar questions but I still can't see what's wrong with my code.

I've deployed a Firebase function that I call from my client when pressing a specific button.

// Generate Payment URL
exports.paymentRequest = functions.https.onCall(async (data, context) => {
  const clientAccessToken = data.clientAccessToken;
  const recipientIban = data.recipientIban;
  const recipientName = data.recipientName;
  const paymentDescription = data.paymentDescription;
  const paymentReference = data.paymentReference;
  const productPrice = parseInt(data.productPrice);
  const jsonData = {
    "destinations": [
            {
                "accountNumber": recipientIban,
                "type": "iban"          
            }
        ],
        "amount": productPrice,
        "currency": "EUR",
        "market": "FR",
        "recipientName": recipientName,
        "sourceMessage": paymentDescription,
        "remittanceInformation": {
            "type": "UNSTRUCTURED",
            "value": paymentReference
            },
        "paymentScheme": "SEPA_INSTANT_CREDIT_TRANSFER"
};



axios({
        method: "post",
        url: "https://api.endpoint.com/payment",
        headers: { 
            'Content-Type': 'application/json',
            Accept: 'application/json',
            Authorization: `Bearer ${clientAccessToken}`,},
        data: jsonData,
        })
        .then(response => {
            //handle success
            console.log(response.data);
        
        return response.data;
    })
    .catch(response => {
        //handle error
        console.log(response);
    });
})

And here is my flutter code:

onPressed: () async {
                      HttpsCallable callable = FirebaseFunctions.instance
                          .httpsCallable('PaymentRequest');
                      final resp = await callable.call(
                        <String, dynamic>{
                          'clientAccessToken': 'myToken',
                          'recipientIban': ibanController.text,
                          'recipientName': nameController.text,
                          'paymentDescription': descriptionController.text,
                          'paymentReference': referenceController.text,
                          'productPrice': productPriceController.text
                        },
                      );
                      print("result: ${resp.data}");
}

I do receive a 200 and the full expected API Response body in the Firebase Console (meaning that the console.log(response.data); in my function works), but I always receive a "result: null" in de Flutter console, so it seems like the response.data isn't returned.

I tried adding a return right before axios in my function but it doesn't change anything.

What am I missing?

Thanks

Answer 1

You returning data in axios.then() method. If you made an async function why you not use await but .then() ?

Try like this:

exports.paymentRequest = functions.https.onCall(async (data, context) => {
    const clientAccessToken = data.clientAccessToken;
    const recipientIban = data.recipientIban;
    const recipientName = data.recipientName;
    const paymentDescription = data.paymentDescription;
    const paymentReference = data.paymentReference;
    const productPrice = parseInt(data.productPrice);
    const jsonData = {
        "destinations": [
            {
                "accountNumber": recipientIban,
                "type": "iban"
            }
        ],
        "amount": productPrice,
        "currency": "EUR",
        "market": "FR",
        "recipientName": recipientName,
        "sourceMessage": paymentDescription,
        "remittanceInformation": {
            "type": "UNSTRUCTURED",
            "value": paymentReference
        },
        "paymentScheme": "SEPA_INSTANT_CREDIT_TRANSFER"
    };



    const response = await axios({
        method: "post",
        url: "https://api.endpoint.com/payment",
        headers: {
            'Content-Type': 'application/json',
            Accept: 'application/json',
            Authorization: `Bearer ${clientAccessToken}`,
        },
        data: jsonData,
    })
    console.log(response.data)
    return response.data
})