Come collegare n8n a Workflow Webhooks

Panoramica dei casi d'uso

Questa configurazione collega il Suo workflow relativo alle e-mail post-acquisto in n8n con Workflow Webhooks, in modo che Lei possa raccogliere i dati dei clienti per un audit SEO mensile e trasmetterli a Shopify Flow.

In questo esempio, il cliente riceve un’e-mail contenente un modulo di sondaggio (utilizziamo Google Forms, che inserisce i dati in un foglio di calcolo di Google) in cui vengono richieste le seguenti informazioni:

• Qual è l'URL del Suo negozio su Shopify?
• Qual è la Sua sfida più grande in materia di SEO in questo momento? Con le seguenti opzioni: slow traffic growth, poor product rankings, thin content, technical errors
• Da quanto tempo gestisce il Suo negozio? Con le seguenti opzioni: less than 6 months, 6–12 months, 1–3 years, 3+ years
• L'indirizzo e-mail utilizzato per l'ordine presso il negozio?

Quando il cliente invia il modulo, n8n invia le risposte al Suo endpoint Workflow Webhooks. Shopify Flow può quindi assegnare un tag al cliente e aggiungere una nota, in modo che il Suo team SEO possa visualizzare immediatamente il contesto nell’area di amministrazione di Shopify.

Cosa fa questo workflow

Dopo che il cliente ha inviato il modulo presente nel Suo flusso di posta elettronica, i dati vengono inseriti nel foglio di calcolo; da lì, n8n invia i dati al webhook Workflow Webhooks e il webhook invia questo payload all’indirizzo Shopify Flow:

{
  "name": "Saad",
  "email": "customer@example.com",
  "store_url": "mystore.myshopify.com",
  "seo_challenge": "poor product rankings",
  "store_age": "1-3 years"
}

Il Suo workflow Shopify Flow sarà quindi il seguente:

• aggiunge il tag cliente seo-audit-pending
• aggiunge una nota relativa al cliente contenente l'URL del negozio e la sfida SEO

Ciò consente al Suo team di aprire facilmente la scheda del cliente nell’area amministrativa di Shopify e di verificare quali aspetti richiedono attenzione prima dell’inizio dell’audit.

Guida video

Qui potete vedere il video dell'intera configurazione; il video è privo di audio. È possibile aumentare o diminuire la velocità del video in base alle proprie esigenze.

Prima di iniziare

• Installi e attivi "Workflow Webhooks" nel Suo negozio Shopify.
• Si assicuri di disporre di un workflow Shopify Flow già pronto oppure ne crei uno nuovo all’indirizzo Shopify Flow.
• Crei il Suo modulo di registrazione nello strumento che alimenta il Suo workflow n8n. Io utilizzo Google Form: una volta inviato il modulo, viene creata una voce nei fogli di calcolo di Google. dati ricevuti dal modulo Google nel foglio di calcolo
• Si assicuri di raccogliere l'indirizzo e-mail del cliente esattamente così come risulta su Shopify, in modo che Shopify Flow possa identificare il cliente corretto.

Configurare la connessione

In Workflow Webhooks, crei il webhook.

