Black Friday: crie uma ferramenta automatizada para enviar RCS com PHP

Quer inovar nas estratégias de Black Friday? Saiba como criar uma ferramenta automatizada para enviar RCS usando PHP.

Letícia Domingos Paiva Publicado em: 07/10/2021 Atualizado em: 12/08/2022

11 min de leitura

Black Friday: crie uma ferramenta automatizada para enviar RCS com PHP

A Black Friday já se consolidou como uma data importante para atrair novos consumidores para os negócios. Por isso, para esse período, é tão relevante pensar em ferramentas que possam agilizar processos. Como é o caso de ferramentas automatizadas. Em outra ocasião, falamos sobre como utilizar bots para decolar as vendas na Black Friday. Aqui, vamos mostrar como é possível criar uma para enviar mensagens RCS com PHP e a ZENVIA API‘s.

Por meio da plataforma ZENVIA, temos a possibilidade de integrar a API de envio de mensagens RCS, criando grandes possibilidades para o uso neste fim de ano.

A seguir, vamos exemplificar o uso da API de Mensagens RCS da ZENVIA, utilizando PHP e banco de dados MySQL, criando uma ferramenta que permite o envio de mensagens RCS para uma lista de clientes cadastrados. Confira!

Iniciando na plataforma ZENVIA

Para testes em Sandbox na plataforma ZENVIA, crie uma conta. Após o login, o acesso será liberado. Na tela inicial, navegue seguindo este fluxo Solutions > Sandbox. Clique em create a new e seleciona a opção RCS.

Você será redirecionado para uma tela de testes. Adicione seu número e clique em Send mensages. A partir deste momento, será enviada uma mensagem RCS para este número.

Para criar um canal de conexão através da mensagem enviada, clique em accept. Agora é possível a troca de mensagens utilizando a ZENVIA API’s.

Após configurar o canal, volte para o menu de produto e acesse Tokens e Webhooks. Clique em Create New e adicione o token. Logo após, você será redirecionado para a listagem de tokens e webhooks do Sandbox:

Vamos precisar da palavra-chave e do token para integrarmos com a API.

Iniciando o desenvolvimento da aplicação

Neste tutorial, vamos desenvolver uma aplicação que permite o cadastro de clientes em uma base de dados e permitir o envio de mensagens RCS com notificações, utilizando a ZENVIA API’s. Neste exemplo, vamos automatizar o envio de mensagens para uma lista de contatos, notificando sobre novas promoções, cupons de descontos e outros tipos de vantagens e chamativos.

Criando a aplicação em PHP

Para o desenvolvimento desta aplicação será necessário ter instalado o interpretador do PHP, um servidor web (apache, ngnix) e também o banco de dados MySQL.

Configurando o banco de dados

1. Abaixo está disponível o schema de banco de dados. Crie o banco utilizando o nome store_db como o seguinte schema.

-- store_db.customers definition
 
CREATE TABLE `customers` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `name` varchar(255) NOT NULL,
 `lastname` varchar(255) NOT NULL,
 `phone` varchar(255) NOT NULL,
 `email` varchar(255) NOT NULL,
 `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
 `updated_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=33 DEFAULT CHARSET=latin1;

1.1. Com o banco de dados criado, será necessário fazer a conexão. Crie uma pasta com o nome database e, dentro dela, um arquivo chamado connect.php. Adicione as instruções abaixo, com suas credenciais do banco de dados:

 
<?php $connect = mysqli_connect("172.17.0.2", "root", "root", "store_db");

Criando as páginas da aplicação

Para criar nossas páginas web, vamos utilizar o Bootstrap 4. Com este framework, podemos simplificar a estilização e também a criação de alguns componentes.

1. Crie uma pasta chamada includes e adicione dois arquivos o header.php e o footer.php. Isolando estes componentes, podemos replicá-los em todas as paginas do projeto.

Em header.php adicione o seguinte código. No header, os importes para utilizar o Bootstrap 4 já estarão disponíveis!

