Cloud Functions para Firebase

1. Visão Geral

Neste codelab, você aprenderá como usar o Firebase SDK para Google Cloud Functions para melhorar um aplicativo da Web de bate-papo e como usar o Cloud Functions para enviar notificações aos usuários do aplicativo de bate-papo.

3b1284f5144b54f6.png

O que você aprenderá

  • Crie funções do Google Cloud usando o Firebase SDK.
  • Acione o Cloud Functions com base em eventos Auth, Cloud Storage e Cloud Firestore.
  • Adicione o suporte do Firebase Cloud Messaging ao seu aplicativo da web.

O que você precisará

  • Um cartão de crédito. O Cloud Functions para Firebase requer o plano Firebase Blaze, o que significa que você terá que ativar o faturamento em seu projeto Firebase usando um cartão de crédito.
  • O editor IDE / texto de sua escolha, como WebStorm , Atom ou Sublime .
  • Um terminal para executar comandos shell com o NodeJS v9 instalado.
  • Um navegador como o Chrome.
  • O código de amostra. Veja a próxima etapa para isso.

2. Obtenha o código de amostra

Clonar o repositório GitHub a partir da linha de comando:

git clone https://github.com/firebase/friendlychat

Importe o aplicativo inicial

Usando seu IDE, abra ou importe o android_studio_folder.png cloud-functions-start diretório do diretório de código de exemplo. Este diretório contém o código inicial para o codelab, que consiste em um Chat Web App totalmente funcional.

3. Crie um projeto Firebase e configure seu aplicativo

Criar projeto

Em Firebase Console , clique em Adicionar projeto e chamá-lo FriendlyChat.

Clique em Criar Projeto.

Faça upgrade para o plano Blaze

Para utilizar funções de nuvem para Firebase, você terá que Upgade seu projeto Firebase ao plano de faturamento da chama . Isso exigirá que você adicione um cartão de crédito ou outro instrumento de faturamento à sua conta do Google Cloud.

Todos os projetos do Firebase, incluindo aqueles no plano Blaze, ainda têm acesso às cotas de uso gratuito do Cloud Functions. As etapas descritas neste codelab estarão dentro dos limites de uso do nível gratuito. No entanto, você vai ver pequenas cargas ( cerca de US $ 0,03 ) de Cloud Storage que é usado para hospedar suas imagens Funções construir nuvem.

Se você não tem acesso a um cartão de crédito ou são desconfortáveis continuar com o plano de Blaze, considere o uso do Firebase Emulator Suíte que permitirá que você para emular funções nuvem para livre em sua máquina local.

Ativar Google Auth

Para permitir que os usuários façam login no aplicativo, usaremos a autenticação do Google, que precisa ser ativada.

Em Firebase Console, abra a seção Construir> Autenticação> Sign-in guia método (ou clique aqui para ir lá). Em seguida, permitir que o Sign-in Provider Google e clique em Salvar. Isso permitirá que os usuários façam login no aplicativo da web com suas contas do Google.

Além disso, sinta-se livre para definir o nome virados para o público de seu aplicativo para bate-papo amigável:

8290061806aacb46.png

Habilitar Cloud Storage

O aplicativo usa Cloud Storage para fazer upload de fotos. Para habilitar Cloud Storage no seu projecto Firebase, visite a seção Armazenamento e clique no botão começar. Siga as etapas lá e, para o local do Cloud Storage, haverá um valor padrão a ser usado. Clique em Concluído depois.

Adicionar um aplicativo da web

No Firebase console, adicione um aplicativo da web. Para fazer isso, vá para Configurações do projeto e vá para Adicionar aplicativo. Escolha web como plataforma e marque a caixa para a criação de Firebase Hospedagem, em seguida, registrar o aplicativo e clique em Avançar para o restante das etapas, clicar, por último em Continuar para consolar.

4. Instale a interface de linha de comando do Firebase

A Firebase Command Line Interface (CLI) permitirá que você sirva o aplicativo da web localmente e implante seu aplicativo da web e Cloud Functions.

Para instalar ou atualizar a CLI, execute o seguinte comando npm:

npm -g install firebase-tools

Para verificar se a CLI foi instalada corretamente, abra um console e execute:

firebase --version

