Meta/Facebook API Conversion

Siccome il Pixel Facebook è stato parzialmente bloccato a causa dei suoi utilizzi non sempre legali,
il buon Zuckerberg ha deciso di adottare lo stratagemma dei ristoranti che vengono chiusi a causa della violazione delle norme igieniche:

Aprire un nuovo locale nello stesso palazzo cambiando il nome dell'insegna.

Allo stesso modo, siccome il Pixel di Facebook è stato bannato, hanno creato un nuovo motore che esegue esattamente gli stessi tracciamenti illegali di prima, ma sposta la responsabilità di queste azioni verso l'utente che li utilizza facendo hostare il software direttamente da lui.
Ora un manipolo di mercenari addetti al marketing stanno facendo consulenza alla nostra azienda esaltando queste API Conversion come il futuro delle campagne pubblicitarie.
La guida per attivarle è la seguente:

• https://developers.facebook.com/docs/marketing-api/conversions-api/guides/gateway/setup
• https://developers.facebook.com/docs/marketing-api/conversions-api/guides/gateway/configuration

API Conversion come gateway

Si tratta di una rapina, il costo è di all'incirca 1.000€ all'anno solo per creare una macchina che traccia.
L'abbiamo esclusa.

I passi riassunti sono:

• Creazione di una nuova istanza EC di AWS (M5.large la minima, cosa un puttanaio)
• Creazione di un nuovo dominio per ospitarla (fbapiconversion.designbest.com nel nostro caso)
• Facebook/Meta prende possesso della macchina e installa l'applicazione
• Essendo già presente il vecchio Pixel, riesce a fare le stesse cose bypassando le leggi che lo bloccavano

Dettagli tecnici

Per accedere a https://fbapiconversion.designbest.com/

User: s.vincenzi@webmobili.it
Pass: W3bm0b1l!_2022

Per accedere all'admin di AWS usare le solite credenziali di Route 53.
L'istanza EC ha IP PUBBLICO: 3.239.69.3544.197.193.31
Si tratta di una Ubuntu 20.04, per potersi connettere alla console è necessario aggiungere la regola SSH per la porta 22 dal pannello di gestione (noi l'abbiamo fatto e poi l'abbiamo tolta).

API Conversion implementazione manuale

Prima di tutto dal profilo di Facebook Businness, attivare le API Conversion e verrà fornito un TOKEN.
Con questo e il Pixel ID sarà possibile creare l' endpoint così

https://graph.facebook.com/<FBGRAPHVERSION>/<PIXELID>/events?access_token=<TOKEN>

Attualmente abbiamo:

FBGRAPHVERSION:  v15.0
PIXELID:         507678989608118
TOKEN:           EAAI9me5dqpIBAFHpn9Y5sptiJ7ZCxRDImuY2hs4jgzBChCyZC7zbgHs9vueFulhjz7cZC1kx5EFnOZC2G9EHgwVJXE66bDi3e98IjHWF48R4qktCuJZALNYEaAFjcTwdnay4QLdfTc8NXJGrpj9hlzAVqCLesiZCBQpoTTZAxDO7F8jrnHyJjZCd

• Si tratta fondamentalmente di fare chiamate alla REST-API di Facebook.
• Ognuna delle chiamate va piazzata nel codice a seconda dell'evento che rappresenta.
• Ogni chiamata alle API Conversion va messa in coppia alla classica fbq() del pixel.
• Per evitare duplicati è necessario passare il parametro event_id, lo stesso per entrambe le chiamate.

Eventi

Gli eventi principali che tracciamo sono

• PageView - Tutte le pagine
• Lead - Dopo aver inviato un messaggio da qualsiasi form
• Search - Atterraggio dopo una ricerca testuale (parametro: ricerca utente)
• CompleteRegistration - Dopo la registrazione di un utente
• AddToWishlist - Ogni volta che si aggiunge un prodotto alla Wishlist (parametro: id prodotto)

L'elenco degli eventi standard è disponibile qui
https://developers.facebook.com/docs/meta-pixel/reference#standard-events

Per ognuno di questi eventi, se le ho disponibile, specifico queste UserData

• User IP
• Nome
• Cognome
• Email
• Genere
• CAP
• Telefono

passate sotto l' algoritmo SHA256

La Chiamata

Creare il seguente payload di base:

// let userData= ...
// let customData = ...
// let testCode = ...
//let eventName = ...
let payload = {
	"data": [{
		"event_name": eventName,
		"event_time": Math.round(new Date().getTime() / 1000),
		"action_source": "website",
		"event_id": eventId,
		"event_source_url": location.href,
		"user_data": {
			"client_ip_address": "ip" in userData ? userData.ip : null,
			"client_user_agent": navigator.userAgent,
			"fn": [
				"name" in userData ? sha256(userData.name) : null
			],
			"ln": [
				"surname" in userData ? sha256(userData.surname) : null
			],
			"em": [
				"email" in userData ? sha256(userData.email) : null
			],
			"ge": [
				"gender" in userData ? sha256(userData.gender) : null
			],
			"zp": [
				"zip" in userData ? sha256(userData.zip) : null
			],
			"ph": [
				"phone" in userData ? sha256(userData.phone) : null
			]
		},
		"custom_data": customData
	}]
};
if (testCode) payload["test_event_code"] = testCode;

L'algoritmo consigliato per creare lo SHA256 è qui https://geraintluff.github.io/sha256/

E fare la chiamata in POST

let endpoint = "https://graph.facebook.com/" + fbGraphVersion + "/" + fbPixelID + "/events?access_token=" + fbToken;

fetch(endpoint, {
	method: "POST",
	headers: { "Content-Type": "application/json" },
	body: JSON.stringify(payload),
})
  .then((response) => response.text())
  .then((data) => console.log(data));

All'interno del portale, la chiamata alle API Conversion dovrà essere fatta in coppia con quella del FacebookPixel, passando ad entrambe lo stesso parametro EventID
Es.

let eventID = "pageView." .Date.now();
fbq('track', 'PageView', {}, { eventID: eventID });  // Facebook Pixel
designbestConversion({ }, eventID);  // API Conversion