<!doctype html>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   
<html lang="en">
 <head>
   <!-- Required meta tags -->
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1,
     shrink-to-fit=no">
 
   <!-- Bootstrap CSS -->
   <link rel="stylesheet"
   <!-- importação do CDN do Bootstrap -->
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
     crossorigin="anonymous">
   <title>Cadastrar Clientes</title>
 </head>
 <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    
     <a class="navbar-brand" href="#">ZENVIA STORE</a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
     </button>
    
     <div class="collapse navbar-collapse d-flex flex-row-reverse" id="navbarNav">
       <ul class="nav navbar-nav mr-sm-2">
         <li><a class="nav-link" href="send-messages.php">Enviar Mensagens RCS</a></li>
         <li><a class="nav-link" href="customers.php">Listar Clientes</a></li>
         <li><a class="nav-link" href="index.php">Adicionar Clientes</a></li>
       </ul>
     </div>
   </nav>
   <div class="container">

Em footer.php, adicione o seguinte exemplo de código:

</div>
 
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
 integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
 crossorigin="anonymous"></script>
<script
 src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
 integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
 crossorigin="anonymous"></script>
<script
 src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
 integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
 crossorigin="anonymous"></script>
 <script src=
 "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
 </script>
 <script src="./js/script.js"></script>
</body>
</html>

Realizando o cadastro e listagem de clientes

1. Vamos criar uma página chamada customers.php. Esta página será o formulário para cadastrar os clientes na base:

<?php include("includes/header.php") ?>
 <div class="row">
   <div class="col-md-12 mt-5">
     <h1 class="text-center">Cadastrar Cliente</h1>
     <br />
   </div>
 </div>
 <div class="row">
   <div class="col-md-5 mx-auto">
     <form action="customer-form.php">
       <div class="form-group"> 
         <label for="">Name</label>
         <input type="name" name="name" class="form-control">
       </div>
       <div class="form-group">
         <label for="">Sobrenome</label>
         <input type="text" name="lastname" class="form-control">
       </div>
       <div class="form-group">
         <label for="">Celular.</label>
         <input type="text" name="phone" class="form-control"
           placeholder="(99) 99999 - 9999">
       </div>
       <div class="form-group">
         <label for="">Email</label>
         <input type="email" name="email" class="form-control">
       </div>
       <div class="form-group">
         <button type="submit" name="submit" class="btn btn-primary">Submit</button>
       </div>
     </form>
   </div>
 </div>
<?php include("includes/footer.php") ?>

1.1. Para receber os dados do formulário, vamos criar uma página chamada customer-form.php, com o seguinte código.

<?php include("includes/header.php") ?>
<?php include("database/connect.php") ?>
<?php
 
//função para cadastrar o cliente no banco
 function createCustomer($connect, $name, $lastname, $phone, $email) {
   $query = "INSERT INTO store_db.customers (name, lastname, phone, email) values ('{$name}', '{$lastname}','{$phone}', '{$email}')";
 
   return mysqli_query($connect, $query);
 };
 
 $name = $_GET["name"];
 $lastname = $_GET["lastname"];
 $phone = $_GET["phone"];
 $email = $_GET["email"];
?>
 
<?php if(createCustomer($connect, $name, $lastname, $phone, $email)) { ?>
 <div class="row">
   <div class="col-md-5 mx-auto p-5">
     <p class="alert-success"> Cliente <?= $name; ?> <?= $lastname; ?> adicionado com sucesso!</p>
   </div>
   <?php } else { ?>
     <div class="col-md-5 mx-auto p-5">
     <p class="alert-danger"> Cliente não cadastrado</p>
   </div>
   <?php } ?>
 </div>
<?php include("includes/footer.php") ?>

1.2. Agora é possível cadastrar os clientes no banco de dados. Adicione mais uma página com o nome customer.php, com o código de exemplo abaixo:

<?php include("includes/header.php") ?>
<?php include("database/connect.php") ?>
 