Certifique-se a versão do Firebase CLI está acima de 4.0.0 para que ele tenha todas as últimas características necessárias para funções nuvem. Caso contrário, execute npm install -g firebase-tools para atualizar como mostrado acima.

Autorize a Firebase CLI executando:

firebase login

Verifique se você está na cloud-functions-start diretório, em seguida, configurar o Firebase CLI para usar seu Projeto Firebase:

firebase use --add

Em seguida, selecione o ID do seu projeto e siga as instruções. Quando solicitado, você pode escolher qualquer Alias, como codelab .

5. Implante e execute o aplicativo da web

Agora que importou e configurou seu projeto, você está pronto para executar o aplicativo da web pela primeira vez! Abra uma janela de terminal, navegue até a cloud-functions-start pasta, e implantar o aplicativo web para Firebase hospedagem usando:

firebase deploy --except functions

Esta é a saída do console que você deve ver:

i deploying database, storage, hosting
✔  database: rules ready to deploy.
i  storage: checking rules for compilation errors...
✔  storage: rules file compiled successfully
i  hosting: preparing ./ directory for upload...
✔  hosting: ./ folder uploaded successfully
✔ storage: rules file compiled successfully
✔ hosting: 8 files uploaded successfully
i starting release process (may take several minutes)...

✔ Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview
Hosting URL: https://friendlychat-1234.firebaseapp.com

Abra o aplicativo da web

A última linha deve exibir a URL de hospedagem. O aplicativo da web agora deve ser servido a partir desse URL, que deve estar no formato https: // <project-id> .firebaseapp.com. Abra. Você deve ver a IU em funcionamento do aplicativo de bate-papo.

Registe-se para o aplicativo usando o botão SIGN-no Google e se sentir livre para adicionar algumas mensagens e postar imagens:

3b1284f5144b54f6.png

Se você fizer login no aplicativo pela primeira vez em um novo navegador, certifique-se de permitir as notificações quando solicitado: 8b9d0c66dc36153d.png

Precisaremos habilitar as notificações posteriormente.

Se você tiver clicado acidentalmente Block, você pode alterar essa configuração clicando no botão 🔒 seguro à esquerda da URL na Omnibar Chrome e alternando o bar ao lado de Notificações:

e926868b0546ed71.png

Agora, adicionaremos algumas funcionalidades usando o Firebase SDK para Cloud Functions.

6. O Diretório de Funções

O Cloud Functions permite que você tenha um código facilmente executado na nuvem sem a necessidade de configurar um servidor. Veremos como criar funções que reagem a eventos de banco de dados Firebase Auth, Cloud Storage e Firebase Firestore. Vamos começar com Auth.

Ao usar o Firebase SDK para funções de nuvem, o seu código de Funções vai viver sob a functions de diretório (por padrão). Seu código Funções também um Node.js aplicativo e, portanto, precisa de uma package.json que dá algumas informações sobre seu aplicativo e listas de dependências.

Para tornar mais fácil para você, que já criou a functions/index.js arquivo onde o seu código vai. Sinta-se à vontade para inspecionar este arquivo antes de prosseguir.

cd functions
ls

Se você não estiver familiarizado com Node.js , aprender mais sobre ele antes de continuar a codelab seria útil.

O package.json arquivo já lista duas dependências necessárias: o SDK Firebase para funções nuvem eo Firebase administração SDK . Para instalá-los localmente, ir para as functions pasta e execute:

npm install

Vamos agora ter um olhar para o index.js arquivo:

index.js

/**
 * Copyright 2017 Google Inc. All Rights Reserved.
 * ...
 */

// TODO(DEVELOPER): Import the Cloud Functions for Firebase and the Firebase Admin modules here.

// TODO(DEVELOPER): Write the addWelcomeMessage Function here.

// TODO(DEVELOPER): Write the blurImages Function here.

// TODO(DEVELOPER): Write the sendNotification Function here.

Vamos importar os módulos necessários e, em seguida, escrever três funções no lugar dos TODOs. Vamos começar importando os módulos do Node necessários.

7. Importe os módulos Cloud Functions e Firebase Admin

Dois módulos serão necessários durante este codelab: firebase-functions permite escrever Nuvem Funções gatilhos e logs enquanto firebase-admin permite utilizar a plataforma Firebase em um servidor com acesso de administrador para fazer acções tais como escrever para Cloud Firestore ou envio de notificações FCM.

