ページブラウザスナップショットへのカスタムユーザデータの追加

アプリケーションに固有のユーザ情報をブラウザのスナップショットに追加できます。この情報はキーと値のペアとして表されます。これは JavaScript エージェント構成に付加され、その後で EUM サーバーに送信されるビーコンに付加されます。

JavaScript エージェントは、ページタイプ（ベース、Ajax、仮想）と使用されるメソッド（関数式、関数ポインタ、およびリテラルが呼び出された直後）に応じて、ユーザーデータを異なる方法で初期化します。JavaScript エージェントが各ページタイプとメソッドのユーザーデータを初期化するタイミングについては、「カスタムユーザーデータを設定するメソッド」を参照してください。

ページ内のユーザデータに対して許可される最大サイズは、2048 文字（CORS ビーコン）または 100 バイト（イメージビーコン）です。最大サイズには、キーと値のペア、括弧などの構文文字、引用符などが含まれます。

カスタムユーザーデータの表示

カスタムユーザーデータは、[Browser Analyze]、[Browser Snapshots]、および [Sessions] に表示されます。コントローラ UI でユーザーデータを表示および使用する方法の詳細については、次のタブを参照してください。

ブラウザ分析

この [Browser Analyze] スクリーンショットでは、レコードをソートするために vehicleYear というユーザーデータが使用されています。また、ユーザデータを表示するためのフィールドを選択することもできます。

ブラウザ分析

ブラウザスナップショット

この [Browser Snapshots] タブのスクリーンショットは、ユーザーデータを使用して結果をフィルタリングする方法を示しています。

ブラウザスナップショット

セッション

次のスクリーンショットは、[Session Details] ダイアログの [Session Summary] のユーザデータを表示しています。カスタムユーザデータを含む基本ページがセッションの最初のページである場合には、セッションにはカスタムユーザデータのみが含まれます。

セッションのサマリー

カスタムユーザデータを設定するためのメソッド

各ページタイプ（基本、Ajax、仮想）のカスタムデータを設定するには、いくつかのメソッドを使用できます。各メソッドには、独自の構文、実行時間、およびユースケースがあります。次の表に、各メソッドとページタイプの実行時間とユースケースの例の概要を示します。


方式タイプ	ページタイプ	実行時間	ユースケースの例
即時呼び出し関数式（IIFE）	基本	これらは、定義されるとすぐに実行される JavaScript 関数です。自己実行無名関数とも呼ばれています。	基本/仮想ページまたは Ajax リクエストが、異なるリソースからの情報に応じて変化する場合は、IIFE を使用してカスタムユーザデータの静的情報を設定できます。たとえば、2 つの異なるサーバスクリプトが基本ページのコンテンツを生成する場合、クライアントの IIFE を使用して静的ユーザデータを設定できます。
	Ajax
	仮想
関数ポインタ	基本	JavaScript エージェントは、onload イベントがトリガーされたときに関数ポインタを実行します。	cookie、ページ、およびメタデータから抽出されたデータ。
	Ajax	このイベントは、Ajax コールが発信されたときにトリガーされます。Ajax イベントのカスタムユーザデータは、AJAX リクエストに付加されます。	URL、HTTP メソッド、リクエストペイロードなどの Ajax リクエストに関するメタデータ。
	仮想	このイベントは、仮想ページが作成されたときにトリガーされます。仮想ページは、ベースページの動的に再作成されたバージョンであり、VPageView イベント用のカスタムユーザーデータが仮想ページレコードに付加されます。	仮想ページの作成により、この情報がページのどこかで生成されるか、または検出される場合に使用。URL と DOM の変更に基づいて設定されたユーザ固有のフィールドまたはユーザデータ。
リテラル	基本	カスタムデータを設定するときは、リテラル値を使用するだけです。値は、IIFE と同様に、値が定義されるとすぐに設定されます。	定数。サーバで抽出され、設定される静的データ。
	Ajax
	仮想

ユーザデータ型

トリガーされるイベントコールバックごとに、さまざまなデータ型のキーと値のペアを含むオブジェクトを返すことによって、ユーザデータを追加できます。各ユーザデータ型は、特定のデータ型のプロパティを含むオブジェクトです。

