Flow Builder (o Flows) è il motore di automazione visiva di Bird per creare flussi di lavoro di comunicazione tra canali — non è richiesto alcun codice, anche se può essere esteso con codice personalizzato.

Perché usare Google Cloud Functions con Flows?

Cloud Functions ti permettono di eseguire codice serverless per elaborare dati (come analizzare immagini o recuperare dati da API esterne) e reintegrare i risultati nel tuo flusso.

Cosa fa Google Vision API in questo setup?

Esegue l'analisi delle immagini — identificando oggetti, etichette o concetti (come “hot dog”) — e restituisce dati strutturati al tuo Flow.

Come posso collegare una Cloud Function a Flow Builder?

Usa il passo Fetch Variables per chiamare l'endpoint HTTPS pubblico della funzione. La risposta (ad esempio, { "isHotDog": true } ) può essere utilizzata nei passaggi successivi.

Può essere utilizzato per casi aziendali reali?

Assolutamente. Lo stesso approccio può convalidare le foto di consegna, rilevare articoli danneggiati, riconoscere documenti o verificare i media caricati.

Cosa rende questa integrazione potente?

Combina AI vision , serverless flexibility e multichannel communication , consentendo automazioni più intelligenti senza dover mantenere l'infrastruttura.

Ho bisogno di esperienza di coding per seguire?

La familiarità di base con JavaScript (per la Google Cloud Function) aiuta, ma la maggior parte del processo — dalla connessione dei canali alla logica di flusso — è visiva e adatta ai principianti.

Come utilizzare Flows con Google Vision API e Google Cloud Functions

Uccello

6 ott 2020

Costruttore di Flussi

1 min read

Come utilizzare Flows con Google Vision API e Google Cloud Functions

Conclusioni principali

- Flows è più di un semplice strumento senza codice — è un motore di automazione flessibile che ti permette di estendere i flussi di lavoro con codice utilizzando servizi esterni come Google Cloud Functions o AWS Lambda.
- Questo tutorial dimostra come costruire un chatbot di Telegram che utilizza Google Vision API per identificare immagini (come rilevare se una foto contiene un hotdog 🥪).
- L'esempio mostra come Flows possa connettersi facilmente a API di riconoscimento delle immagini per elaborare automaticamente il contenuto inviato dagli utenti.
- Gli sviluppatori possono sfruttare questa architettura per costruire automazioni nel mondo reale, come la verifica delle consegne, i controlli delle identità o i flussi di lavoro di controllo qualità.
- Integrare Google Vision API in una Cloud Function abilita intuizioni potenziate dall'IA (rilevamento degli oggetti, fiducia nelle etichette, estrazione dei metadati) su cui Flows può agire in modo dinamico.
- Il passaggio “Fetch Variables” in Flow Builder è il ponte — chiama la funzione cloud e memorizza la risposta dell'API per un uso successivo nella conversazione.
- I blocchi di risposta possono utilizzare variabili come {{isHotDog}} per personalizzare le risposte, trasformando i dati grezzi in messaggi di chat contestuali.
- Sebbene la demo sia giocosa, dimostra come gli sviluppatori possano mixare logica no-code con funzioni serverless per sbloccare potenti capacità di automazione attraverso i canali di messaggistica.

Q&A Highlights

Cos'è Flow Builder?
Flow Builder (o Flows) è il motore di automazione visiva di Bird per creare flussi di lavoro di comunicazione tra canali — non è richiesto alcun codice, anche se può essere esteso con codice personalizzato.
Perché usare Google Cloud Functions con Flows?
Cloud Functions ti permettono di eseguire codice serverless per elaborare dati (come analizzare immagini o recuperare dati da API esterne) e reintegrare i risultati nel tuo flusso.
Cosa fa Google Vision API in questo setup?
Esegue l'analisi delle immagini — identificando oggetti, etichette o concetti (come “hot dog”) — e restituisce dati strutturati al tuo Flow.
Come posso collegare una Cloud Function a Flow Builder?
Usa il passo Fetch Variables per chiamare l'endpoint HTTPS pubblico della funzione. La risposta (ad esempio, { "isHotDog": true }) può essere utilizzata nei passaggi successivi.
Può essere utilizzato per casi aziendali reali?
Assolutamente. Lo stesso approccio può convalidare le foto di consegna, rilevare articoli danneggiati, riconoscere documenti o verificare i media caricati.
Cosa rende questa integrazione potente?
Combina AI vision, serverless flexibility e multichannel communication, consentendo automazioni più intelligenti senza dover mantenere l'infrastruttura.
Ho bisogno di esperienza di coding per seguire?
La familiarità di base con JavaScript (per la Google Cloud Function) aiuta, ma la maggior parte del processo — dalla connessione dei canali alla logica di flusso — è visiva e adatta ai principianti.

