ログインアクティビティを模倣するサンプルアプリケーションの構築
このサンプルアプリケーションは、Node.js サーバーで構築およびデプロイされ、ユーザーがログインしたときに CRM ID をAdobe Experience Platform(AEP)に送信する方法を示します。 アプリケーションは、ユーザー資格情報がサーバーサイドで検証されるログインフローをシミュレートします。 ログインに成功すると、ユーザーの CRM ID が取得されて adobeDataLayer にプッシュされ、Adobe Experience Platform タグ(旧称:Adobe Launch)で対応するルールがトリガーされます。
attachLoginHandler 関数は、送信イベントリスナーをログインフォームにアタッチします。 フォームの送信時には、デフォルトのアクションを回避し、事前定義済みのユーザーのオブジェクトに対して資格情報を検証し、有効な場合は CRM ID を取得します。 この関数は、CRM ID および認証状態を持つ userloggedin イベントを adobeDataLayer にプッシュし、Adobe Experience Platform タグが取得してデータをAdobe Experience Platform(AEP)に送信します。
function attachLoginHandler() {
const form = document.getElementById("loginForm");
if (!form) return;
form.addEventListener("submit", function(e) {
e.preventDefault();
const username = document.getElementById("username").value;
const password = document.getElementById("password").value;
if (users[username] && users[username].password === password) {
const crmid = users[username].crmid;
window.adobeDataLayer = window.adobeDataLayer || [];
debugger;
window.adobeDataLayer.push({
event: "UserLoggedIn",
user: {
crmid: crmid,
authenticatedState: "authenticated"
}
});
}
});
}
Adobe Experience Platform タグスクリプトは、通常は次のように、<head> タグを使用してHTML ページの <script> セクションに含まれます。
<script src="https://assets.adobedtm.com/b5eu4857867/4e4d84957/launch-b69e276bb9b5-development.min.js" async crossorigin="anonymous"></script>
AEP タグスクリプトは、前の手順で作成した web SDK対応のプロパティを公開し、「環境」タブから埋め込みコードをコピーすることで取得されました。