<div class="row">
 <div class="col-md-12 mt-5">
   <h1 class="text-center">CLIENTES CADASTRADOS</h1>
   <hr style="height: 1px;color: gray;background-color: gray;">
 </div>
</div>
<div class="d-flex flex-row-reverse mb-2">
 <a href="index.php" class="btn btn-success ml-2">Novo cliente</a>
 <a href="send-messages.php" class="btn btn-primary">Enviar Mensagens RCS</a>
</div>
<div class="row">
 <div class="col-md-12">
   <table class="table">
     <thead>
       <tr>
         <th>ID</th>
         <th>Name</th>
         <th>Sobrenome</th>
         <th>Celular</th>
         <th>Email</th>
       </tr>
     </thead>
     <tbody>
 
     <?php
          
       if(isset($_GET['delete']))
       {
         $id=$_GET['delete'];
    
         $sql_query="DELETE FROM store_db.customers WHERE id=".$id;
         mysqli_query($connect, $sql_query);
       }  
 
       $customers = mysqli_query($connect, "SELECT * FROM store_db.customers");
 
       while ($customer = mysqli_fetch_assoc($customers)) {
     ?>
       <tr>
         <td> <?php echo $customer['id'] ?></td>
         <td> <?php echo $customer['name'] ?></td>
         <td> <?php echo $customer['lastname'] ?></td>
         <td> <?php echo $customer['phone'] ?></td>
         <td> <?php echo $customer['email'] ?></td>
         <td>
           <a href="customers.php?delete=<?php echo $customer['id'] ?>"
             class="badge badge-danger">Delete</a>
         </td>
       </tr>
       <?php } ?>
     </tbody>
   </table>
 </div>
</div>
<?php include("includes/footer.php") ?>

1.3. Para cadastrar um cliente, abra a página de cadastro de clientes no navegador, preencha os dados e logo após, clique em submit. Retornando na página listar Clientes é possível visualizar o cliente cadastrado.

Enviando mensagens RCS

1. Vamos criar um arquivo chamado customer-json.php. Nele, vamos listar todos os clientes cadastrados em formato json. Adicione o seguinte código:

1.1. Crie uma pasta chamada js e crie um arquivo chamado script.js, adicionando o exemplo de código abaixo:

$(document).ready(function() {
 $("button").click(function() {
     var x = $("#form-message").serializeArray();
     $.each(x, function(i, field) {
       const URL = "https://api.zenvia.com/v2/channels/rcs/messages"
	
     fetch('customers-json.php').then(res => res.json())
       .then(response => {
           response.forEach(item => {
           const body = JSON.stringify({
             from:"troubled-lemur",
             to: item.phone,
             contents:[{
               type:"text",
               text: field.value
           }]})
          
           fetch(URL, {
             method:"post",
             headers: {
               'Content-Type': 'application/json',
               'X-API-TOKEN':'<seu_token>'
             },
             body: body
           }).catch(function(err){
             console.error("Não foi possível achar a informação", err)
           })
         })
       })
     });
   });
 });

1.2. Vamos criar mais um formulário, que utilizaremos para enviar mensagem RCS:

<?php include("includes/header.php") ?>
<?php include("database/connect.php") ?>
 <div class="row">
   <div class="col-md-12 mt-5">
     <h1 class="text-center">Enviar Mensagem RCS</h1>
     <br />
   </div>
 </div>
 <div class="row">
   <div class="col-md-5 mx-auto">
     <form id="form-message">
       <div class="form-group">
         <label for="">Mensagem</label>
         <textarea name="message" id="" cols="" rows="3"
           class="form-control"></textarea>
       </div>
       <div class="form-group">
         <button type="submit" name="submit" class="btn btn-primary">Submit</button>
       </div>
     </form>
   </div>
 </div>
<div id="output"></div>
<?php include("includes/footer.php") ?>

1.3. Preencha o formulário enviando as mensagens para os clientes cadastrados. Para todos os clientes cadastrados no banco de dados, uma mensagem será enviada. Exemplo abaixo: