Integrazione di Slack per gli avvisi rivolti ai clienti
Adobe Experience Platform consente di utilizzare un proxy webhook in Adobe App Builder per ricevere Adobe I/O Events in Slack. Il proxy gestisce l'handshake di verifica di Adobe e trasforma i payload degli eventi in Slack messaggi, in modo da poter ricevere gli avvisi rivolti al cliente nella tua area di lavoro.
Prerequisiti prerequisites
Prima di iniziare, assicurati di disporre dei seguenti elementi:
- Accesso a Adobe Developer Console: ruolo Amministratore di sistema o Sviluppatore in un'organizzazione con App Builder abilitato.
- Node.js e npm: Node.js (consigliato LTS), che include npm per l'installazione delle dipendenze di Adobe CLI e del progetto. Per ulteriori informazioni, consulta la Guida introduttiva di Node.js e npm.
- Adobe I/O CLI: installa Adobe I/O CLI dal terminale:
npm install -g @adobe/aio-cli. - App Slack con webhook in ingresso: app Slack nell'area di lavoro con webhook in ingresso abilitato. Consulta Creare un'app Slack e la Guida ai webhook in arrivo di Slack per creare l'app e ottenere l'URL del webhook (formato:
https://hooks.slack.com/...).
Configurare un progetto basato su modelli templated-project
Per configurare un progetto basato su modelli, accedere a Adobe Developer Console, quindi selezionare Create project from template dalla scheda Home.
Selezionare il modello App Builder, quindi immettere un Project Title e selezionare Add workspace. Infine, selezionare Save.
Riceverai la conferma che il progetto è stato creato e che verrà visualizzata la scheda Project overview. Da qui puoi aggiungere Project description.
Inizializza progetto initialize-project
Dopo aver configurato il progetto basato su modelli, inizializza il progetto.
-
Apri il terminale e immetti il seguente comando per accedere ad Adobe I/O.
code language-bash aio login -
Inizializza l’applicazione e fornisci un nome.
code language-bash aio app init slack-webhook-proxy -
Seleziona
Organizationutilizzando i tasti freccia, quindi selezionaProjectcreato in precedenza in Developer Console. SelezionareOnly Templates Supported By My Orgper i modelli da cercare.
-
Quindi, premi Invio per saltare i modelli e installare un'applicazione autonoma.
-
Specifica le funzioni dell’app Adobe I/O da abilitare per questo progetto. Utilizzare i tasti freccia per scorrere e selezionare
Actions: Deploy Runtime actions.
-
Utilizzare i tasti freccia per scorrere e selezionare
Adobe Experience Platform: Realtime Customer Profileper il tipo di azioni di esempio che si desidera creare.
-
Scorrere e selezionare
Pure HTML/JSper l'interfaccia utente da aggiungere al modello. Premi Invio per lasciare le azioni di esempio come predefinite, quindi premi di nuovo Invio per lasciare il nome come predefinito.
Ricevi una conferma del completamento dell’inizializzazione dell’app.
-
Passa alla directory del progetto.
code language-bash cd slack-webhook-proxy -
Aggiungi l’azione web.
code language-bash aio app add action -
Seleziona
Only Action Templates Supported By My Org. Viene visualizzato un elenco di modelli.
-
Seleziona il modello premendo la barra spaziatrice, quindi passa a
@adobe/generator-add-publish-eventsutilizzando le frecce Su e Giù. Infine, selezionare il modello premendo Barra spaziatrice e premere Invio.
Viene visualizzata una conferma dell'installazione di
npm package @adobe/generator-add-publish-events. -
Denomina l'azione
webhook-proxy.
Viene visualizzata una conferma dell’installazione del modello.
Creare le azioni file e distribuire create-file-actions
Aggiungi il codice proxy, imposta le variabili di ambiente, quindi distribuisci. L’azione sarà quindi disponibile in Developer Console per la registrazione.
Implementare il proxy runtime runtime-proxy
Passare alla cartella del progetto e aprire il file actions/webhook-proxy/index.js. Eliminare il contenuto e sostituirlo con il seguente:
const fetch = require("node-fetch");
const { Core } = require("@adobe/aio-sdk");
/**
* Adobe I/O Events to Slack Runtime Proxy
*
* Receives events from Adobe I/O Events and forwards them to Slack.
* Signature verification and challenge handling are automatic when
* using Runtime Action registration (non-web action).
*/
async function main(params) {
const logger = Core.Logger("runtime-proxy", { level: params.LOG_LEVEL || "info" });
try {
logger.info(`Event received: ${JSON.stringify(params)}`);
// Forward to Slack
return forwardToSlack(params, params.SLACK_WEBHOOK_URL, logger);
} catch (error) {
logger.error(`Error: ${error.message}`);
return { statusCode: 500, body: { error: "Internal server error" } };
}
}
/**
* Forwards the event payload to Slack
*/
async function forwardToSlack(payload, webhookUrl, logger) {
if (!webhookUrl) {
logger.error("SLACK_WEBHOOK_URL not configured");
return { statusCode: 500, body: { error: "Server configuration error" } };
}
// Extract Adobe headers passed to runtime action
const headers = {
"x-adobe-event-code": payload["x-adobe-event-code"],
"x-adobe-event-id": payload["x-adobe-event-id"],
"x-adobe-provider": payload["x-adobe-provider"]
};
const slackMessage = buildSlackMessage(payload, headers);
const response = await fetch(webhookUrl, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(slackMessage)
});
if (!response.ok) {
const errorText = await response.text();
logger.error(`Slack API error: ${response.status} - ${errorText}`);
return { statusCode: response.status, body: { error: errorText } };
}
logger.info("Event forwarded to Slack");
return { statusCode: 200, body: { success: true } };
}
/**
* Builds a Slack Block Kit message from the event payload
*/
function buildSlackMessage(payload, headers) {
// Adobe passes event code as x-adobe-event-code header (available in params for runtime actions)
const eventType = headers["x-adobe-event-code"] ||
payload["x-adobe-event-code"] ||
payload.event_code ||
payload.type ||
payload.event_type ||
"Adobe Event";
const eventId = headers["x-adobe-event-id"] || payload["x-adobe-event-id"] || payload.event_id || payload.id || "N/A";
const eventData = payload.data || payload.event || payload;
return {
blocks: [
{
type: "header",
text: { type: "plain_text", text: `Event: ${eventType}`, emoji: true }
},
{
type: "section",
fields: formatDataFields(eventData)
},
{ type: "divider" },
{
type: "context",
elements: [{
type: "mrkdwn",
text: `*Event ID:* ${eventId} | *Time:* ${new Date().toISOString()}`
}]
}
]
};
}
/**
* Formats event data as Slack mrkdwn fields
*/
function formatDataFields(data, maxFields = 10) {
if (typeof data !== "object" || data === null) {
return [{ type: "mrkdwn", text: `*Payload:*\n${String(data)}` }];
}
const entries = Object.entries(data);
if (entries.length === 0) {
return [{ type: "mrkdwn", text: "_No data provided_" }];
}
return entries.slice(0, maxFields).map(([key, value]) => ({
type: "mrkdwn",
text: `*${key}:*\n${typeof value === "object" ? `\`\`\`${JSON.stringify(value)}\`\`\`` : value}`
}));
}
exports.main = main;
Configurare l’azione in app.config.yaml app-config
app.config.yaml è critica. È necessario utilizzare web: no per creare un'azione non Web che può essere registrata come azione di runtime in Developer Console.Passare alla cartella del progetto e aprire app.config.yaml. Sostituire il contenuto con quanto segue:
application:
runtimeManifest:
packages:
slack-webhook-proxy:
license: Apache-2.0
actions:
webhook-proxy:
function: actions/webhook-proxy/index.js
web: no
runtime: nodejs:22
inputs:
LOG_LEVEL: info
SLACK_WEBHOOK_URL: $SLACK_WEBHOOK_URL
annotations:
require-adobe-auth: false
final: true
Variabili di ambiente environment-variables
Per gestire le credenziali in modo sicuro, utilizza le variabili di ambiente. Modifica il file .env nella directory principale del progetto e aggiungi:
SLACK_WEBHOOK_URL=https://hooks.slack.com/services/YOUR/WEBHOOK/URL
Distribuire l’azione deploy-action
Una volta impostate le variabili di ambiente, distribuisci l’azione. Assicurarsi di trovarsi nella radice del progetto (slack-webhook-proxy) quando si esegue questo comando nel terminale:
aio app deploy
Viene visualizzata una conferma dell’esito positivo della distribuzione.
Registra l’azione con Adobe I/O Events register-events
Una volta implementata l’azione, registrala come destinazione per Adobe I/O Events.
In Developer Console, apri il progetto App Builder, quindi seleziona Workspace.
Nella pagina della panoramica di Workspace, selezionare Add service e Event.
Nella pagina Aggiungi eventi selezionare Experience Platform e Platform notifications, quindi selezionare Next.
Selezionare gli eventi per i quali si desidera ricevere notifiche, quindi selezionare Next.
Selezionare le credenziali di autenticazione server-to-server, quindi selezionare Next.
Immettere un Event registration name e cancellare Event registration description per la registrazione, quindi selezionare Next.
Seleziona Runtime Action come metodo di consegna e l'azione slack-webhook-proxy/runtime-proxy creata, quindi seleziona Save configured events.
Il proxy del webhook è ora configurato. Viene visualizzata di nuovo la pagina proxy del webhook. È possibile verificare l'intero flusso end-to-end selezionando l'icona Send sample event accanto a qualsiasi evento configurato.