AnalyticsTracker
AnalyticsTracker를 설치하는 것은 간단합니다. Nuget에서 설치하여 프로젝트에 추가하십시오.
템플릿에서 <body> 다음을 추가하여 추적 스크립트를 렌더링하십시오.
@using Vertica.AnalyticsTracker
...
<body>
@AnalyticsTracker.Render("UA-xxxxxx-1")
...
</body>
<%@ Import Namespace="Vertica.AnalyticsTracker" %>
...
<body>
<%= AnalyticsTracker.Render("UA-xxxxxx-1") %>
...
</body>
Render () 메소드의 오버로드를 사용하여 트래커 설정을 조정할 수 있습니다.
@AnalyticsTracker.Render(
account: "UA-xxxxxx-1",
trackDefaultPageview: true,
displayFeatures: false,
trackerConfiguration: new Dictionary<string, object>
{
{"cookieDomain", "foo.example.com"},
{"cookieName", "myNewName"},
{"cookieExpires", 20000}
});
AnalyticsTracker는 AJAX 요청에서 데이터를 추적 할 수도 있습니다. 이를 활성화하려면 Vertica.AnalyticsTracker.Modules.AnalyticsHttpModule 을 응용 프로그램에 추가하십시오. 그런 다음 추적하려는 요청의 경우 AnalyticsTracker-Enabled HTTP 요청 헤더를 true 로 설정하십시오.
그런 다음 응답에는 Base64 인코딩 헤더로 추적 JS 코드가 포함됩니다.
우리는 당신이 사이트에 포함시킬 수있는 /Scripts/analyticstracker.adapters.js 파일에 jQuery 및 angular 대한 Ajax 인터셉터를 포함시켰다. 프레임 워크 다음에 포함시켜야합니다.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js"></script>
<script src="/Scripts/analyticstracker.adapters.js"></script>
AnalyticsTracker는 SOM 현명한 기본값을 제공하고 필요한 경우 고급 설정을 무시할 수 있습니다.
브라우저의 페이지와 다른 URL을 추적하려면 현재 추적기의 페이지를 설정하여이를 재정의 할 수 있습니다.
AnalyticsTracker.Current.SetPage("/my/custom/url");
기본적으로 AnalyticsTracker는 기본 추적 코드를 출력하고 표준 페이지 뷰를 추적합니다. 추가 데이터를 추적하려면 현재 추적기에 commands 추가합니다.
여기서 우리는 컨트롤러에서 이벤트를 추적하고 있습니다
public ActionResult About()
{
AnalyticsTracker.Current.Track(new EventCommand("category", "action", "label"));
ViewBag.Message = "Your application description page.";
return View();
}
전자 상거래 거래를 추적하는 명령은 다음과 같이 사용할 수 있습니다.
var transaction = new TransactionInfo(
id: "order1001",
affiliation: string.Empty,
revenue: 100,
shipping: 10,
tax: 5,
currency: AnalyticsCurrency.USD);
transaction.AddItem(
name: "Black shirt",
sku: "sh001",
category: "Shirts",
price: 50,
quantity: 2);
AnalyticsTracker.Current.Track(new TransactionCommand(transaction));
계정에서 강화 된 전자 상거래 추적을 활성화 한 경우 해당 명령을 사용하여 거래를 추적해야합니다.
var purchaseAction = new PurchaseActionFieldObject(
id: "order1001",
affiliation: string.Empty,
revenue: 100,
shipping: 10,
tax: 5,
coupon: null);
var lineItems = new []
{
new ProductFieldObject(
id: "sh001",
name: "Black shirt",
brand: "Northwind",
category: "Shirts",
variant: null,
price: 50,
quantity: 2,
coupon: null,
position: 1)
};
AnalyticsTracker.Current.Track(new PurchaseCommand(purchaseAction, lineItems));
전자 상거래를 추적 할 때 추적기에서 통화를 설정할 수도 있습니다.
향상된 전자 상거래를 통해 다른 많은 것들을 추적 할 수 있습니다. 명령은 Vertica.AnalyticsTracker.Commands.EnhancedEcommerce 네임 스페이스에 있습니다.
AddToBasketCommand(...)
RemoveFromBasketCommand(...)
CheckoutCommand(...)
CheckoutOptionCommand(...)
ProductClickCommand(...)
ProductDetailCommand(...)
ProductListCommand(...)
일반적으로 원하는 것은 사용자가 페이지를 다시로드하더라도 트랜잭션이 한 번만 추적되도록하는 것입니다. 서버에서이를 추적해야하지만 일반적으로 백 버튼을 사용하는 사용자 또는 실제 서버 상호 작용이없는 브라우저를 사용하는 브라우저도 있습니다.
CookieGuardedCommand 입력하십시오.
AnalyticsTracker.Current.Track(new CookieGuardedCommand(innerCommand, "order12345"));
CookieGuardedCommand 로 명령을 줄이면 if 문의 내부 명령이 다음과 같은 명령을 내립니다.
if (document.cookie.search(/AnalyticsTrackerGuardorder12345=true/) === -1) {
ga('send', {'hitType': 'event','eventCategory': 'cat','eventAction': 'act','eventLabel': ''});
document.cookie = 'AnalyticsTrackerGuardorder12345=true; Expires=' + new Date(2016, 05, 02).toUTCString();
}
동일한 JavaScript가 두 번 실행되면 명령이 다시 실행되지 않도록합니다. 예를 들어 user는 명령 ID로서 쿠키가 해당 특정 주문에 대해서만 설정되어 있는지 확인합니다.
때로는 서버 상호 작용없이 이벤트가 발생합니다. 예를 들어 이미지를 클릭하여 축소하십시오. 이 경우 AnalityCstracker를 사용하여 필요한 스크립트를 생성 할 수 있습니다.
<a href="#" onmousedown="@AnalyticsTracker.ClientCommand(new EventCommand("category", "action", "label"))">
<img src="..."/>
</a>
템플릿에서 <body> 다음을 추가하여 추적 스크립트를 렌더링하십시오.
@using Vertica.AnalyticsTracker
...
<body>
@TagManager.Render("GTM-XXYYY")
...
</body>
<%@ Import Namespace="Vertica.AnalyticsTracker" %>
...
<body>
<%= TagManager.Render("GTM-XXYYY") %>
...
</body>
필요한 경우 Google Tag Manager (Script, Noscript 및 Datalayer)의 개별 부분을 다음과 같이 렌더링 할 수 있습니다.
TagManager.RenderScript()TagManager.RenderNoScript()TagManager.RenderDataLayer()Render () 메소드의 오버로드를 사용하여 태그 설정을 조정할 수 있습니다.
@TagManager.Render(account:"GTM-XXYYY", dataLayerName: "myLayer");
TagManager를 사용하면 dataLayer 변수에 쉽게 정보를 제공 할 수 있습니다.
TagManager.Current.AddMessage(new Variable("myVariable", "myValue"));
이것은 다음 DatalAyer를 생성합니다
<script>
var dataLayer = dataLayer || [];
dataLayer.push({'myVariable': 'myValue'});
</script>
때로는 DatalAyer에 더 복잡한 개체를 추가하고 싶을 수도 있으며 사전을 사용하여 지원됩니다.
var dict = new Dictionary<string, object>
{
{"myProp", "myValue"},
{"yourProp", 12345}
};
TagManager.Current.AddMessage(new Variable("myVariable", dict));
그러면 사전은 깊은 물체로 렌더링됩니다.
<script>
var dataLayer = dataLayer || [];
dataLayer.push({'myVariable': {'myProp': 'myValue','yourProp': 12345}});
</script>
TransactionMessage를 사용하면 주문 정보가 데이터 층을 통해 전송 될 수 있습니다.
var items = new[]
{
new TransactionItemInfo(
name: "Black shirt",
sku: "sh001",
category: "Shirts",
price: 50,
quantity: 2)
};
var message = new TransactionMessage(
transactionId: "order1001",
affiliation: string.Empty,
total: 100,
tax: 5,
shipping: 10,
items: items);
TagManager.Current.AddMessage(message);
주문은 GTM 사양에 따라 렌더링됩니다.
<script>
var dataLayer = dataLayer || [];
dataLayer.push(
{
'transactionId': 'order1001',
'transactionAffiliation': '',
'transactionTotal': 100,
'transactionTax': 5,
'transactionShipping': 10,
'transactionProducts': [
{
'name': 'Black shirt',
'sku': 'sh001',
'category': 'Shirts',
'price': 50,
'quantity': 2
}
]
});
</script>