Inserisca il nome e generi un token statico (può creare il token statico immediatamente premendo il pulsante "magico" contrassegnato con il numero 3 nell'immagine seguente), quindi salvi.

Nelle “Impostazioni avanzate” assegni un nome alle variabili che desidera ricevere:

• name
• email
• store_url
• seo_challenge
• store_age

Nelle impostazioni sono presenti 4 variabili, che abbiamo associato a nome, e-mail, store_url e seo_challenge; abbiamo inoltre selezionato l’opzione “Consenti corpo della richiesta personalizzato” per ricevere altre informazioni, come ad esempio store_age.

Nel trigger di Google Sheet, selezioni il foglio corretto che desidera monitorare e crei una voce di prova nel modulo per visualizzare i dati.

Selezionare quindi l'azione "Richiesta HTTP" per inviare i dati del modulo al webhook creato tramite l'app Workflow Webhooks.

Potete seguire la procedura indicata in fondo alla pagina Workflow Webhooks relativa al webhook, specificando i campi mappati, il token API e l’URL del webhook.

Ho inserito l'URL, selezionato il metodo POST e aggiunto le intestazioni in questo modo nell'azione "Richiesta HTTP" di n8n.

Ho quindi associato le variabili create nel webhook alle domande effettive. Nel video dimostrativo potrete vedere come trascino e rilascio le risposte nei campi. Ho aggiunto anche la variabile store_age, che si trovava sotto la pagina scorrevole e non era visibile nello screenshot.

Esegua quindi l'operazione e visualizzi i dati inviati da n8n al Suo webhook nell'app Workflow Webhooks. Nella sezione "Invocazioni", potrà verificare che il sistema esterno abbia richiamato questo webhook e visualizzare anche il payload. Potrà utilizzare tale payload nel Suo Shopify Flow per eseguire qualsiasi azione.

Poiché il Suo webhook ha ricevuto correttamente i dati da n8n, salvi e pubblichi il workflow.

In Shopify Flow, crei un workflow che si avvii quando vengono ricevuti i dati del Suo webhook tramite Workflow Webhooks. Successivamente, nel trigger del webhook, clicchi su “Registra eventi”.

Ora torni alla precedente chiamata al webhook ed esegua la riproduzione del webhook per inviare questo payload al Suo trigger webhook in Shopify Flow.

Ora, nei dati, è possibile visualizzare il payload e anche l'ID del webhook.

È possibile visualizzare lo stesso webhook nella dashboard dei webhook e utilizzarlo per identificare il proprio webhook.

A questo punto, aggiunga la condizione: se l’ID del webhook ricevuto corrisponde all’ID del webhook che ha creato per il flusso n8n, esegua le azioni relative al modulo. Poiché ogni trigger Webhook riceve i dati inviati a qualsiasi URL di webhook nell’app Workflow Webhooks, tale ID La aiuterà a selezionare i dati pertinenti dal webhook per uno scopo specifico.

Utilizzi il valore dell’e-mail in arrivo per individuare il cliente corrispondente tramite la query avanzata. Nella query può utilizzare l’indirizzo e-mail, che viene ricavato dalle variabili di trigger del webhook. Nel mio caso, il campo “fieldTwo” corrisponde all’indirizzo e-mail. La mia query è la seguente: email:"{{fieldTwo}}"

Ora verifichi se il cliente esiste. Sto verificando se l’ID del cliente esiste.

](https://shopify.github.io/liquid/basics/whitespace/) {{- -}} {%- e -%} per rimuovere gli spazi bianchi dal lato sinistro o destro dell’ID cliente. Se sono presenti spazi bianchi, la query non funzionerà.

{%- for getCustomerData_item in getCustomerData -%}
  {{-getCustomerData_item.id-}}
{%- endfor -%}

Aggiunga o aggiorni la nota relativa al cliente indicando l’URL del negozio e la sfida SEO. Per recuperare il cliente, nella configurazione ho utilizzato questo codice per inserire l’ID cliente; ho impiegato il controllo degli spazi bianchi nella sintassi dei tag {{-, -}}, {%- e -%} per rimuovere gli spazi bianchi dal lato sinistro o destro dell’ID cliente. Se sono presenti spazi bianchi, la query non funzionerà.

{%- for getCustomerData_item in getCustomerData -%}
  {{-getCustomerData_item.id-}}
{%- endfor -%}

Attivi il workflow, invii una risposta di prova dal Suo modulo e verifichi che il record cliente corretto in Shopify riceva il tag e la nota.

Il funzionamento è il seguente: invio del modulo -> N8N riceve i dati -> N8N invia i dati al webhook Workflow Webhooks -> il webhook Workflow Webhooks attiva il trigger del flusso Shopify Flow -> si filtra il trigger del flusso in base all’ID del webhook -> quindi si recupera il cliente in base all’ID -> si verifica se il cliente è presente -> si aggiunge il tag -> si aggiunge la nota

Per il cliente, l'etichetta e la nota appaiono come nell'immagine seguente.