---
title: "Engage.init(settings)"
slug: "engage-init"
abstract: "Sitecore Engage SDK(Sitecore CDP Stream API)のクライアント側init()関数を記述します。"
---
# Engage.init(settings)

非同期init() 関数はアプリのクライアント側でEngage SDKを初期化します。 windowオブジェクトが定義され、他のEngage関数を呼び出す前にこの関数を呼び出してください。

初期化時に、関数は [ブラウザID](https://doc.sitecore.com/cdp/ja/developers/api/integrating-with-sitecore-cdp/understanding-integration-details/browser-id.html "Browser ID")を作成し、それをブラウザ内のクッキーとして保存します。

サイドバー。パラメータ

パラメータ

種類

概要

[settings](https://doc.sitecore.com/cdp/ja/developers/api/stream-api/sitecore-engage-sdk-reference/functions/settings-object.html)

目的

Sitecore CDPのインスタンスやクッキー設定の詳細。

例1。例:Engage SDKスクリプト

init()関数の使い方の例を紹介します。init()関数を非同期で呼び出し、戻り値を変数に保存しなければなりません。

// Initialize the engage variable
var engage = undefined;

// Create and inject the <script> tag into the HTML
var s = document.createElement("script");
s.type = "text/javascript";
s.async = true;
s.src = "https://d1mj578wat5n4o.cloudfront.net/sitecore-engage-v.1.4.3.min.js";
var x = document.querySelector("script");
x.parentNode.insertBefore(s, x);

// Initialize the Engage SDK
s.addEventListener("load", async () => {
 const settings = {
 clientKey: "<client\_key\_PLACEHOLDER>",
 targetURL: "<stream\_api\_target\_endpoint\_PLACEHOLDER>",
 pointOfSale: "<point\_of\_sale\_PLACEHOLDER>",
 cookieDomain: "<cookie\_domain\_PLACEHOLDER>",
 cookieExpiryDays: 365,
 forceServerCookieMode: false,
 includeUTMParameters: true,
 webPersonalization: false /\* boolean or object. See Settings object for all options. Default: false \*/
 };
 engage = await window.Engage.init(settings);
});

例2。例:Engage SDKパッケージ

こちらがReactアプリのinit() 関数の使い方の例です。 init() 関数を非同期で呼び出し、戻り値を変数に保存しなければなりません。

Engage関数をウィンドウオブジェクトに公開するには、windowオブジェクトに返り値を割り当てることができます。これは、[ウェブ体験](/personalize/en/users/sitecore-personalize/en/create-a-variant-for-a-web-experiment-using-custom-code.html) やSitecore Personalizeのウェブ [実験](/personalize/en/users/sitecore-personalize/en/create-a-variant-for-a-web-experiment-using-custom-code.html) 内でEngage関数を呼び出すために行う必要があります。

本番環境では、init() 関数を一度呼び出し、その後React ContextやReduxなどの州管理ソリューションを使ってアプリ全体で共有します。

engage.js:

import { init } from "@sitecore/engage";

let engage;

const loadEngage = async () => {
 engage = await init({
 clientKey: "<client\_key\_PLACEHOLDER>",
 targetURL: "<stream\_api\_target\_endpoint\_PLACEHOLDER>",
 pointOfSale: "<point\_of\_sale\_PLACEHOLDER>",
 cookieDomain: "<cookie\_domain\_PLACEHOLDER>",
 cookieExpiryDays: 365,
 forceServerCookieMode: false,
 includeUTMParameters: true,
 webPersonalization: false /\* boolean or object. See Settings object for all options. Default: false \*/
 });

  // Expose Engage functions to the window object:
 window.engage = engage;
};

loadEngage();
export { engage };

App.js:

import { useEffect } from "react";
import { engage } from "./engage.js";

export default function App() {
 useEffect(() => {
 if (engage !== undefined) {
 // Send VIEW event
 };
 }, );
// ...
}