警告: データ型がキーと値のペアに正しく一致することを確認します。文字列データ型に日付のキーと値のペアを追加するなど、userData オブジェクト内で誤ったキーと値を送信すると、一般的なエラーが表示されます。


データタイプ	説明	例
userData	このデータ型は、string 型の 1 つまたは複数のプロパティを設定するためのものです。値が数値に設定されている場合でも、文字列にする必要があります。	`{ user: "john_thompson", cart: "100.00" };`
userDataLong	このデータ型は、long 型の 1 つまたは複数のプロパティを設定するためのものであり、10 進数以外の数値にする必要があります。	`{ numberOfProducts: 17, numberOfSales: 1213 };`
userDataDouble	このデータ型は、double 型の 1 つまたは複数のプロパティを設定するためのものであり、10 進数の数値にする必要があります。	`{ monthlyVisitFrequency: 0.13333333, avgCustomerConversion: 0.0361922 };`
userDataBoolean	このデータ型は、boolean 型の 1 つまたは複数のプロパティを設定するためのものです。	`{ returnCustomer: true, subscriber: false };`
userDataDate	このデータ型は、date 型の 1 つまたは複数のプロパティを設定するためのものです。値は、変換された日付のエポック値にする必要があります。	`{ epoch1: 1448675019877, epoch2: 1418475982737 };`

ユーザデータオブジェクトの構文

各ページイベントのオブジェクトとしてユーザデータを JavaScript エージェント構成に追加します。基本ページ、Ajax、および仮想ページには、次の対応するユーザーデータオブジェクトがあります。

PageView
Ajax
VPageView

PageView、Ajax、および VPageView オブジェクトのシンタックスは若干異なります。UserPageName は、PageView と VPageView でのみ使用でき、Ajax と Errorでは使用できません。

JavaScript 設定テンプレート

userEventInfo: {
			"PageView": function(context) {
                return {
                    userPageName: "String"
                    userData: {
                        userDataOne: "String",
                        userDataTwo: "String",
						someKey: "String"
                    },
                    userDataLong: {
                        longPropertyOne: Numeral,
                        longPropertyTwo: Numeral,
						someKey: Numeral
                    },
                    userDataDouble: {
                        userDataDoubleOne: Decimal,
                        userDataDoubleTwo: Decimal,
						someKey: Numeral
                    },
                    userDataBoolean: {
                        userDataBooleanOne: Boolean,
                        userDataBooleanTwo: Boolean,
						someKey: Boolean
                    },
                    userDataDate: {
                        epoch1: Epoch numeral,
                        epoch2: Epoch numeral,
                        currentTime: ((new Date()).getTime()),
                        someKey: ((new Date()).getTime())
                    }
                }
			}

			"Ajax" : function(context) {
                if (context.method.toLowerCase() === 'post') {
                    var anyKey = "String";
                } else {
                    variableName = "String";
                }
                return {
                    userData: {
                        userDataOne: "String",
                        userDataTwo: "String"
						variableName: VariableName
                    },
                    userDataLong: {
                        longPropertyOne: Numeral,
                        longPropertyTwo: Numeral
                    },
                    userDataDouble: {
                        userDataDoubleOne: Decimal,
                        userDataDoubleTwo: Decimal
                    },
                    userDataBoolean: {
                        userDataBooleanOne: Boolean,
                        userDataBooleanTwo: Boolean
                    },
                    userDataDate: {
                        epoch1: Epoch numeral,
                        epoch2: Epoch numeral
                    }
                }
            },
            "VPageView": function(context) {
                return {
					userPageName: "String",
                    userData: {
                        userDataOne: "String",
                        userDataTwo: "String"
                    },
                    userDataLong: {
                        longPropertyOne: Numeral,
                        longPropertyTwo: Numeral
                    },
                    userDataDouble: {
                        userDataDoubleOne: Decimal,
                        userDataDoubleTwo: Decimal
                    },
                    userDataBoolean: {
                        userDataBooleanOne: Boolean,
                        userDataBooleanTwo: Boolean
                    },
                    userDataDate: {
                        epoch1: Epoch numeral,
                        epoch2: Epoch numeral
                    }
				}
			},
			"Error": function(context) {
                return {
                    userPageName: "String",
                    userData: {
                        username: "String",
                        cart: "String"
                    },
                    userDataLong: {
                        longExample1: Numeral,
                        longExample2: Numeral
                    },
                    userDataDouble: {
                        doubleExample1: Decimal,
                        doubleExample2: Decimal
                    },
                    userDataBoolean: {
                        booleanExample1: Boolean,
                        booleanExample2: Boolean
                    },
                    userDataDate: {
                        epoch1: Epoch numeral,
                        epoch2: Epoch numeral
                    }
                }
            }
        }
    };