No index.js arquivo, substitua a primeira TODO com o seguinte:

index.js

/**
 * Copyright 2017 Google Inc. All Rights Reserved.
 * ...
 */

// Import the Firebase SDK for Google Cloud Functions.
const functions = require('firebase-functions');
// Import and initialize the Firebase Admin SDK.
const admin = require('firebase-admin');
admin.initializeApp();

// TODO(DEVELOPER): Write the addWelcomeMessage Function here.

// TODO(DEVELOPER): Write the blurImages Function here.

// TODO(DEVELOPER): Write the sendNotification Function here.

O Firebase administração SDK pode ser configurado automaticamente quando implantado em um ambiente de Funções Nuvem ou outros recipientes do Google Cloud Platform, e isso acontece quando chamamos admin.initializeApp() sem argumentos.

Agora, vamos adicionar uma função que é executada quando um usuário faz login pela primeira vez no aplicativo de bate-papo e adicionaremos uma mensagem de bate-papo para dar as boas-vindas ao usuário.

8. Dê as boas-vindas a novos usuários

Estrutura de mensagens de bate-papo

As mensagens postadas no feed de bate-papo do FriendlyChat são armazenadas no Cloud Firestore. Vamos dar uma olhada na estrutura de dados que usamos para uma mensagem. Para fazer isso, poste uma nova mensagem no bate-papo com os dizeres "Hello World":

11f5a676fbb1a69a.png

Isso deve aparecer como:

fe6d1c020d0744cf.png

Em Firebase Console, clique em Firestore banco de dados sob a seção Build. Você deve ver a coleção de mensagens e um documento contendo a mensagem que escreveu:

442c9c10b5e2b245.png

Como você pode ver, as mensagens de bate-papo são armazenadas na nuvem Firestore como um documento com name , profilePicUrl , text e timestamp atributos adicionados ao messages coleção.

Adicionando mensagens de boas-vindas

A primeira função Nuvem adiciona uma mensagem que recebe os novos usuários para o chat. Para isso, podemos usar o gatilho functions.auth().onCreate , que executa a função cada vez que um usuário entra-in pela primeira vez no aplicativo Firebase. Adicione os addWelcomeMessages funcionar em seu index.js arquivo:

index.js

// Adds a message that welcomes new users into the chat.
exports.addWelcomeMessages = functions.auth.user().onCreate(async (user) => {
  functions.logger.log('A new user signed in for the first time.');
  const fullName = user.displayName || 'Anonymous';

  // Saves the new welcome message into the database
  // which then displays it in the FriendlyChat clients.
  await admin.firestore().collection('messages').add({
    name: 'Firebase Bot',
    profilePicUrl: '/images/firebase-logo.png', // Firebase logo
    text: `${fullName} signed in for the first time! Welcome!`,
    timestamp: admin.firestore.FieldValue.serverTimestamp(),
  });
  functions.logger.log('Welcome message written to database.');
});

Adicionando esta função para o especial exports objeto é a maneira de fazer a função acessível fora do arquivo atual do Nó e é necessário para Funções nuvem.

Na função acima, estamos adicionando uma nova mensagem de boas-vindas postada por "Firebase Bot" à lista de mensagens de bate-papo. Nós estamos fazendo isso usando o add método na messages coleção na nuvem Firestore, que é onde as mensagens do bate-papo são armazenadas.

Desde que esta é uma operação assíncrona, precisamos voltar a Promise indicando quando Nuvem Firestore tem a escrita acabado assim as funções nuvem não executar muito cedo.

Implantar Cloud Functions

O Cloud Functions só estará ativo após sua implantação. Para fazer isso, execute isto na linha de comando:

firebase deploy --only functions

Esta é a saída do console que você deve ver:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
⚠  functions: missing necessary APIs. Enabling now...
i  env: ensuring necessary APIs are enabled...
⚠  env: missing necessary APIs. Enabling now...
i  functions: waiting for APIs to activate...
i  env: waiting for APIs to activate...
✔  env: all necessary APIs are enabled
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: creating function addWelcomeMessages...
✔  functions[addWelcomeMessages]: Successful create operation. 
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlypchat-1234/overview

Teste a função

