The 'data' property is not found on the type '() => DocumentData'

Recently, I dove into the world of Firebase Cloud Functions and stumbled upon this source code https://github.com/AngularFirebase/93-fcm-ionic-demo/blob/master/functions/src/index.ts. After ensuring all necessary dependencies were installed for my project, I encountered an error when attempting to use event.data.data(). Here's a snippet of my code:

import * as admin from 'firebase-admin';
admin.initializeApp(functions.config().firebase);


exports.newSubscriberNotification = functions.firestore
.document('subscribers/{subscriptionId}')
.onCreate(async event => {

const data = event.data.data();

const userId = data.userId
const subscriber = data.subscriberId

// Notification content
const payload = {
    notification: {
        title: 'New Subscriber',
        body: `${subscriber} is following your content!`,

    }
}

// Reference to the parent document
const db = admin.firestore()
const devicesRef = db.collection('devices').where('userId', '==', userId)


// Get users tokens and send notifications
const devices = await devicesRef.get()

const tokens = []

devices.forEach(result => {
    const token = result.data().token;

   tokens.push( token )
})

return admin.messaging().sendToDevice(tokens, payload)

The issue seems to be centered around const data= event.data.data(). I'm confident that this is the correct way to utilize it, but I am unable to deploy my function due to this error. I've verified that both package.json files (the one in my root project folder and the one in the functions folder) are up to date with the latest cloud functions version. Any insights on what might be causing this setback would be greatly appreciated.

Answer №1

The cloud services have been recently updated, resulting in significant changes.

As a result, it is necessary to modify the code snippet below:

exports.newSubscriberNotification = functions.firestore.document('subscribers/{subscriptionId}').onCreate((snap,context) => {
  
const data = snap.data();

For more detailed information, please visit:

https://firebase.google.com/docs/functions/beta-v1-diff#cloud-firestore

Answer №2

I encountered a similar problem where everything appeared to be up to date, but I kept receiving an error when trying to deploy the project. After some troubleshooting, I found that adding "strict": false in the tsconfig.json under "compilerOptions" resolved the issue for me. Hopefully, this solution can assist others who come across the same issue.

Answer №3

Here is a sample code snippet:

const userDetails = userInfoDoc.data();
if (userDetails) {
  const { firstName, lastName } = userDetails;
}

Ensure you are verifying that the value is not undefined

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Issues encountered when trying to use the export default syntax in Vue components

Programming Issue I attempted to execute the provided code, but unfortunately, it does not work and no output is visible in the browser. Is there an alternative method for writing code within <scripts setup> </script>? I have understood that f ...

Incorporating unique components dynamically using a loop in React

As I delve deeper into learning React and experimenting with some basic concepts, I have encountered a seemingly straightforward issue that has left me stumped. Despite my best efforts to search for a solution online, I have come up empty-handed. The crux ...

Utilizing Knockout JS: How to effectively bind an entire object instead of separate values

This code snippet adds a checkbox next to each item in a list. When the checked status is changed, it will add or remove that value from the SelectedItems array: <script type="text/x-jquery-tmpl" id="tmpl"> <input name="cSelect" t ...

Facing a problem with the execution of the Lightence Ant Design React Template

As a beginner in reactJS, I am attempting to utilize lightence-ant-design. https://github.com/altence/lightence-ant-design-react-template/tree/main According to the instructions on GitHub, I followed the steps below: To ensure compatibility with the lates ...

How to link observables in HTTP requests using Angular 5?

I'm currently developing an application using Angular 5, and I want to segregate raw http calls into their own services so that other services can modify the responses as needed. This involves having a component, component service, and component data ...

Mobile devices are not compatible with the canvas

After developing an application with Ionic Framework, I incorporated canvas for image cropping. The functionality worked seamlessly on my browser. However, when testing the app on a mobile device, I encountered issues: Does anyone have insight into why t ...

Completing a form and reloading the page without including the reload in the browsing history

I am currently developing a compact web application using Flask, and I have encountered a challenging issue with navigating back to the previous page. Here are some approaches I have experimented with: Avoiding navigation away from the page - content ...

What could be the reason behind the repeated console messages when utilizing jquery to replace the src attribute of images?

Overview: An HTML page with two images, identified as #me1 and #me2 The images initially display 1.jpg and 2.jpg Clicking #me1 triggers a GET request to "randim.php" using jQuery to fetch a random filename, which is then set as the src= attribute ...

Align the image at the center of the screen with an overlay

Whenever an image is clicked, a lightbox appears. Currently, the image overlay is positioned at the top of the screen, but ideally, it should be centered on the user's screen. See the code snippet below: // The following script creates a lightbo ...

Inject the code snippet from CodePen into a WordPress webpage

I have a WordPress page where I want to integrate the HTML, CSS and JS code from my Codepen project. The styling appears to be working correctly, but the JavaScript is not functioning as expected. You can view the page here: Could someone assist me in pr ...

Guide for adding a record to sqlexpress with javascript on aspx pages

Does anyone know how to use JavaScript in an ASPX file to insert a record into SQLExpress? ...

Using JQuery to apply span elements to images

Struggling to create a Pinterest-like webpage using masonry.js? Having trouble appending unique descriptions to each image in your code? You're not alone. The last line of the code seems to be causing issues, but the solution isn't clear. By cons ...

Revise the content within the table cell

Running the following code using server push: $('tr[name=' + device + ']').find("td[id='status']").text('STARTED'); When attempting to access the element's id, it returns the correct value. $('tr[name=& ...

Tips for merging two regular expressions for JavaScript validation

function checkparagraph(obj) { var paragraphContent = obj.value; var sequenceOfNumbers = /\d{4}/; if (paragraphContent.match(sequenceOfNumbers)) { document.getElementById("error_message").innerHTML = " You can't use numbers in the des ...

Lambda Expression failing to function correctly

I'm struggling to set a value to an array within an Observable using a Lambda expression. Here is a snippet of my class: usuarios: Usuario[]; Currently, I am utilizing an Http service for injection. Within one of my functions, I have the following ...

Firebase has flagged the Google Authentication process with a message stating: Entry denied: The request made by this application

I have connected my domain to Firebase authentication and granted authorization for authentication access. If you want to test it out, feel free to visit this link signInWithPopup(auth, provider) .then((result) => { // This provides a Google Acc ...

Importing classes in ECMAScript 6 does not work properly, causing issues when running scripts

I am currently learning Selenium Webdriver. I am facing an issue where I can't run a script with imported classes, but I am able to run it without classes using import functions only. To execute it, I use babel-cli in the following manner: node ./babe ...

Warning Notification in Opencart Design

Currently, I am working on an OpenCart project that is nearing completion. One issue that I am facing is that whenever a user clicks on another tab, Java displays an alert containing an error message. This seems to be happening due to slow internet speed ...

I encountered an issue while trying to send data from a React.js application to PHP using Axios. However,

I am utilizing react.js, axios, and PHP to transmit data to a MySQL database Below is my react.js code snippet sendData(){ var data = new FormData(); data.append('name', 'jessie'); data.append('time', '12:00'); dat ...

The bundle.js file encountered an issue while running UglifyJs, expecting a name

I have been attempting to utilize UglifyJS to compress/minimize my bundle.js file. However, when executing webpack -p, I encountered the following error message: ERROR in bundle.js from UglifyJs Name expected [bundle.js:105519,6] The line causing the iss ...