Componente Aggiuntivo WebHooks

Introduzione

Puoi utilizzare il componente aggiuntivo WebHooks per inviare dati dai tuoi moduli a qualsiasi pagina o script personalizzato tu desideri. Questa pagina può eseguire attività di integrazione per trasformare, analizzare, manipolare e inviare i dati delle tue sottomissioni ovunque tu scelga.

Se stai sviluppando un'applicazione che necessita di essere aggiornata ogni volta che viene inviato un modulo, WebHooks fa per te. Il vantaggio dei WebHooks è che il passaggio dei dati è immediato e puoi inviare tutti i dati del modulo inviati contemporaneamente.

Che cos'è un WebHook?

Un WebHook è semplicemente una notifica push da iform4u a un altro server ogni volta che qualcuno invia i tuoi moduli.

Cosa puoi fare con un WebHook?

I WebHooks rendono più facile l'integrazione di due sistemi. L'uso più comune di un WebHook è alimentare i lead nel tuo CRM. Ma ci sono molte altre cose che potresti fare.

Di cosa hai bisogno?

La natura stessa di un WebHook presuppone che tu abbia la capacità di scrivere codice (o di convincere un amico o collega che lo faccia). Devi avere un server che possa accettare una richiesta POST (quella che riceveresti da una sottomissione del modulo) e essere in grado di scrivere uno script che faccia qualcosa in risposta.

Nota: iform4u supporta l'integrazione di molteplici WebHooks per modulo.

Crea un WebHook

Per creare un WebHook, devi eseguire i seguenti passaggi:

1. Vai al Gestore dei Componenti Aggiuntivi e clicca su WebHooks.
2. Clicca sul pulsante Crea un WebHook.
3. Apparirà un modulo utilizzato per configurare il WebHook:
   • Modulo: Seleziona il modulo che invierà le notifiche.
   • Chiave di Handshake: Questa è una chiave opzionale che scegli come meccanismo di autenticazione per prevenire spam al tuo WebHook. Questa chiave sarà inclusa come parametro POST quando i nostri server chiamano i tuoi. Se usi questa chiave, dovresti confrontarla con la tua copia per validare che la sottomissione sia legittima.
   • Url: L'URL dove si trova il tuo script.
   • Stato: Può essere:
     • Attivo: Invia notifiche
     • Disattivo: Non invia notifiche
   • Json: Può essere:
     • Attivo: Invia dati come stringa JSON
     • Disattivo: Invia dati come stringa URL Encoded
   • Alias: Può essere:
     • Attivo: Invia dati con Alias del Campo come chiave del parametro. Ad esempio, sostituisce 'text_0' con 'name'.
     • Disattivo: Invia dati con ID del Campo come chiave del parametro
   • Clicca su Crea.

Nota: Seleziona più moduli per creare lo stesso WebHook per ogni modulo.

Disabilita / Abilita un WebHook

Per interrompere temporaneamente un WebHook, puoi scegliere di disabilitarlo e abilitarlo successivamente. Per disabilitare un WebHook di un modulo, devi seguire questi passaggi:

1. Vai al Gestore dei Componenti Aggiuntivi e clicca su WebHooks.
2. Clicca sul pulsante Azioni del WebHook da disabilitare.
3. Clicca su Aggiorna.
4. Cambia lo Stato da Attivo a Disattivo o viceversa.
5. Clicca su Aggiorna.

Elimina un WebHook

Per eliminare un WebHook, devi eseguire i seguenti passaggi:

1. Seleziona la casella di controllo del WebHook da eliminare.
2. Clicca su Azioni in blocco.
3. Clicca su Elimina.
4. Successivamente apparirà un popup che ti chiederà di confermare la tua decisione di eliminare il WebHook.

Il Gestore dei WebHooks si ricaricherà e il WebHook selezionato sarà eliminato.

Invia dati come JSON

Per inviare i dati POST come stringa JSON, devi seguire questi passaggi:

1. Vai al Gestore dei Componenti Aggiuntivi e clicca su WebHooks.
2. Clicca sul pulsante Azioni del WebHook da disabilitare.
3. Clicca su Aggiorna.
4. Cambia il campo Json da Attivo a Disattivo o viceversa.
5. Clicca su Aggiorna.

Utilizzo dei WebHooks

Ora che sai cosa sono i WebHooks e come utilizzarli in iform4u, vediamo un esempio.

In questo tutorial invieremo notifiche da uno dei nostri moduli alla pagina: Beeceptor. Questa pagina cattura le nostre notifiche e le stampa sullo schermo.

Primi Passaggi:

1. Vai a https://beeceptor.com/
2. Inserisci un Nome Endpoint e
3. Premi il pulsante Crea Endpoint
4. Copia l'URL dell'Endpoint

Molto bene! Ora hai un URL che servirà a ricevere le notifiche inviate da iform4u.

Passaggi Successivi:

1. Vai a iform4u
2. Vai al Gestore dei Componenti Aggiuntivi e installa WebHooks
3. Ora, clicca su WebHooks.
4. Clicca sul pulsante Crea un WebHook.
5. Compila il modulo:
   • Modulo: Seleziona 'Mailing List'
   • Url: Incolla l'URL dell'Endpoint
   • Chiave di Handshake: Per questo esempio: my_handshake_key
   • Stato: Attivo
6. Clicca su Crea

Passaggi Finali: Testa le tue notifiche

1. Vai al Gestore dei Moduli
2. Clicca sul modulo 'Mailing List'
3. Clicca sul pulsante Pubblica e Condividi (l'icona a freccia verde)
4. Clicca su Condividi Link del Modulo
5. Deseleziona la casella e premi Vai!
6. Compila il modulo Mailing List e invia

Se la tua sottomissione viene ricevuta, apparirà un messaggio di successo.

Ora, vai all'URL dell'Endpoint (e senza ricaricare la pagina) vedrai che la notifica contiene:

• ID del Modulo
• Nome del Modulo
• IP Utente
• Dati della Sottomissione
• Chiave di Handshake

E questo è tutto! Hai inviato la tua prima notifica a un altro server. Congratulazioni!

Salvataggio delle sottomissioni del modulo in un database esterno

Ora che sappiamo come esportare le sottomissioni del modulo in tempo reale verso un'applicazione esterna, vedremo come possiamo memorizzare queste sottomissioni in un database.

Se hai un sito web, puoi eseguire i seguenti passaggi e memorizzare le sottomissioni del nostro Modulo Demo nel tuo database, devi solo cambiare l'URL del WebHook.

Nel tuo sito web:

1.- Crea un database: ' test '. Puoi farlo con il tuo software preferito, come phpMyAdmin o anche utilizzando il seguente comando MySQL:

CREATE DATABASE 'test';

2.- Crea una tabella nel database: ' subscribers ', con 4 campi: id, name, email e ip_ address . Puoi eseguire la seguente query MySQL:

CREATE TABLE `test`.`subscribers` (
    `id` INT(11) NOT NULL AUTO_INCREMENT ,
    `name` VARCHAR(255) NOT NULL ,
    `email` VARCHAR(255) NOT NULL ,
    `ip_address` VARCHAR(255) NOT NULL ,
 PRIMARY KEY (`id`)) ENGINE = InnoDB;

3.- Configura le informazioni del tuo database: 'test'. Il file saveToDB.php ti permette di configurare i seguenti parametri:

define('DB_SERVER', "localhost");
define('DB_USER', "root");
define('DB_PASSWORD', "");
define('DB_DATABASE', "test");
define('DB_DRIVER', "mysql");

4.- Carica il file @app/custom/saveToDB.php sul tuo server.