Depois que a função for implantada com êxito, você precisará de um usuário que efetue login pela primeira vez.

  1. Abra seu aplicativo em seu navegador usando o URL hospedagem (na forma de https://<project-id>.firebaseapp.com ).
  2. Com um novo usuário, sessão pela primeira vez em seu aplicativo usando o botão Sign In.
  • Se você já se inscreveu para o, app pode abrir Authentication Console Firebase e excluir sua conta a partir da lista de usuários. Em seguida, faça login novamente.

262535d1b1223c65.png

  1. Depois de fazer login, uma mensagem de boas-vindas deve ser exibida automaticamente:

1c70e0d64b23525b.png

9. Moderação de imagens

Os usuários podem fazer upload de todo tipo de imagens no chat, e é sempre importante moderar imagens ofensivas, principalmente em plataformas sociais públicas. Em FriendlyChat, as imagens que estão sendo publicados para o bate-papo são armazenadas no Google Cloud Storage .

Com funções de nuvem, você pode detectar novos uploads de imagens usando o functions.storage().onFinalize gatilho. Isso será executado sempre que um novo arquivo for carregado ou modificado no Cloud Storage.

Para moderar imagens, passaremos pelo seguinte processo:

  1. Verifique se a imagem é sinalizado como adulto ou violento usando a API Visão da nuvem .
  2. Se a imagem foi sinalizada, baixe-a na instância do Functions em execução.
  3. Borrar a imagem usando ImageMagick .
  4. Faça upload da imagem desfocada para o Cloud Storage.

Ative a API Cloud Vision

Como usaremos a API Google Cloud Vision nesta função, você deve habilitar a API em seu projeto Firebase. Siga este link , em seguida, selecione seu projeto Firebase e ativar a API:

5c77fee51ec5de49.png

Instale dependências

Para imagens moderados, vamos usar a Biblioteca do Cliente Google Cloud Vision for Node.js, @ google-cloud / visão , para executar as imagens através da API Visão da nuvem para detectar imagens impróprias.

Para instalar este pacote em sua Nuvem Funções aplicativo, execute o seguinte npm install --save comando. Certifique-se de que você faça isso a partir do functions diretório.

npm install --save @google-cloud/vision@2.4.0

Isto irá instalar o pacote localmente e adicioná-los como uma dependência declarada em sua package.json arquivo.

Importar e configurar dependências

Para importar as dependências que foram instalados e alguns módulos principais Node.js ( path , os e fs ) que você precisa nesta seção, adicione as seguintes linhas para o topo da sua index.js arquivo:

index.js

const Vision = require('@google-cloud/vision');
const vision = new Vision.ImageAnnotatorClient();
const {promisify} = require('util');
const exec = promisify(require('child_process').exec);

const path = require('path');
const os = require('os');
const fs = require('fs');

Como sua função será executada dentro de um ambiente do Google Cloud, não há necessidade de configurar as bibliotecas Cloud Storage e Cloud Vision: elas serão configuradas automaticamente para usar seu projeto.

Detectando imagens inadequadas

Você estará usando o functions.storage.onChange Funções Nuvem gatilho, que corre o seu código, logo que um arquivo ou pasta é criado ou modificado em um balde Cloud Storage. Adicione o blurOffensiveImages Function em seu index.js arquivo:

index.js

// Checks if uploaded images are flagged as Adult or Violence and if so blurs them.
exports.blurOffensiveImages = functions.runWith({memory: '2GB'}).storage.object().onFinalize(
    async (object) => {
      const imageUri = `gs://${object.bucket}/${object.name}`;
      // Check the image content using the Cloud Vision API.
      const batchAnnotateImagesResponse = await vision.safeSearchDetection(imageUri);
      const safeSearchResult = batchAnnotateImagesResponse[0].safeSearchAnnotation;
      const Likelihood = Vision.protos.google.cloud.vision.v1.Likelihood;
      if (Likelihood[safeSearchResult.adult] >= Likelihood.LIKELY ||
          Likelihood[safeSearchResult.violence] >= Likelihood.LIKELY) {
        functions.logger.log('The image', object.name, 'has been detected as inappropriate.');
        return blurImage(object.name);
      }
      functions.logger.log('The image', object.name, 'has been detected as OK.');
    });

Observe que adicionamos algumas configurações da instância do Cloud Functions que executará a função. Com .runWith({memory: '2GB'}) , estamos solicitando que a instância recebe 2 GB de memória em vez do padrão, porque esta função é intensivo de memória.

Quando a função é acionada, a imagem é executada por meio da API Cloud Vision para detectar se ela é sinalizada como adulta ou violenta. Se a imagem for detectado como impróprio com base nestes critérios, estamos borrar a imagem, o que é feito no blurImage função como veremos a seguir.

Desfocando a imagem

Adicione o seguinte blurImage função em seu index.js arquivo:

index.js

// Blurs the given image located in the given bucket using ImageMagick.
async function blurImage(filePath) {
  const tempLocalFile = path.join(os.tmpdir(), path.basename(filePath));
  const messageId = filePath.split(path.sep)[1];
  const bucket = admin.storage().bucket();

  // Download file from bucket.
  await bucket.file(filePath).download({destination: tempLocalFile});
  functions.logger.log('Image has been downloaded to', tempLocalFile);
  // Blur the image using ImageMagick.
  await exec(`convert "${tempLocalFile}" -channel RGBA -blur 0x24 "${tempLocalFile}"`);
  functions.logger.log('Image has been blurred');
  // Uploading the Blurred image back into the bucket.
  await bucket.upload(tempLocalFile, {destination: filePath});
  functions.logger.log('Blurred image has been uploaded to', filePath);
  // Deleting the local file to free up disk space.
  fs.unlinkSync(tempLocalFile);
  functions.logger.log('Deleted local file.');
  // Indicate that the message has been moderated.
  await admin.firestore().collection('messages').doc(messageId).update({moderated: true});
  functions.logger.log('Marked the image as moderated in the database.');
}

Na função acima, o binário da imagem é baixado do Cloud Storage. A imagem é então turva usando do ImageMagick convert ferramenta, ea versão borrada está no balde de armazenamento carregado-re. Em seguida, excluímos o arquivo na instância do Cloud Functions para liberar espaço em disco, e fazemos isso porque a mesma instância do Cloud Functions pode ser reutilizada e, se os arquivos não forem limpos, pode ficar sem espaço em disco. Por fim, adicionamos um booleano à mensagem de bate-papo indicando que a imagem foi moderada e isso acionará uma atualização da mensagem no cliente.

Implantar a função

A função só estará ativa depois de implantada. Na linha de comando, execute firebase deploy --only functions :

firebase deploy --only functions

Esta é a saída do console que você deve ver:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: updating function addWelcomeMessages...
i  functions: creating function blurOffensiveImages...
✔  functions[addWelcomeMessages]: Successful update operation.
✔  functions[blurOffensiveImages]: Successful create operation.
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview

Teste a função

Assim que a função for implantada com sucesso:

  1. Abra seu aplicativo em seu navegador usando o URL hospedagem (na forma de https://<project-id>.firebaseapp.com ).
  2. Depois de fazer login no aplicativo, faça upload de uma imagem: 4db9fdab56703e4a.png
  3. Escolha o seu melhor imagem ofensiva para upload (ou você pode usar essa carne comer Zombie !) E depois de alguns momentos, você deve ver a sua atualização pós com uma versão borrada da imagem: 83dd904fbaf97d2b.png

10. Notificações de novas mensagens

Nesta seção, você adicionará um Cloud Function que envia notificações aos participantes do bate-papo quando uma nova mensagem é postada.

Usando Firebase Cloud Messaging (FCM), você pode enviar de forma confiável notificações aos usuários em todas as plataformas. Para enviar uma notificação a um usuário, você precisa do token do dispositivo FCM dele. O aplicativo da web de bate-papo que estamos usando já coleta tokens de dispositivo dos usuários quando eles abrem o aplicativo pela primeira vez em um novo navegador ou dispositivo. Esses tokens são armazenados em nuvem Firestore na fcmTokens coleção.

Se você gostaria de saber como obter os tokens de dispositivos FCM em um aplicativo web, você pode ir através do Firebase Web Codelab .

Enviar notificações

Para detectar quando novas mensagens são postadas, você estará usando o functions.firestore.document().onCreate Nuvem funções de gatilho, que corre o seu código quando um novo objeto é criado em um determinado caminho da Nuvem Firestore. Adicione os sendNotifications funcionar em seu index.js arquivo:

index.js

// Sends a notifications to all users when a new message is posted.
exports.sendNotifications = functions.firestore.document('messages/{messageId}').onCreate(
  async (snapshot) => {
    // Notification details.
    const text = snapshot.data().text;
    const payload = {
      notification: {
        title: `${snapshot.data().name} posted ${text ? 'a message' : 'an image'}`,
        body: text ? (text.length <= 100 ? text : text.substring(0, 97) + '...') : '',
        icon: snapshot.data().profilePicUrl || '/images/profile_placeholder.png',
        click_action: `https://${process.env.GCLOUD_PROJECT}.firebaseapp.com`,
      }
    };

    // Get the list of device tokens.
    const allTokens = await admin.firestore().collection('fcmTokens').get();
    const tokens = [];
    allTokens.forEach((tokenDoc) => {
      tokens.push(tokenDoc.id);
    });

    if (tokens.length > 0) {
      // Send notifications to all tokens.
      const response = await admin.messaging().sendToDevice(tokens, payload);
      await cleanupTokens(response, tokens);
      functions.logger.log('Notifications have been sent and tokens cleaned up.');
    }
  });

Na função acima, estamos a recolher fichas de dispositivos de todos os usuários do banco de dados em nuvem Firestore e enviar uma notificação para cada uma delas usando o admin.messaging().sendToDevice função.

Limpe os tokens

Por último, queremos remover os tokens que não são mais válidos. Isso acontece quando o token que obtivemos do usuário não está mais sendo usado pelo navegador ou dispositivo. Por exemplo, isso acontece se o usuário revogou a permissão de notificação para a sessão do navegador. Para fazer isso, adicione as seguintes cleanupTokens funcionar em sua index.js arquivo:

index.js

// Cleans up the tokens that are no longer valid.
function cleanupTokens(response, tokens) {
 // For each notification we check if there was an error.
 const tokensDelete = [];
 response.results.forEach((result, index) => {
   const error = result.error;
   if (error) {
     functions.logger.error('Failure sending notification to', tokens[index], error);
     // Cleanup the tokens that are not registered anymore.
     if (error.code === 'messaging/invalid-registration-token' ||
         error.code === 'messaging/registration-token-not-registered') {
       const deleteTask = admin.firestore().collection('fcmTokens').doc(tokens[index]).delete();
       tokensDelete.push(deleteTask);
     }
   }
 });
 return Promise.all(tokensDelete);
}

Implantar a função

A função só estará ativa após sua implantação e, para implantá-la, execute na linha de comando:

firebase deploy --only functions

Esta é a saída do console que você deve ver:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: updating function addWelcomeMessages...
i  functions: updating function blurOffensiveImages...
i  functions: creating function sendNotifications...
✔  functions[addWelcomeMessages]: Successful update operation.
✔  functions[blurOffensiveImages]: Successful updating operation.
✔  functions[sendNotifications]: Successful create operation.
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview

Teste a função

  1. Uma vez que a função tem implantado com sucesso, abra o app em seu navegador usando o URL hospedagem (na forma de https://<project-id>.firebaseapp.com ).
  2. Se você fizer login no aplicativo pela primeira vez, certifique-se de permitir as notificações quando solicitado: 8b9d0c66dc36153d.png
  3. Feche a guia do aplicativo de bate-papo ou exiba uma guia diferente: As notificações aparecem apenas se o aplicativo estiver em segundo plano. Se você gostaria de aprender a receber mensagens enquanto seu aplicativo estiver em primeiro plano, ter um olhar para a nossa documentação .
  4. Usando um navegador diferente (ou uma janela anônima), faça login no aplicativo e poste uma mensagem. Você deve ver uma notificação exibida pelo primeiro navegador: 45282ab12b28b926.png

11. Parabéns!

Você usou o Firebase SDK para Cloud Functions e adicionou componentes do lado do servidor a um aplicativo de bate-papo.

O que cobrimos

  • Criação de Cloud Functions usando o Firebase SDK para Cloud Functions.
  • Acione o Cloud Functions com base em eventos Auth, Cloud Storage e Cloud Firestore.
  • Adicione o suporte do Firebase Cloud Messaging ao seu aplicativo da web.
  • Implante o Cloud Functions usando a Firebase CLI.

Próximos passos

Saber mais