Flows è un potente motore di automazione drag-and-drop per la creazione di flussi di comunicazione. Inizialmente lo avevamo concepito come una soluzione no-code, ma abbiamo scoperto che molti utenti potevano ottenere comportamenti davvero potenti scrivendo un po' di codice per casi d'uso specifici. Questi pezzi di codice possono essere all'interno di Flow Builder, oppure possono essere funzioni cloud di terze parti come le funzioni AWS Lambda o Google Cloud Functions.

Questa è una semplice dimostrazione utilizzando GoogleCloud Functions e Flows per eseguire il riconoscimento delle immagini su un'immagine inviata su Telegram.

Flussi e Beyond

Come sviluppatore di Flows, spesso penso a chi sono i nostri utenti, perché usano Flows e cosa devono fare per raggiungere i loro obiettivi; e quindi, quali funzionalità dobbiamo implementare per servire al meglio quegli utenti.

Flows è un potente motore di automazione drag-and-drop per la creazione di flussi di comunicazione. Inizialmente lo abbiamo concepito come una soluzione senza codice, ma abbiamo scoperto che molti utenti potevano ottenere comportamenti davvero potenti scrivendo un po' di codice per casi d'uso specifici. Ad esempio, puoi creare flussi che automaticamente generano lead e casi in Salesforce basati sulle interazioni dei clienti su più canali. Questi frammenti di codice possono essere all'interno di Flows, oppure possono essere funzioni cloud di terze parti come funzioni AWS Lambda o Google Cloud Functions.

Un caso d'uso interessante: Riconoscimento Immagini

Per un esempio breve e divertente, ti mostrerò come implementare un'app che riconosce hot dog. Imposteremo un flusso in Flows, che riceverà immagini dagli utenti e deciderà se hanno inviato un hot dog o meno.

Per molti dei nostri clienti, questo tipo di riconoscimento delle immagini può essere molto potente. Immagina di gestire un servizio di consegna e volessi verificare le consegne avvenute con successo automaticamente. Simile a ciò che sto per mostrare, potresti utilizzare dati di posizione, foto dei pacchi e persino firme dei destinatari per creare un flusso di verifica in Flows.

Un caso d'uso interessante: Riconoscimento Immagini

Un piano per il successo

Prima, imposteremo una funzione cloud, che riceve una richiesta con un URL di un'immagine, quindi utilizza un'API di riconoscimento delle immagini per elaborare l'immagine, e risponde se c'è un hotdog nell'immagine o meno.

Quindi costruiremo un flusso, che riceve un messaggio da un utente tramite un canale di messaggistica (Telegram in questo caso), esegue la funzione cloud sopra, e risponde all'utente se c'è un hotdog in una foto che ha inviato.

Configurazione della Google Cloud Function

Per prima cosa, dovremo configurare una funzione cloud. Per iniziare rapidamente, segui il tutorial introduttivo sulle Funzioni Cloud di Google. Come ‘Trigger’ scegli Trigger HTTP, ambiente di esecuzione: Node.js 10, e nel campo del codice sorgente inserisci il frammento di codice. È un codice semplice, che verifica se la richiesta contiene codice JSON e risponde sì o no.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (req, res) => {
  let message = req.query.url ? "yes" : "no";
  res.setHeader('Content-Type', 'application/json');
  res.status(200).send(JSON.stringify({ isHotDog: message }));
 };

Google Cloud Console interface with options for creating a new Cloud Function.

Successivamente, dovrai distribuire questa funzione. Per testarla all'interno di Google Cloud Platform, segui i passaggi del tutorial.

Per testarla dal tuo browser, vai al seguente URL inserendo l'indirizzo specifico per la tua funzione:

https://your-function-address.cloudfunctions.net/HotDogOrNot/?url=hello dovrebbe restituire {“isHotDog”: true} e l'indirizzo https://your-function-address.cloudfunctions.net/HotDogOrNot dovrebbe restituire {“isHotDog”: false}.

Bel lavoro! Hai configurato una funzione cloud di Google. Ora dobbiamo rendere la nostra funzione cloud più intelligente.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (req, res) => {
  let message = req.query.url ? "yes" : "no";
  res.setHeader('Content-Type', 'application/json');
  res.status(200).send(JSON.stringify({ isHotDog: message }));
 };

Successivamente, dovrai distribuire questa funzione. Per testarla all'interno di Google Cloud Platform, segui i passaggi del tutorial.

Per testarla dal tuo browser, vai al seguente URL inserendo l'indirizzo specifico per la tua funzione:

Bel lavoro! Hai configurato una funzione cloud di Google. Ora dobbiamo rendere la nostra funzione cloud più intelligente.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (req, res) => {
  let message = req.query.url ? "yes" : "no";
  res.setHeader('Content-Type', 'application/json');
  res.status(200).send(JSON.stringify({ isHotDog: message }));
 };

Successivamente, dovrai distribuire questa funzione. Per testarla all'interno di Google Cloud Platform, segui i passaggi del tutorial.

Per testarla dal tuo browser, vai al seguente URL inserendo l'indirizzo specifico per la tua funzione:

Bel lavoro! Hai configurato una funzione cloud di Google. Ora dobbiamo rendere la nostra funzione cloud più intelligente.

Configurazione di Google Vision API

Per renderlo più intelligente, aggiungiamo il riconoscimento delle immagini. A tal fine, utilizzeremo il Google Vision API. Per iniziare, segui i passaggi da 1 a 4 nella guida rapida di Vision API. Nel tutorial attiverai il Vision API e creerai un account di servizio per utilizzarlo.

Ora torna alla funzione cloud che hai creato. Attiva "Variabili d'ambiente, networking, timeout e altro" e nel file "Service account" scegli l'account di servizio VisionAPI che hai appena creato. Ora possiamo accedere al Vision API all'interno della nostra funzione.

Advanced options interface of a cloud service configuration.

Ora cambiamo il codice. Nella scheda "Package.json", inserisci questo codice. Aggiungerà la libreria Google Vision API come dipendenza alla tua funzione.

{
  "name": "sample-http",
  "version": "0.0.1",
  "dependencies": {
  "@google-cloud/vision": "^1.11.0"
  }
 }

nella scheda "Index.js" aggiorna il codice esistente con il seguente frammento di codice.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (request, response) => {
  var url = request.query.url || request.body.url;
  if (url == null || url == "" ) {
  response.status(400).json({ error: "Must include a 'url' query parameter." });
  }
  
  
  getImageLabels(url)
  .then(labels => {
  // You can use 'console.log(labels);' command to check labels you got
  // We filter all labels if they contain "hot dog" in label description
  // And have a score > 0.6, which mean that VisionAPI is at least 60% sure that there is a hotdog on a picture
  labels = labels.filter(function(label) {
  return label.description.toLowerCase().includes("hot dog") && label.score > 0.6;
  });
  
  // If labels array contains at least 1 element, then we found a hot-dog!
  if (labels.length > 0) {
  response.status(200).json({isHotDog: true, error: ""});
  } else {
  response.status(200).json({isHotDog: false, error: ""});
  }
  })
  .catch(err => {
  response.status(500).json({ error: err });
  });
 };
  
 async function getImageLabels(imageUrl) {
  // Imports the Google Cloud client library
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  // Performs label detection on the image file
  const [result] = await client.labelDetection(imageUrl);
  const labels = result.labelAnnotations;
  return labels
 }

Development environment displaying the code for a package.json file.

Qual è la differenza rispetto alla versione precedente? Abbiamo aggiunto una richiesta a VisionAPI, che restituisce le ‘labels’ che ha trovato sull'immagine. Poi filtri queste etichette per descrizione: se contiene “hot dog” e se ha una fiducia superiore al 60% in quell'etichetta. Se rimane almeno 1 etichetta dopo il filtraggio, significa che abbiamo trovato un hotdog sull'immagine.

Per capire come funziona Google Vision API e per visualizzare esempi di risposte, consulta la documentazione ufficiale di Vision API.

Dopo di che, distribuisci la nuova versione della nostra funzione. Per testarlo dal tuo browser, trova qualsiasi immagine di un hotdog e salva il suo URL. Ora vai all'URL della tua funzione (inserendo l'indirizzo corretto per la tua funzione) https://your-function-address.cloudfunctions.net/HotDogOrNot?url=url_to_image e sostituisci "url_to_image" con un URL all'immagine trovata. Se c'è un hotdog nell'immagine, la pagina restituirà {“isHotDog”: true}.

Ora connettiamo questa funzione a Flow Builder.

Ora cambiamo il codice. Nella scheda "Package.json", inserisci questo codice. Aggiungerà la libreria Google Vision API come dipendenza alla tua funzione.

{
  "name": "sample-http",
  "version": "0.0.1",
  "dependencies": {
  "@google-cloud/vision": "^1.11.0"
  }
 }