JavaScript の設定例

userEventInfo: {
    "PageView": function(context) {
        return {
            userPageName: "UserEventInfoTestPage",
            userData: {
                username: "basepage_user",
                cart: "100.00",
                someKey: "111222333444555",
            },
            userDataLong: {
                numberOfProducts: 17,
                numberOfSales: 1213,
                someKey: 111222333444555,
            },
            userDataDouble: {
                monthlyVisitFrequency: 0.13333333,
                avgCustomerConversion: 0.0361922,
                someKey: 111222333444555.666,
            },
            userDataBoolean: {
                returnCustomer: true,
                subscriber: false,
                someKey: true,
            },
            userDataDate: {
                checkoutTime: 1441751614436,
                currentTime: ((new Date()).getTime()),
                someKey: ((new Date()).getTime()),
            }
        }
    "Ajax" : function(context) {
        var property = '';
            if (context.method.toLowerCase() === 'post') {
                property = "Could be doing something";
                } 
            else {
                property = "Idempotent, hopefully";
        }
        return {
            userData: {
                username: "xhr_user",
                cart: "218.50",
                property: property,
            },
            userDataLong: {
                numberOfProducts: 17,
                numberOfSales: 1213,
            },
            userDataDouble: {
                monthlyVisitFrequency: 0.13333333,
                avgCustomerConversion: 0.0361922,
            },
            userDataBoolean: {
                returnCustomer: true,
                subscriber: false,
            },
            userDataDate: {
                checkoutTime: 1441751614436,
                currentTime: ((new Date()).getTime()),
            }
        }
    },
    "VPageView": function(context) {
        return {
            userData: {
                username: "virtualpage_user",
                cart: "200.00",
            },
            userDataLong: {
                numberOfProducts: 17,
                numberOfSales: 1213,
            },
            userDataDouble: {
                monthlyVisitFrequency: 0.13333333,
                avgCustomerConversion: 0.0361922,
            },
            userDataBoolean: {
                returnCustomer: true,
                subscriber: false,
            },
            userDataDate: {
                checkoutTime: 1441751614436,
                currentTime: ((new Date()).getTime()),
            }
        }
    },
    "Error": function(context) {
        return {
            userPageName: "UserEventInfoTestPage",
            userData: {
                username: "automated_tester",
                cart: "100.00",
            },
            userDataLong: {
                longExample1: 129414,
                longExample2: 524546,
            },
            userDataDouble: {
                doubleExample1: 5982.612575313542,
                doubleExample2: 5084.016120518092,
            },
            userDataBoolean: {
                booleanExample1: true,
                booleanExample2: false,
            },
            userDataDate: {
                epoch1: 1441751614436,
                epoch2: 1441751614438,
            }
        }
    }
}
};

ユーザデータを設定するための Ajax データのキャプチャ

Ajax イベントのユーザーデータを設定すると、JavaScript エージェント構成では、HTTP メソッド、リクエスト URL、および Ajax リクエストのリクエストペイロードのプロパティを持つ context オブジェクトを使用できます。この情報を使用して、ユーザデータ構成オブジェクトの値を設定できます。

注: JavaScript エージェントは、Ajax リクエストからの応答のインターセプトや公開は行いません。したがって、レポートするユーザデータには、リクエスト情報（HTTP メソッド、リクエスト URL、およびリクエストペイロード）のみを含めることができます。

Ajax コンテキストオブジェクト

