Comida? Oba! Como utilizar a geolocalização do WhatsApp e API de restaurantes próximos com Twilio e Javascript

Tempo de leitura: 3 minutos

January 15, 2020
Escrito por
Nathaniel Okenwa
Twilion

Como utilizar a geolocalização do WhatsApp e API de restaurantes próximos com Twilio e Javascript.png

A vida de um desenvolvedor evangelista pode ser muito desregrada. Viajo para muitos países e acabo pedindo fast food para o meu quarto de hotel com muito mais frequência do que eu gostaria. Este ano, estou tentando manter o controle da minha dieta, especialmente quando estou fora de casa. No entanto, também fico extremamente indeciso na hora da escolha. Venhamos e convenhamos: filtrar uma longa lista de restaurantes para encontrar opções saudáveis pode ser cansativo e frustrante.

O mais incrível é que por eu ser um desenvolvedor, posso criar ferramentas para resolver meus problemas. Hoje vou mostrar a você como criei um bot para encontrar os restaurantes mais próximos que trabalham com comida saudável, independentemente de onde eu esteja! Acompanhe as etapas comigo para você criar o seu.

A API da Twilio para WhatsAppfacilita a coleta de dados de localização dos usuários, permitindo-nos responder de forma adequada. Portanto, usaremos o WhatsApp como canal para o nosso bot.

Precisaremos de:

Configurar nossa função

Neste projeto, usaremos o Twilio Functions já que ele executa o código JavaScript diretamente da plataforma da Twilio. Ele também é uma das maneiras mais fáceis de fazer com que o código responda a uma mensagem recebida.

Vá até a Página do Twilio Functions e crie uma função usando o modelo de "função em branco". Atribua um nome à função e defina o caminho para /food. Anote a URL completa, pois a usaremos mais tarde. Salve a função. Para salvar a função, pressione o botão Save (Salvar) na parte inferior da página.

Usaremos o axios para fazer solicitações HTTP para a API de viagem. Para adicionar isso ao nosso ambiente, navegue até a seção Configure (Configurar) na lateral esquerda do console da Twilio e adicione axios às nossas dependências. Criei isso usando o axios versão 0.19.1.

Aqui, também podemos adicionar qualquer variável de ambiente necessária, como as credenciais da API Zomato. Adicionarei uma variável de ambiente chamada ZOMATO_API_KEY que usarei em meu código.

Página de configuração do Twilio Functions

Obter dados de localização no WhatsApp

O WhatsApp permite que os usuários compartilhem seus dados de localização facilmente. Quando a plataforma Twilio recebe os dados de localização em uma mensagem do WhatsApp, ela faz uma solicitação para o Twilio Functions. Ela apresenta os dados de localização como parâmetros de solicitação com latitude, longitude e um endereço, se disponíveis.

Para começar a usar a API da Twilio para WhatsApp, você precisará configurar um número da sandbox da Twilio. Conclua a configuração e, em seguida, verifique se você usou sua palavra-chave pessoal na sandbox para participar de sua conversa na sandbox pelo WhatsApp.

Concluída a configuração, defina o campo "When a message comes in" (Quando receber uma mensagem) para fazer uma solicitação POST para a URL que anotamos anteriormente no Twilio Functions.

Captura de tela da configuração da sandbox da Twilio

Volte para o Twilio Functions e prepare-se para escrever algum código!

exports.handler = function(context, event, callback) {
  let twiml = new Twilio.twiml.MessagingResponse();

  if (!event.Latitude || !event.Longitude) {
    twiml.message("If you would like some food, please send me your location.");
    callback(null, twiml);
  } else {
    const location = {
      lat: event.Latitude,
      lon: event.Longitude
    };
    twiml.message(
      `Your latitude is ${location.lat} and your longitude is ${location.lon}`
    );
    callback(null, twiml);
  }
};

O código acima verificará primeiro se a mensagem contém dados de localização. Se tivermos a localização, responderemos com as coordenadas que recebermos. Caso contrário, enviaremos uma mensagem para solicitar uma localização.

Salve a função e teste-a enviando uma mensagem do WhatsApp contendo sua localização atual para o número da sandbox. Para fazer isso, clique no ícone de anexo, escolha a localização e selecione Send your current location (Enviar sua localização atual). "Live Location is currently not supported on the Twilio WhatsApp API." (Atualmente, não há suporte para a localização dinâmica na API do WhatsApp da Twilio.)

Você deve receber uma resposta como esta.

Captura de tela do WhatsApp mostrando uma resposta com coordenadas de latitude e longitude a uma mensagem com localização geográfica

Vamos encontrar comida

Agora, podemos usar as coordenadas de localização para encontrar os restaurantes próximos. Usarei a API Zomato, mas você pode substituí-la facilmente por qualquer outra API, desde que ela possa usar as coordenadas de GPS como parâmetros para retornar os locais.

Precisamos disponibilizar o axios para fazer solicitações à nossa API de viagem.

const axios = require('axios');

Agora, podemos fazer uma chamada para a API de viagem e obter a lista de restaurantes que trabalham com culinária saudável. Usei o endpoint de pesquisa fornecido pela API Zomato. Esse endpoint retorna uma matriz de objetos de restaurante que contém informações sobre cada restaurante.

Ao iterar por meio dessa matriz, podemos criar mensagens que contenham o nome de cada restaurante e uma URL para obtenção de mais detalhes sobre esse estabelecimento.

Observe que capturei minha API Key (chave de API) do objeto de contexto. Isso ocorre porque eu a defini como uma variável de ambiente quando configuramos o ambiente para o Twilio Functions.

const axios = require("axios");

exports.handler = function(context, event, callback) {
  let twiml = new Twilio.twiml.MessagingResponse();
  if (!event.Latitude || !event.Longitude) {
    twiml.message("If you would like some food, please send me your location.");
    callback(null, twiml);
  } else {
    const location = {
      lat: event.Latitude,
      lon: event.Longitude
    };

    axios
      .get( `https://developers.zomato.com/api/v2.1/search?count=10&lat=${location.lat}&lon=${location.lon}&cuisines=healthy%20food`,
        {
          headers: {
            Accept: "application/json",
            "user-key": context.ZOMATO_API_KEY
          }
        }
      )
      .then(response => {
        const restaurants = response.data.restaurants;

        restaurants.forEach(restaurant => {
          twiml.message(
            `${restaurant.restaurant.name} - ${restaurant.restaurant.url}`
          );
        });

        callback(null, twiml);
      })
      .catch(error => {
        callback(error);
      });
  }
};

Inclusive, compartilhei o código em um gist no Github, caso prefira copiar e colá-lo.

Salve o Twilio Functions e, para testar, envie outra localização para a sandbox do WhatsApp. Você receberá uma lista de restaurantes que trabalham com comida saudável perto de você!

Captura de tela do WhatsApp mostrando respostas com uma lista de restaurantes a uma mensagem com localização geográfica

Conclusão

Testei esse bot do WhatsApp para encontrar o meu almoço hoje e devo admitir que não imaginava encontrar tantos restaurantes com comida saudável perto do escritório. Estou ansioso para usar esse bot sempre que estiver em viagem e precisar encontrar opções saudáveis para comer.

Há muitas outras maneiras de usar dados de localização para atender a usuários pelo chat do WhatsApp. Se você deseja aprender a localizar um usuário rapidamente ou fornecer informações específicas sobre onde está um usuário, a API da Twilio para WhatsApp é um bom lugar para começar.

Este artigo foi traduzido do original "Food Glorious Food! Using Location Data in WhatsApp to find nearby healthy restaurants using Twilio and JavaScript". Enquanto melhoramos nossos processos de tradução, adoraríamos receber seus comentários em help@twilio.com - contribuições valiosas podem render brindes da Twilio.

Publicações relacionadas

Recursos relacionados

A newspaper article

Twilio Docs

De APIs a SDKs e aplicativos de amostra

Documentação de referência de API, SDKs, bibliotecas auxiliares, guias de início rápido e tutoriais para sua linguagem e plataforma.
An Open book

Centro de Recursos

Os mais recentes e-books, relatórios do setor e webinars

Aprenda com especialistas em engajamento do cliente para melhorar sua própria comunicação.
User group reactions

Ahoy

Centro da comunidade de desenvolvedores da Twilio

Melhores práticas, exemplos de código e inspiração para criar comunicações e experiências de engajamento digital.