nella scheda "Index.js" aggiorna il codice esistente con il seguente frammento di codice.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (request, response) => {
  var url = request.query.url || request.body.url;
  if (url == null || url == "" ) {
  response.status(400).json({ error: "Must include a 'url' query parameter." });
  }
  
  
  getImageLabels(url)
  .then(labels => {
  // You can use 'console.log(labels);' command to check labels you got
  // We filter all labels if they contain "hot dog" in label description
  // And have a score > 0.6, which mean that VisionAPI is at least 60% sure that there is a hotdog on a picture
  labels = labels.filter(function(label) {
  return label.description.toLowerCase().includes("hot dog") && label.score > 0.6;
  });
  
  // If labels array contains at least 1 element, then we found a hot-dog!
  if (labels.length > 0) {
  response.status(200).json({isHotDog: true, error: ""});
  } else {
  response.status(200).json({isHotDog: false, error: ""});
  }
  })
  .catch(err => {
  response.status(500).json({ error: err });
  });
 };
  
 async function getImageLabels(imageUrl) {
  // Imports the Google Cloud client library
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  // Performs label detection on the image file
  const [result] = await client.labelDetection(imageUrl);
  const labels = result.labelAnnotations;
  return labels
 }

Per capire come funziona Google Vision API e per visualizzare esempi di risposte, consulta la documentazione ufficiale di Vision API.

Ora connettiamo questa funzione a Flow Builder.

Ora cambiamo il codice. Nella scheda "Package.json", inserisci questo codice. Aggiungerà la libreria Google Vision API come dipendenza alla tua funzione.

{
  "name": "sample-http",
  "version": "0.0.1",
  "dependencies": {
  "@google-cloud/vision": "^1.11.0"
  }
 }

nella scheda "Index.js" aggiorna il codice esistente con il seguente frammento di codice.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (request, response) => {
  var url = request.query.url || request.body.url;
  if (url == null || url == "" ) {
  response.status(400).json({ error: "Must include a 'url' query parameter." });
  }
  
  
  getImageLabels(url)
  .then(labels => {
  // You can use 'console.log(labels);' command to check labels you got
  // We filter all labels if they contain "hot dog" in label description
  // And have a score > 0.6, which mean that VisionAPI is at least 60% sure that there is a hotdog on a picture
  labels = labels.filter(function(label) {
  return label.description.toLowerCase().includes("hot dog") && label.score > 0.6;
  });
  
  // If labels array contains at least 1 element, then we found a hot-dog!
  if (labels.length > 0) {
  response.status(200).json({isHotDog: true, error: ""});
  } else {
  response.status(200).json({isHotDog: false, error: ""});
  }
  })
  .catch(err => {
  response.status(500).json({ error: err });
  });
 };
  
 async function getImageLabels(imageUrl) {
  // Imports the Google Cloud client library
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  // Performs label detection on the image file
  const [result] = await client.labelDetection(imageUrl);
  const labels = result.labelAnnotations;
  return labels
 }

Per capire come funziona Google Vision API e per visualizzare esempi di risposte, consulta la documentazione ufficiale di Vision API.

Ora connettiamo questa funzione a Flow Builder.

Creating a flow in Flows

Accedi al Bird Dashboard o registrati per un account se non ne hai uno.

Se sei nuovo ai Flows e non hai impostato alcun canale, dovrai andare alla pagina di impostazione del Canale e scegliere di impostare il canale Telegram. Ho scelto Telegram per questa demo perché è facile e veloce da impostare.

Interface titled "Channel setup" with options to integrate communication platforms such as Telegram, Messenger, LINE, WeChat, SMS, WhatsApp, Email, and Instagram.

Ora hai un canale che possiamo utilizzare in Flows. Vai alla pagina Flows, crea un nuovo flow personalizzato e scegli il trigger del canale “Telegram”.

User interface for selecting a communication channel trigger, showing options such as Telegram, Facebook Messenger, Email, Incoming Order Activity, and Shopify Order.

Sarai reindirizzato a una pagina del flow, dove dovresti scegliere il tuo canale Telegram come trigger, nel nostro caso è “Hotdog”. Si prega di aggiungere 2 passaggi: “Fetch variables” e “Reply to channel message”.

All'interno del passaggio “Fetch variables” chiameremo la nostra funzione cloud e recupereremo la risposta nella variabile “isHotDog” che conterrà “true” o “false” come risposta dalla funzione GoogleClound. Nel campo URL inserisci l'URL della tua funzione https://your-function-address.cloudfunctions.net/HotDogOrNot e compila tutti gli altri campi come nell'immagine del "Fetch variable step content".

E all'interno del passaggio “Reply to channel message” risponderemo al cliente con un messaggio contenente la risposta sì o no. Per questo inserisci nel campo "Reply with message" il seguente testo "Hotdog nell'immagine? {{isHotDog}}".