Ajax リクエストの URL および HTTP メソッドにアクセスするには、context オブジェクトの method および url プロパティにアクセスするだけです。Ajax リクエストのリクエストペイロードについては、最初にペイロードパラメータ（HTTP メソッドまたは Ajax URL）と照合して data プロパティにアクセスする必要があります。ペイロードパラメータと一致するフィルタの定義方法については、「Ajax ペイロードパラメータの照合」を参照してください。

context オブジェクトには次のプロパティがあります。


プロパティ	説明	データタイプ	プロパティにアクセスするための要件
method	Ajax リクエストを作成するために使用される HTTP メソッド。	文字列	XHR コール
url	Ajax リクエストを作成するために使用される URL。	文字列	XHR コール
data	Ajax リクエストに付加されるリクエストペイロード。	本文として xhr.send に渡すことができる任意のデータ型。	XHR コールペイロードパラメータの XHR フィルタ
responseHeaders	構成 `getAjaxResponseHeaders` で使用できるレスポンスヘッダー。「\|」で区切ります。	文字列	XHR コール `getAjaxResponseHeaders` で指定したヘッダー名で `getAjaxResponseHeaders` が構成されていること。

Ajax ペイロードパラメータの照合

リクエストペイロードにアクセスするには、xhr.payloadParams 配列を使用して、HTTP メソッドや Ajax URL を照合する必要があります。Ajax URL と照合する場合、1 つまたは複数のパターンを指定できます。HTTP メソッドを照合するには、HTTP メソッドを指定する 1 つまたは複数のオブジェクトを追加します。

「HTTP メソッドの照合」の例では、HTTP メソッド「POST」と「GET」を照合するために payloadParams 配列が使用されます。「URL の照合」の例では、文字列「'.*/xhr/uptime'」を使用して URL を照合するために payloadParams 配列が使用されます。

HTTP メソッドの照合

<script type = 'text/javascript' charset = 'UTF-8' >
    window['adrum-config'] = {
        xhr: {
            payloadParams: [{
                method: 'POST'
            }, {
                method: 'GET'
            }]
        },
        ...
    }

URL の照合

window['adrum-config'] = {
    xhr: {
        payloadParams: [{urls: [{pattern: '.*/xhr/uptime'}]}]
    },
    ...
}

Ajax ペイロードフィルタの例

従来の Ajax リクエスト

次の例では、従来の Ajax リクエストペイロードのデータを使用して、カスタムユーザーデータを設定します。Fetch API コールのリクエストペイロードをキャプチャする場合は、「Fetch API を使用した Ajax リクエスト」を参照してください。

HTTP メソッドの照合の例

この例では、HTTP メソッドが POST の場合のみ、Ajax リクエストペイロードのデータを使用してユーザーデータ構成オブジェクトを設定します。

