針對客戶警示的Slack整合
Adobe Experience Platform可讓您在Adobe App Builder上使用webhook proxy在中接收Adobe I/O EventsSlack。 Proxy會處理Adobe的驗證交握,並將事件裝載轉換為Slack則訊息,這樣您便可取得傳送至您工作區的客戶通知。
先決條件 prerequisites
開始之前,請確定您具備下列條件:
- Adobe Developer Console存取:已啟用App Builder的組織中的系統管理員或開發人員角色。
- Node.js和npm: Node.js (建議使用LTS),其中包含安裝Adobe CLI和專案相依性的npm。 如需詳細資訊,請參閱下載Node.js和npm快速入門手冊。
- Adobe I/O CLI:從您的終端機安裝Adobe I/O CLI:
npm install -g @adobe/aio-cli。 - 具有傳入Webhook的Slack應用程式:工作區中啟用 傳入Webhook 的Slack應用程式。 請參閱建立Slack應用程式和Slack傳入Webhook指南,以建立應用程式並取得webhook URL (格式:
https://hooks.slack.com/...)。
設定樣板化專案 templated-project
若要設定樣板化專案,請登入Adobe Developer Console,然後從 Create project from template 索引標籤中選取Home。
選取 App Builder 範本,然後輸入 Project Title 並選取Add workspace。 最後,選取Save。
您將會收到專案已建立且已移至「Project overview」索引標籤的確認。 您可以在此處新增Project description。
初始化專案 initialize-project
設定好樣板化專案後,請初始化專案。
-
開啟您的終端機,然後輸入以下命令以登入Adobe I/O。
code language-bash aio login -
初始化應用程式並提供名稱。
code language-bash aio app init slack-webhook-proxy -
使用方向鍵選取您的
Organization,然後選取您先前在Developer Console中建立的Project。 選取Only Templates Supported By My Org以搜尋範本。
-
接著,按 Enter 跳過範本並安裝獨立的應用程式。
-
指定您要為此專案啟用的Adobe I/O應用程式功能。 使用方向鍵捲動並選取
Actions: Deploy Runtime actions。
-
使用方向鍵捲動並選取
Adobe Experience Platform: Realtime Customer Profile作為您要建立的範例動作型別。
-
捲動並選取
Pure HTML/JS以取得您要新增至範本的UI。 按 Enter 保留範例動作為預設值,然後再次按 Enter 保留名稱為預設值。
您會收到應用程式初始化完成的確認。
-
導覽至專案目錄。
code language-bash cd slack-webhook-proxy -
新增Web動作。
code language-bash aio app add action -
選取
Only Action Templates Supported By My Org。範本清單隨即顯示。
-
按空格鍵來選取範本,然後使用您的
@adobe/generator-add-publish-events向上 和 向下箭頭導覽至。 最後,按 空格鍵 並按 Enter 以選取範本。
顯示已安裝
npm package @adobe/generator-add-publish-events的確認。 -
為動作
webhook-proxy命名。
此時會顯示已安裝範本的確認。
建立檔案動作並部署 create-file-actions
新增Proxy程式碼、設定環境變數,然後部署。 之後,您便可在Developer Console中使用該動作進行註冊。
實作執行階段Proxy runtime-proxy
瀏覽至專案資料夾,並開啟檔案actions/webhook-proxy/index.js。 刪除內容並以下列內容取代:
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;
在app.config.yaml中設定動作 app-config
app.config.yaml中的動作設定是關鍵的。 您必須使用web: no來建立可在Developer Console中註冊為執行階段動作的非Web動作。瀏覽至專案資料夾並開啟app.config.yaml。 以下列專案取代內容:
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
環境變數 environment-variables
若要安全地管理認證,請使用環境變數。 修改專案根目錄中的.env檔案並新增:
SLACK_WEBHOOK_URL=https://hooks.slack.com/services/YOUR/WEBHOOK/URL
部署動作 deploy-action
設定環境變數後,請部署動作。 在終端機中執行此命令時,請確定您位於專案的根目錄中(slack-webhook-proxy):
aio app deploy
此時會顯示部署成功的確認。
向Adobe I/O Events註冊動作 register-events
部署您的動作後,請將其註冊為Adobe I/O Events的目的地。
在Developer Console中,開啟您的App Builder專案,然後選取您的Workspace。
在Workspace概觀頁面上,選取 Add service 和Event。
在[新增事件]頁面上,選取 Experience Platform 和Platform notifications,然後選取Next。
選取您要接收通知的事件,然後選取Next。
選取您的伺服器對伺服器驗證認證,然後選取Next。
輸入註冊的 Event registration name 與清除Event registration description,然後選取Next。
選取 Runtime Action 作為傳遞方式以及您建立的slack-webhook-proxy/runtime-proxy動作,然後選取Save configured events。
現在已設定您的webhook Proxy。 您會返回Webhook Proxy頁面。 您可以選取任何已設定事件旁的 Send sample event 圖示,以端對端測試整個流程。