クライアント側のCookie管理

これはscriptタグによって制御されるCookieが同意なしで設定されることを防止する最も効率的な方法の1つです。この方法では、サイトに最小限の変更を加える必要があるだけで、ラッパーを使用する必要はありません（下記参照）。

[en] Below are a couple examples in which this method would be applicable.

[en] In-Line Scripting Example:

<script type=’text/javascript’>
document.cookie = “targeting-cookie”+”=”+”1234”
</script>

[en] JavaScript File Example:

<script type=’text/javascript’ src=’/path/cookie.js’></script>

[en] How to Implement

通常のスクリプトタグは次のようになります。

<script type="text/javascript">
code
</script>

スクリプトの型の書き換えを使用して、スクリプトを次のように変更する必要があります。

<script type="text/plain" class="optanon-category-C0002">
code
</script>

クラスIDの番号は、スクリプトが読み込むCookieのCookieグループIDに対応しています。この場合、パフォーマンスCookieになります。

[en] How it Works

上記のコードが読み込まれると、タグ内のJavaScriptは実行されず、Cookieは設定されません。その後、Cookieコンプライアンスコードが読み込まれ、関連付けられたグループのCookieに同意がある場合は、タグが動的にscripttype=text/JavaScriptに変更されます。その後、タグ内のコードが認識され、通常どおり実行されます。

<script type=’text/plain’ class=’optanon-category-C0004’>
document.cookie = “targeting-cookie”+”=”+”1234”
</script>

[en] After re-writing this tag, the script would only fire on the site when a user consents to the C0004 category (Targeting Cookies). The class attribute is responsible for updating the type. When consent is withdrawn/withheld for the assigned category, the type will be text/plain; when consent is given, it will be text/javascript.

[en] In this example, when a user does not consent to Targeting cookies (C0004) , the script tag would appear as follows:

[en] When a user consents to Targeting cookies (C0004), the type will appear as follows:

<script type="text/plain" class="optanon-category-C0002-C0003-C0004">
code
</script>

Optanonラッパーは、メインスクリプトタグで提供され、次のようになります。

<script type="text/javascript">
function OptanonWrapper() {
}
</script>

ヘルパーメソッドのホルダーとして機能し、Cookieの設定を引き起こすスクリプトやHTMLタグをブロックまたは制御するために使用されます。ラッパーは、各ページの読み込み時、またはユーザーが優先設定センターでプライバシー設定の変更を保存したときに実行されます。

Cookieグループが非アクティブからアクティブに切り替わると、関連するヘルパーメソッドが実行され、関連するJavaScript/HTMLがページに挿入されます。

ヘルパーメソッドスクリプトは、ラッパーコントロール内に配置する必要はありません。ただし、ヘルパーメソッドがない場合は、最初のページ読み込み時にのみ実行されます。オプトインアクション（非アクティブからアクティブ）をユーザー体験に即座に反映させるには、ラッパーを使用する必要があります。

オプトアウトアクション（アクティブから非アクティブ）の結果としてのユーザー体験の変更は、ページの更新時または新しいページへの移動時にのみ反映されます。

[en] Below is an example function called through OptanonWrapper():

[en] Example function:

toConsole() {
    console.log(“SUCCESS”)
}
function OptanonWrapper{
  if(OnetrustActiveGroups.includes("C0002")){
    toConsole()
  }
}

[en] OnetrustActiveGroups plays a critical role in the Optanon Wrapper Control method. OnetrustActiveGroups is a data layer variable that gets updated every time a user modifies their choices with the latest category IDs. For more details on this variable, see OnetrustActiveGroups-データレイヤーオブジェクトを使用する.

[en] In the above instance, toConsole() is an example function that is writing a message on the console when the if condition is executed. In this example, the if condition is checking for the OnetrustActiveGroups data layer variable and if it includes the C0002 category, meaning when Performance cookies are active. Whenever this condition is satisfied, the toConsole() function is executed. The toConsole() function will be called every time the OptanonWrapper() fires and when a user consents to Performance cookies (C0002).

[en] When the function is executed based on consent for Performance category, it appears as follows:

[en] Third-party tools often have public methods that can be called to indicate to the tool that a user has granted or revoked consent. These will often result in the technology being set to “strict” or “restricted” mode so that a restricted amount of data is processed to respect a user’s choices. If the technology you want to control has these methods, you can implement them through the OptanonWrapper control. See the following example:

function OptanonWrapper(){
        if(OnetrustActiveGroups.includes(“C0002”)){
                myAnalyticsTool.setUnrestrictedMode () //consent given, operate regularly
        }else{
                myAnalyticsTool.setRestrictedMode() //consent not given, operate in restricted mode
        }
}

[en] Events

[en] The OneTrust JavaScript SDK raises several events that can be used to trigger consent-related actions. The two most relevant events are OneTrustGroupsUpdated, which fires when consent becomes available on page load and whenever consent is changed, and OTConsentApplied, which only fires when an explicit consent action has been taken.