<script type='text/javascript' charset='UTF-8'>   
    window['adrum-config'] = {
        xhr: {
            payloadParams: [{method: 'POST'}]
        },
        userEventInfo: {
            "Ajax" : function(context) {
                if (context.data && context.data.indexOf("purchase") > -1) {
                    // The URLSearchParams API does not work on IE/Edge
                    var payload = new URLSearchParams(context.data);
                    return {
                        userData: {
                            username: payload.get("username"),
                            email: payload.get("email"),
                            phone: payload.get("phone")
                        },
                        userDataLong: {
                            customerId: Number(payload.get("customer_id"),
                            totalPurchases: Number(payload.get("total_purchases")
                        },
                        userDataDouble: {
                            purchaseTotal: Double(payload.get("total") 
                    },
                    userDataBoolean: {
                        discounted: Boolean(payload.get("discounted"),
                        vipMember: Boolean(payload.get("member")
                    },
                    userDataDate: {
                        purchaseTime: Date.now()
                    }
                }
            }
        }
    };
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>

URL の照合の例

この例では、Ajax URL がパターン ".*/transaction" と一致する場合のみ、Ajax リクエストペイロードのデータを使用してユーザデータ構成オブジェクトのみを設定します。たとえば、URL http://example.com/transaction はこのパターンに一致し、ユーザーデータ構成が Ajax リクエストペイロードのデータを使用して設定されます。

<script type='text/javascript' charset='UTF-8'>
    window['adrum-config'] = {
        xhr: {
            payloadParams: [{urls: [{pattern: '.*/transaction'}]}]
        },
        userEventInfo: {
            "Ajax" : function(context) {
                if (context.data && (context.data.indexOf("username") > -1) && (context.data.indexOf("customer_id") > -1) && (customer.data.indexOf("phone") > -1)) {
                    // The URLSearchParams API does not work on IE/Edge
                    var payload = new URLSearchParams(context.data);
                    return {
                        userData: {
                            username: payload.get("username"),
                            email: payload.get("email"),
                            phone: payload.get("phone")
                        },
                        userDataLong: {
                            customerId: Number(payload.get("customer_id")
                            totalPurchases: Number(payload.get("total_purchases") || 0
                        },
                        userDataDouble: {
                            purchaseTotal: Number(payload.get("total") || 0
                        },
                        userDataBoolean: {
                            discounted: Boolean(payload.get("discounted") || false,
                            vipMember: Boolean(payload.get("member") || false
                        },
                        userDataDate: {
                            purchaseTime: Date.now()
                        }
                   }
                }
            }
        };
    }
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>

Fetch API を使用した Ajax リクエスト

次の例は、JavaScript エージェント構成を使用して、Fetch API を使用する Ajax コールの HTTP メソッド、リクエスト URL、およびリクエスト本文を照合する方法を示しています。Fetch API コールは、コンテキストを追加するためにも提供されます。ただし、独自のリクエストオブジェクトを fetch メソッドに指定した場合は、JavaScript エージェントはリクエスト本文にアクセスできません。https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#Supplying_your_own_request_object

Fetch API コール

この Fetch API の例では、HTTP メソッドが POST の場合に、Ajax リクエストペイロードのデータを設定します。

<script type='text/javascript' charset='UTF-8'>
    // Note: URLSearchParams() is not supported in IE/Edge
    let queryParams = new URLSearchParams(window.location.search.substr(1));
    fetch('https://my-json-server.typicode.com/typicode/demo/posts', {
        method: 'post',
        body: queryParams.toString()
    }).then(function(response) {
        return response.json();
    }).then(function(data) {
        console.log('Posted content:', data.request_url);
    });
</script>

HTTP メソッドと URL の照合の例

この例では、HTTP メソッドが POST で Ajax URL がパターン ".*/posts" と一致する場合に、Ajax リクエストペイロードのデータを使用してユーザーデータ構成オブジェクトを設定します。

<script type='text/javascript' charset='UTF-8'>
    window['adrum-config'] = {
      xhr: {
        payloadParams: [{method: 'POST'}, {urls: [{pattern: '.*/posts'}]}]
      },
      userEventInfo: {
        "Ajax": function (context) {
          var payload = null;
          if (context.data && (context.data.indexOf("id") > -1) && (context.data.indexOf("title") > -1)) {
            // The URLSearchParams API does not work on IE/Edge
            payload = new URLSearchParams(context.data).toString();
          } else if (context.data && context.data.indexOf("id") > -1) {
            // The URLSearchParams API does not work on IE/Edge
            var params = new URLSearchParams(context.data); 
            params.set("title", "Post for " + params.get("id"));
            payload = params.toString();
          } else {
            payload = "Payload is not available";
          }
          return {
            userData: {
              username: "xhr_user",
              cart: "218.50",
              payload: payload
            }
          }
        }
      }
    };
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>

AjaxresponseHeadersExample

次に、文字列または文字列の配列のいずれかを受け取る getAjaxResponseHeaders の使用例を示します。

Ajax レスポンスヘッダーの照合の例

次に、キャプチャする Ajax レスポンスヘッダーを定義し、 context.responseHeaders を使用して userData フィールドに入力する例を示します。

<script type='text/javascript' charset='UTF-8'>
    window['adrum-config'] = {
        getAjaxResponseHeaders: ['ResponseHeaderName1', 'ResponseHeaderName2'],
        userEventInfo: {
            "Ajax" : function(context) {
                if (context.responseHeaders) {
                    let responseHeaders = context.responseHeaders;
                    // Do a regex search on this variable to read from the responseHeader string as needed.
                    // An example of a returned responseHeader string would be
                    // content-type: text/javascript | content-length: 599622
                    let header1 = "//Regex saved var here";
                    let header2 = "//Regex saved var here";
                    return {
                        userData: {
                            Header1: header1,
                            Header2: header2
                        }
                    }
                }
            }
        }
    }
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>

カスタムユーザデータの例

次の例は、さまざまなページタイプのカスタムデータを設定し、さまざまなメソッドを使用する方法を示しています。

トレースコンテキストを使用したユーザーデータの設定

次のスクリプト例では、JavaScript エージェントが Ajax リクエストの traceid と traceparent を送信できるようにします。

<script charset="UTF-8" type="text/javascript">
        window["adrum-start-time"] = new Date().getTime();
        (function(config){
            //other configs
            config.traceparentHeaderEnabled = true;
            config.userEventInfo = {
                "Ajax": function (context) {
                    return {
                        userData: {
                            traceparent:context.traceParent,
                            traceid: context.traceParent.split("-")[1]
                        }
                    };
                }
            }
        })(window["adrum-config"] || (window["adrum-config"] = {}));
    </script>

関数ポインタを使用したユーザデータの設定

次の例では、関数 userPageName を実行して PageView オブジェクトの extractUserData プロパティに値を割り当てます。これにより、cookie からデータが抽出されます。

< script type = 'text/javascript'
charset = 'UTF-8' >
	(function (config) {
		(function (info) {
			info.PageView = extractUserData;
		})(config.userEventInfo || (config.userEventInfo = {}))
	})(window['adrum-config'] || (window['adrum-config'] = {}));

function extractUserData() {
	var cookies = document.cookie.split(';');
	for (var i = 0; i < cookies.length; i++) {
		var cookie = cookies[i].trim();
		if (cookie.indexOf("role=") === 0) {
			var role = cookie.substring(5);
		}
	}
	return {
		userPageName: role
	};
} <
/script> <
script src = '//cdn.appdynamics.com/adrum/adrum-latest.js'
type = 'text/javascript'
charset = 'UTF-8' > < /script>

無名関数を使用したユーザデータの設定

また、仮想ページのユーザデータを設定するために、次の例に示すように、オブジェクトを返す無名関数を使用することもできます。

< script type = 'text/javascript'
charset = 'UTF-8' >
	(function (config) {
		(function (info) {
			info.VPageView = function () {
				return {
					userData: {
						version: window.location.href.split("/")[4],
						space: space(),
						email: getEmail()
					},
					userPageName: $('title').get(0).text,
					userDataDate: {
						currentTime: ((new Date()).getTime())
					},
					userDataBoolean: {
						watchingPage: watchingPage()
					}
				}
			}
		})(config.userEventInfo || (config.userEventInfo = {}))
	})(window['adrum-config'] || (window['adrum-config'] = {})); <
/script> <
script src = '//cdn.appdynamics.com/adrum/adrum-latest.js'
type = 'text/javascript'
charset = 'UTF-8' > < /script>

複数のメソッドを使用したユーザデータの設定

また、この例では、Ajax イベントのユーザーデータを設定するために、リテラル値と名前付きおよび無名関数を組み合わせて使用することもできます。context オブジェクトは、Ajax イベントにのみ使用できます。このオブジェクトには、プロパティ data（リクエストペイロードを格納）、method（Ajax リクエストの作成に使用する HTTP メソッド）、および url（Ajax リクエスト URL）があります。

<script type='text/javascript' charset='UTF-8'>
    (function(config){
        (function(info) {
            info.Ajax = function(context) { 
                return { 
                    userPageName: $('title').get(0).text,
                    userData: extractUserData(context)
                    userDataBoolean: {
				        "visited": true
                    }
                }
            };
        })(config.userEventInfo || (config.userEventInfo = {}))
   })(window['adrum-config'] || (window['adrum-config'] = {}));
 
   function extractUserData(context) { 
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = cookies[i].trim();
            if (cookie.indexOf("email=") === 0) {
                var role = cookie.substring(5);
            }
        }
        return {
            role: role,
            url: context.url,
            method: context.method
        };
    }
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>

ページ ブラウザ スナップショットへのカスタムユーザデータの追加