Skip to main content

Technical Guide: How to fetch a PDF via API and display it in the Chatbot

  • Updated

Index

  1. Step 1: Fetch the data (HTTP Request) 

  2. Step 2: Format for WhatsApp (Execute Script) 

  3. Step 3: Display to the User (Dynamic Content) 

 

To send files (such as bank slips or reports) generated via an external API, it is necessary to configure three steps in the Actions of your block in the Builder:

 

Step 1: Fetch the data (HTTP Request) 

First, it is necessary to make a request to the API to obtain the file URL.

  1. In the desired block, go to the Actions tab.

  2. Add an Input Action (or Output, depending on the flow).

  3. Choose HTTP Request;

  1. Method: Select GET (or POST, according to your API documentation).

  2. URL: Enter the API endpoint.

  3. Headers: If your API requires authentication (API Key, Bearer Token), enter it here.

  4. Response Body: Define a variable name to save the return. 

    Example: respostaApi

Step 2: Format for WhatsApp (Execute Script) 

Blip requires data to be sent in the LIME standard to ensure the correct rendering of the file. Use a Script to perform this format conversion:

  1. Add an Execute Script action:

  1. Input Variable: Enter the variable from the previous step (apiResponse).

  2. Script: Copy and paste the code below (JavaScript):

JavaScript
function run(respostaApi) {
    try {
        // 1. Converte o texto da resposta em um objeto JSON
        var dados = JSON.parse(respostaApi);
        // 2. IMPORTANTE: Ajuste o caminho abaixo conforme o retorno da sua API
        // Exemplo: se sua API retorna { "documento": { "pdf": "https://..." } }
        // Você deve usar: dados.documento.pdf
        var linkDoArquivo = dados.link_do_pdf; 
        // 3. Monta a estrutura de "Media Link" para o WhatsApp
        var estruturaMensagem = {
            "type": "application/vnd.lime.media-link+json",
            "value": {
                "title": "Seu Boleto", // Título que aparece para o usuário
                "text": "Clique para baixar", // Texto de apoio
                "type": "application/pdf", // Tipo do arquivo
                "uri": linkDoArquivo // A URL extraída da API
            }
        };
        // 4. Retorna o JSON pronto para uso
        return JSON.stringify(estruturaMensagem);
    } catch (erro) {
        return null; // Retorna nulo em caso de erro
    }
}

  1. Output Variable: Define a name for the variable that will hold the ready content. 

    Example: dynamicContent

Step 3: Display to the User (Dynamic Content) 

Display the result in the flow following these steps:

  1. Access the Content tab of the current block.

  2. Remove existing text bubbles, if any.

  3. Select the Dynamic Content option (gear/list icon):

  1. Type (MIME Type): application/vnd.lime.media-link+json

  2. Content: Enter the script output variable between double curly braces. 

    Example: {{dynamicContent}}

 

For more information, visit the discussion on the subject at our community or videos on our channel. 😃

Related articles