window.addEventListener(“OneTrustGroupsUpdated”, event => {
        if(event.details.includes(“C0002”)){
                myAnalyticsTool.setUnrestrictedMode();
}else{
        myAnalyticsTool.setRestrictedMode();
}
})

[en] For more information on OneTrust JavaScript events, see [en] Cookie Consent Java Script Events Guide.

ヘルパーメソッドは、Cookieの設定を引き起こすスクリプトまたはHTMLタグをブロックまたは制御するために使用されます。

OneTrust.InsertScript

このメソッドでは、Cookieの設定を担うスクリプトは外部ファイルに配置され、関連付けられているCookieグループがアクティブになると、ページに動的に挿入されます。

形式は次のとおりです。

OneTrust.InsertScript(url, selector, callback, options, groupId)

例1 OneTrust.InsertScript

OneTrust.InsertScript('/gaCookies.js', 'head', null, null, 'C0002');OneTrust.InsertScript('/performance-cookies-script.js', 'head', null, null, '2');

[en] In the example below, gaCookies.js is an external file that is setting Google Analytics cookies. This JavaScript file will be inserted only when Performance cookies are active. Implementing this using the InsertScript method within the OptanonWrapper() function would appear as follows:

function OptanonWrapper() { 
            OneTrust.InsertScript('path/gaCookies.js','head', null, null, 'C0002');
 }

結果：

[en] In this example, the gaCookies.js file will get injected before the closing head tag of the HTML when Performance cookies (C0002) are active. The following script will be inserted in the source and will be executed as a regular JavaScript file:

<script type="text/javascript" src="path/gaCookies.js"></script>

IDが2のパフォーマンスCookieグループが［アクティブ］または［常にアクティブ］に設定されている場合、次のスクリプトが、ページの終了headタグの直前に挿入されます。

注記

[en] Please note that the gaCookies.js used in the scenario above is strictly an example. This method is applicable to any JavaScript file that is required to be injected in the code based on user consent.

各パラメータの説明については、次の表を参照してください。

パラメータ	データタイプ	説明	値	必須
url	ストリング	JSファイルの絶対URLまたは相対URL		はい
selector	ストリング	scriptタグが挿入されるHTML親要素セレクター	head 本文 親のID	はい
callback	関数	scriptタグが挿入された後に呼び出されるJavaScript関数	functionname null	はい
options	オブジェクト	scriptタグが挿入された場合の動作のリスト	以下のオプションの定義を参照してください	はい
groupId	数	scriptタグが挿入されるグループID	OptanonグループID	はい

OneTrust.InsertHTML

このメソッドは、Cookieの設定を制御するコードが標準またはカスタムHTMLタグのいずれかの場合に使用する必要があります。

形式は次のとおりです。

OneTrust.InsertHtml(element, selector, callback, options, groupId)

例2 OneTrust.InsertHTML

OneTrust.InsertHtml('<iframe type="text/html" width="640" height="360" frameborder="no" src="https://www.youtube.com/embed/v=GEH-usLSwqE"></iframe>','123', null, null, 'C0003');OneTrust.InsertHtml('<customElement customAttribute="value">some content</customElement>', 'parent_element_id', null, null, '3');

[en] In this example, the iFrame is the standard HTML element to be injected in a section that has ID 123. The first null value specifies that there is not a callback function and the second null value specifies that there is no options parameter added. The group ID (C0003) will allow the element to be inserted when consent is granted for Functional-category cookies.

結果：

注記

[en] Please note that this method will automatically add an enclosing div around the element that is getting inserted.

<customElement customAttribute="value">some content</customElement>

機能性Cookieグループが［非アクティブ］の場合、スクリプトは挿入されません。

各パラメータの説明については、次の表を参照してください。

パラメータ	データタイプ	説明	値	必須
element	ストリング	挿入されるHTMLタグ		はい
selector	ストリング	要素が挿入されるHTML親要素ID	親のID	はい
callback	関数	要素が挿入された後に呼び出されるJavaScript関数	functionname null	はい
options	オブジェクト	要素が挿入された場合の動作のリスト	以下のオプションの定義を参照してください null	はい
groupId	数	要素が挿入されるグループID	OptanonグループID	はい

注記

Cookieを設定するサードパーティコンポーネントの中には、相互に依存するJavaScriptとHTMLの両方の要素を使用するものがあります。通常、HTMLとJavaScriptの両方のヘルパーメソッドをペアとして使用する必要があります。これは、一方の要素がない場合に他方の要素に問題が生じるのを避けるためです。

{
deleteSelectorContent: <bool>,
makeSelectorVisible: <bool>,
makeElementsVisible: [‘<id>’, ‘<id>’, ‘<id>’, ...],
deleteElements: [‘<id>’, ‘<id>’, ‘<id>’, ...]
}