Home
Button Mobile Webdesign em Foco
Newsletter Webdesign em Foco
Support Webdesign em Foco
Contribuition Webdesign em Foco
Doe para a Webdesign em Foco
Suporte da Webdesign em Foco
Fechar

Meu Primeiro App com React Native - #29 Enviando Notificações Push

27/10/2020

Nesse tutorial continuaremos a trabalhar com push notificações com React Native, fazendo o envio das notificações para os celulares dos usuários.

Enviando mensagens push com Javascript

Vamos iniciar instalando o SDK do Node para envio de mensagens push.

npm install --save expo-server-sdk

Controller.js

Vamos importar o SDK no Controller e criar a instância dele. Vamos criar também a rota notifications:

const {Expo} = require('expo-server-sdk');
let expo = new Expo();

//Envio das notificações
app.get('/notifications',async (req,res)=>{
    let messages = [];
    let somePushTokens=[];

    let response=await token.findAll({
        raw: true
    });
    response.map((elem,ind,obj)=>{
       somePushTokens.push(elem.token);
    });

    for (let pushToken of somePushTokens) {

        if (!Expo.isExpoPushToken(pushToken)) {
            console.error(`Push token ${pushToken} is not a valid Expo push token`);
            continue;
        }

        messages.push({
            to: pushToken,
            sound: 'default',
            title: 'WefLog',
            body: 'Bem vindo ao nosso app!',
            data: { withSome: 'data' },
        })
    }
    let chunks = expo.chunkPushNotifications(messages);
    let tickets = [];
    (async () => {
        for (let chunk of chunks) {
            try {
                let ticketChunk = await expo.sendPushNotificationsAsync(chunk);
                console.log(ticketChunk);
                tickets.push(...ticketChunk);
            } catch (error) {
                console.error(error);
            }
        }
    })();
    let receiptIds = [];
    for (let ticket of tickets) {
        if (ticket.id) {
            receiptIds.push(ticket.id);
        }
    }

    let receiptIdChunks = expo.chunkPushNotificationReceiptIds(receiptIds);
    (async () => {
        for (let chunk of receiptIdChunks) {
            try {
                let receipts = await expo.getPushNotificationReceiptsAsync(chunk);
                console.log(receipts);

                for (let receiptId in receipts) {
                    let { status, message, details } = receipts[receiptId];
                    if (status === 'ok') {
                        continue;
                    } else if (status === 'error') {
                        console.error(
                            `There was an error sending a notification: ${message}`
                        );
                        if (details && details.error) {
                            console.error(`The error code is ${details.error}`);
                        }
                    }
                }
            } catch (error) {
                console.error(error);
            }
        }
    })();
});

Na próxima aula continuamos com Push Notifications. Por hoje é só! Sucesso nos códigos e na vida!

Precisa de aulas particulares? webdesignemfoco@gmail.com

Receba as aulas da Webdesign em Foco em Seu Email
Suporte Webdesign em Foco

Posts Relacionados

Meu Primeiro App com React Native - #28 Introdução a Notificações Push
Nessa aula começamos a trabalhar no nosso APP criado com React Native com Expo Notifications, para exibir notificações push para o usuário.
Saiba mais!
Meu Primeiro App com React Native - #30 Formulário de Push Notificações
Nesse tutorial vamos incrementar nosso envio de mensagens push criando um formulário para personalizar o conteúdo das mensagens.
Saiba mais!
React JS
Nessa seção aprenderemos sobre essa importante biblioteca Javascript desenvolvida pelo Facebook para facilitar a construção backend dos nossos websites.
Saiba mais!