Integrating DFINERY (Adbrix) [Web]
Follow
You can use the web platform analytics feature.
When using the App SDK and Web SDK together, you can integrate app/web users into a single report to measure and analyze advertising performance.
Without separate report settings, all analysis results are distinguished or integrated through the selection of Android, iOS, and Web.
[[Quote:Info:Small]] Web analytics features are available through an additional paid plan.
View detailed features
ㅣ
Inquiries
Refer to the guide below to integrate the Definery (AdBrix) JavaScript SDK.
Web Platform Setup
Access the DFINERY console and add Web to the apps platform.
You need to add a web type to verify the web secret key required for SDK integration.
SDK Installation and Initialization
This is a guide on how to install and initialize the SDK for a web project.
SDK supported browsers
Supported browsers are as follows.
Chrome, Safari, Samsung Internet, Edge, Whale, Firefox, Opera
[[Quote:Warning:Small]] IE browser is not supported.
SDK Installation and Initialization
Install and initialize the SDK by adding the following code.
You can install the latest version and a specific version of the SDK.Set it in one of two ways.
<head>
:
:
<!-- SDK 설치 -->
<!-- Set AdBrix Web SDK in Lastest Version -->
<script>!function(e,r){if(void 0!==e&&!e.adbrix){var t={queue:[]},o=(navigator.userAgent.toLowerCase(),r.createElement("script"));o.type="text/javascript",o.async=!0,o.src="//static.adbrix.io/web-sdk/latest/abx-web-sdk.min.js",o.onload=function(){e.adbrix.runQueuedFunctions&&e.adbrix.runQueuedFunctions()};var c=r.getElementsByTagName("script")[0];c.parentNode.insertBefore(o,c);["init","onInitialized","login","getUserId","setAge","setGender","logout","userProperty.get","userProperty.getAll","userProperty.addOrUpdate","userProperty.remove","userProperty.removes","common.signUp","common.invite","common.useCredit","common.purchase","event.send","debug.traceListener","commerceAttr.categories","commerceAttr.product","commerce.viewHome","commerce.categoryView","commerce.productView","commerce.addToCart","commerce.addToWishList","commerce.reviewOrder","commerce.refund","commerce.search","commerce.share","commerce.listView","commerce.cartView","commerce.paymentInfoAdded","game.tutorialComplete","game.characterCreated","game.stageCleared","game.levelAchieved","push.isPushEnabled","push.isPushSupported","push.showPrompt","push.showNativePrompt","push.showLocalNotification","push.getNotificationPermission"].forEach((function(e){var r=e.split("."),o=r.pop();r.reduce((function(e,r){return e[r]=e[r]||{}}),t)[o]=function(){t.queue.push([e,arguments])}})),e.adbrix=t}}(window,document);</script>
<!-- Set AdBrix Web SDK in Fixed Version -->
<script>!function(e,r){if(void 0!==e&&!e.adbrix){var version='1.3.5',t={queue:[]},o=(navigator.userAgent.toLowerCase(),r.createElement("script"));o.type="text/javascript",o.async=!0,o.src="//static.adbrix.io/web-sdk/"+version+"/abx-web-sdk.min.js",o.onload=function(){e.adbrix.runQueuedFunctions&&e.adbrix.runQueuedFunctions()};var c=r.getElementsByTagName("script")[0];c.parentNode.insertBefore(o,c);["init","onInitialized","login","getUserId","setAge","setGender","logout","userProperty.get","userProperty.getAll","userProperty.addOrUpdate","userProperty.remove","userProperty.removes","common.signUp","common.invite","common.useCredit","common.purchase","event.send","debug.traceListener","commerceAttr.categories","commerceAttr.product","commerce.viewHome","commerce.categoryView","commerce.productView","commerce.addToCart","commerce.addToWishList","commerce.reviewOrder","commerce.refund","commerce.search","commerce.share","commerce.listView","commerce.cartView","commerce.paymentInfoAdded","game.tutorialComplete","game.characterCreated","game.stageCleared","game.levelAchieved","push.isPushEnabled","push.isPushSupported","push.showPrompt","push.showNativePrompt","push.showLocalNotification","push.getNotificationPermission"].forEach((function(e){var r=e.split("."),o=r.pop();r.reduce((function(e,r){return e[r]=e[r]||{}}),t)[o]=function(){t.queue.push([e,arguments])}})),e.adbrix=t}}(window,document);</script>
<script>
window.adbrix.init({
appkey: 'your_appkey',
webSecretkey: 'your_webSecretKey'
});
</script>
: </head>
[[Quote: Guide: Normal]] When updating the SDK version, method names within the script may change or be added.We recommend that you always keep the latest version.
[[Quote:Danger:Small]] The initialization script must be executed after the installation script.
[[Caution:Risk:Small]] Please note that if you connect to a previous version after connecting to version v1.3.2 (encrypted version), the cookies will be reset.
The configuration values for each item when initializing the SDK are as follows.
attributes |
type |
required |
default |
description |
---|---|---|---|---|
appkey |
string |
O |
X |
App key |
webSecretkey |
string |
O |
X |
Web secret key |
userHash |
string |
X |
X |
Used to identify the client's user. |
isOptOut |
boolean |
X |
false |
Used for personalized advertising. If true, personalized ad tracking will be disabled. |
isExecPageViewEvent |
boolean |
X |
true |
When the page opens, the page_view event is automatically sent. |
isIncludeReferrer |
boolean |
X |
true |
Tracking the referrer. |
isIncludeUtm |
boolean |
X |
true |
Track UTM ads. ex) utm_source, utm_medium, utm_campaign, utm_term, utm_content |
isIncludeGclid |
boolean |
X |
true |
Track gclid. |
isIncludeFbclid
|
boolean |
X |
true |
Tracking fbclid.
|
isIncludeNaver |
boolean |
X |
true |
Tracking Naver ads. ex) n_campaign_type, n_ad_group, n_media, n_ad, n_keyword, n_keyword_id, n_query, n_rank, n_mall_pid, n_contract |
supportUrlQueryKeys |
string[] |
X |
[] |
In the queryString of the users browser, set the key value to be automatically transmitted. |
shareSubdomainCookie |
boolean |
X |
true |
Use of cookies shared with subdomains |
traceLevel |
number |
X |
1 |
0 : Inactive 1 : Error 2 : Warning 3 : Information |
Check SDK installation
To verify if the SDK has been successfully loaded, enter window.adbrix in the browser console window and check if the result appears as shown below.
If the object is output correctly, please check if the event is well collected on the console.adbrix.io page under Analytics > LiveBrix > Events tab.
[[인용:보통:위험]]LiveBrix reports are available after 15 minutes.Please proceed with the test and wait a moment!
User API
This is an API for analyzing user login/logout events and user information.
[[Quote: Risk: Small]] All APIs from here operate after the DFINERY (Adbrix) SDK is init.
Login / Logout
Call the login event using adbrix.login.The UserID used in the login event can be changed dynamically.
[[인용:보통:위험]]
Login Precautions
The user ID used for login is used for matching between users and devices when using the growth action function. If login is called again without logging out after logging in, correct matching may not occur.
Please be careful not to include personal information in your user ID. If the user ID includes personal information such as email or phone number, we recommend encrypting it.
adbrix.login('user_id');
To retrieve the UserID of a logged-in user, call the getUserId method as shown below.
adbrix.onInitialized(() => { adbrix.getUserId(); });
Call the logout event using adbrix.logout.When the logout event is triggered, both UserProperty and UserID stored in the browser cache are reset.
adbrix.logout();
UserProperty
UserProperty is a method that analyzes user information (points, purchase frequency, age, gender, etc.).
Use the setAge, setGender functions for age and gender.
adbrix.setAge(30);
adbrix.setGender(2); // 0:UNKNOWN, 1:FEMALE, 2:MALE
Add or update user information using adbrix.userProperty.addOrUpdate.
adbrix.userProperty.addOrUpdate('email', 'abx@igaworks.com');
UserProperty is written according to the following rules.
Key
- Only String can be used
- Up to 256 characters allowed
- Only lowercase letters, numbers, and special character _ are allowed.
Value
- Only String, Number, and Boolean types can be used
- Up to 1024 bytes can be used
- Null values cannot be used
[[인용:위험:작게]] Cookie values exceeding 4,096 bytes will not be saved.
[[Caution: Small]] The set UserProperty is reset as soon as the adbrix.logout event is called.
Common API
This is an API for commonly used events on the web.
join the membership
Using adbrix.common.signUp , call the sign-up event.
adbrix.common.signUp('signChannel');
The SignChannel for the API is as follows.(If a value other than the specified channel is entered, it will not be invoked)
SignChannel
- Kakao
- Naver
- Line
- UserId
- ETC
- SkTid
- AppleId
user invitation
Call the user invitation event using adbrix.common.invite.
adbrix.common.invite('inviteChannel', 'your_customer_userid');
The InviteChannel for the API is as follows.(If any value other than the specified channel is entered, it will not be called)
InviteChannel
- Kakao
- Naver
- Line
- UserId
- ETC
- SkTid
- AppleId
credit usage
By using adbrix.common.useCredit, it calls the currency use event within the Web.
adbrix.common.useCredit(10000);
Purchase Event
Using adbrix.common.purchase, call the purchase event within the Web.
adbrix.onInitialized(() => { // product category setting var category_1 = adbrix.commerceAttr.categories ( 'category1', // At least 1 category required 'category2', 'category3', 'category4', 'category5' ); // product information setting var product_1 = adbrix.commerceAttr.product( 'product_ID', // product_id 'prduct_Name', // product_name 20000.00, // price 3, // quantity 1000.00, // discount 'KRW', // currency category_1, // category {'size': 36} // product properties (Optional) ); // create product list var productList = []; productList.push(product_1); // purchase API adbrix.common.purchase( 'order_id', // order_id productList, // product_list 59000.00, // order_sale 1500.00, // discount 2500.00, // delivery_charge 'CreditCard', // payment_method {'membertype' : 'VIP'} // event properties (Optional) ); });
[[Caution: Moderate]] adbrix . commerceAttr . categories and, adbrix . commerceAttr .product functions should be used after SDK initialization is complete or within the onInitialized function. If called before SDK initialization is complete, undefined will be returned.
The currency information used in product details and payment information (Payment_method) is as follows.
Currency | Payment_method |
KRW | CreditCard |
USD | BankTransfer |
JPY | MobilePayment |
EUR | ETC |
GBP | |
CNY | |
TWD | |
HKD | |
IDR | |
INR | |
RUB | |
THB | |
VND | |
MYR |
Commerce Event
Enter the home (main) screen
Analyzes events in which the user enters the apps home (main) screen.
adbrix.commerce.viewHome();
Enter category (special exhibition)
Analyze events in which users enter the category (special exhibition) screen.
We will provide product information displayed when entering the category as follows.
categories |
categories |
O |
X |
Category Model |
products |
product [] |
O |
X |
Product List |
properties |
json |
X |
X |
Additional Property |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('게임', '소셜', '커머스', '여성', '육아');
var product = adbrix.commerceAttr.product('product_id', '상품명', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products= [];
products.push(product);
adbrix.commerce.categoryView(categories, products, {'key': 'value'});
});
View product details
We analyze events where users view products in detail.
We convey information about the following products.
product |
product |
O |
X |
Product |
properties |
json |
X |
X |
Additional Properties |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Women', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
adbrix.commerce.productView(product, {'key': 'value'});
});
Put in a shopping cart
We analyze events in which users add products to their shopping carts.
products |
product, product [] |
O |
X |
Product Information (List) |
properties |
json |
X |
X |
Additional Property |
- When there is 1 product
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Female', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
adbrix.commerce.addToCart(product, {'key': 'value'});
});
- When there are 2 or more products
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Women', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.addToCart(products, {'key': 'value'});
});
Add to Wishlist
Analyze the event where a user adds a product to their wishlist.
We convey the following product information:
product |
product,product[] |
O |
X |
Product Information (List) |
properties |
json |
X |
X |
Additional Property |
- When there is 1 product
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Women', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
adbrix.commerce.addToWishList(product, {'key': 'value'});
});
- If there are 2 or more products
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Female', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.addToWishList(products, {'key': 'value'});
});
Confirm your order
We analyze the final confirmation event that a user confirms before paying for a product.
We convey the following order and product information:
orderId |
string |
O |
X |
Order Number |
products |
product [] |
O |
X |
Product List |
discount |
number |
X |
X |
Discount Amount |
deliveryCharge |
number |
X |
X |
Shipping cost |
properties |
json |
X |
X |
Additional Property |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Women', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.reviewOrder('orderid_1', products, 10, 20, {'key': 'value'});
});
Cancel Order (Refund)
Analyze events in which a user canceled an order or issued a refund.
We convey the following product and order information:
orderId |
string |
O |
X |
Order Number |
products |
product [] |
O |
X |
Product List |
penaltyCharge |
number |
X |
X |
Cancellation (Refund) Fee |
properties |
json |
X |
X |
Additional Properties |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Female', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.refund('orderid_1', products, 10, {'key': 'value'});
});
Search for product
Analyze events in which users search for products.
We deliver product information included in the following search results.
keyword |
string |
O |
X |
Search term |
products |
product [] |
O |
X |
Product List |
properties |
json |
X |
X |
Additional Property |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Female', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.search('keyword', products, {'key': 'value'});
})
Share product
Analyze events in which users share product information.
We communicate shared product information such as:
sharingChannel |
CommerceSharingChannelEnum |
O |
X |
Shared Channel |
products |
product [] |
O |
X |
Product List |
properties |
json |
X |
X |
Additional Property |
|
KakaoTalk |
KakaoStory |
|
SMS |
copyUrl |
ETC |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Women', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.share('KakaoTalk', products, {'key': 'value'});
});
View product list
Analyze events in which users view product lists.
We deliver the following product information you have viewed.
products |
product [] |
O |
X |
Product List |
properties |
json |
X |
X |
Additional Property |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Women', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.listView(products, {'key': 'value'});
});
View shopping cart
Analyze events in which users view product lists.
We deliver the following product information you have viewed.
products |
product [] |
O |
X |
Product List |
properties |
json |
X |
X |
Additional property |
adbrix.onInitialized(() => {
var categories = adbrix.commerceAttr.categories('Game', 'Social', 'Commerce', 'Female', 'Parenting');
var product = adbrix.commerceAttr.product('product_id', 'Product Name', 1000, 5, 200, 'KRW', categories, {'key': 'value'});
var products = [];
products.push(product);
adbrix.commerce.cartView(products, {'key': 'value'});
};
Enter payment information
Analyze events where users enter payment information.
adbrix.commerce.paymentInfoAdded({'key': 'value'});
Game Event
Tutorial completed
Analyze tutorial completion events that occur in the app.
isSkip |
boolean |
O |
X |
Whether it is completed through skipping |
properties |
json |
X |
X |
Additional Property |
const gameAttr = {
'grade': 'vip',
'howmany_buy': 36,
'discoint': true,
};
adbrix.game.tutorialComplete(true, gameAttr);
character generation
Analyze character creation events that occurred in the app.
properties |
json |
X |
X |
Additional Property |
const gameAttr = {
'grade': 'vip',
'howmany_buy': 36,
'discoint': true,
};
adbrix.game.characterCreated(gameAttr);
Stage completed
Analyze stage completion events that occur in the app.
stageName |
string |
O |
X |
Completed Stage Name |
properties |
json |
X |
X |
Additional Property |
const gameAttr = {
'grade': 'vip',
'howmany_buy': 36,
'discoint': true,
};
adbrix.game.stageCleared('1-5', gameAttr);
Level achieved
Analyze level achievement events that occurred in the app.
level |
number |
O |
X |
Achieved Level |
properties |
json |
X |
X |
Additional Property |
const gameAttr = {
'grade': 'vip',
'howmany_buy': 36,
'discoint': true,
};
adbrix.game.levelAchieved(1, gameAttr);
Custom Event
Used to call a user-defined event in addition to the event pre-defined in the DFINERY (Adbrix) SDK.
In a custom event, you can send additional information included in the event, apart from the event name, using key/value as shown below.
adbrix.event.send('your_event_name', {'key': 'value'})
The key/value of additional event information added to the custom event is subject to the following rules.
Key
- Only string is available
- Up to 256 characters are allowed in total
- Only lowercase alphabets, numbers, and special character _ are allowed.
Value
- Only String, Number, and Boolean types can be used.
- Up to 1024 bytes can be used
Inquiry
For inquiries regarding DFINERY WEB SDK integration, please contact us through the dedicated email account below and we will respond.
adbrix-web-sdk-support@adbrixsupport.zendesk.com