# 연동하기

## 시작하기 전에

[DFINERY 콘솔](https://console.dfinery.ai/)의 서비스 관리/서비스 정보 페이지에서 데이터 소스 항목에 Web > 루트 도메인을 등록해주셔야합니다.

ex) <https://console.dfinery.io> -> dfinery.io 등록

<figure><img src="/files/kByxg9Ww4QXDmsd2ecNT" alt=""><figcaption></figcaption></figure>

### SDK 지원 브라우저

지원 브라우저는 아래와 같습니다.

```
Chrome, Safari, Samsung Internet, Edge, Whale, Firefox, Opera
```

{% hint style="warning" %}
IE(Intenet Explorer)는 지원하지 않습니다.
{% endhint %}

## SDK 설치

아래의 코드를 추가하여 SDK를 설치 및 초기화 합니다.

{% tabs %}
{% tab title="Javascript" %}

```javascript
// SDK 최신버젼 설치
!function(_,e){if(void 0!==_&&!_.Dfinery){var d={queue:[]},t=e.createElement("script");t.type="text/javascript",t.async=!0,t.src="//static.dfinery.io/web-sdk/latest/dfn-web-sdk.min.js",t.onload=function(){_.Dfinery.runQueuedFunctions&&_.Dfinery.runQueuedFunctions()};var n=e.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);["init","onInitialized","logEvent","setUserProfile","setUserProfiles","setIdentity","setIdentities","resetIdentity"].forEach((function(_){var e=_.split("."),t=e.pop();e.reduce((function(_,e){return _[e]=_[e]||{}}),d)[t]=function(){d.queue.push([_,arguments])}}));const i={LOGIN:"df_login",LOGOUT:"df_logout",SIGN_UP:"df_sign_up",PURCHASE:"df_purchase",REFUND:"df_refund",VIEW_HOME:"df_view_home",VIEW_PRODUCT_DETAILS:"df_view_product_details",ADD_TO_CART:"df_add_to_cart",ADD_TO_WISHLIST:"df_add_to_wishlist",VIEW_SEARCH_RESULT:"df_view_search_result",SHARE_PRODUCT:"df_share_product",VIEW_LIST:"df_view_list",VIEW_CART:"df_view_cart",REMOVE_CART:"df_remove_cart",ADD_PAYMENT_INFO:"df_add_payment_info"},E={ITEMS:"df_items",ITEM_ID:"df_item_id",ITEM_NAME:"df_item_name",ITEM_PRICE:"df_price",ITEM_QUANTITY:"df_quantity",ITEM_DISCOUNT:"df_discount",ITEM_CATEGORY1:"df_category1",ITEM_CATEGORY2:"df_category2",ITEM_CATEGORY3:"df_category3",ITEM_CATEGORY4:"df_category4",ITEM_CATEGORY5:"df_category5",DISCOUNT:"df_discount",TOTAL_REFUND_AMOUNT:"df_total_refund_amount",ORDER_ID:"df_order_id",DELIVERY_CHARGE:"df_delivery_charge",PAYMENT_METHOD:"df_payment_method",TOTAL_PURCHASE_AMOUNT:"df_total_purchase_amount",SHARING_CHANNEL:"df_sharing_channel",SIGN_CHANNEL:"df_sign_channel",KEYWORD:"df_keyword"},f={MALE:"Male",FEMALE:"Female",NON_BINARY:"NonBinary",OTHER:"Other"},r={EXTERNAL_ID:"external_id",EMAIL:"email",PHONE_NO:"phone_no",KAKAO_USER_ID:"kakao_user_id",LINE_USER_ID:"line_user_id",UNIFIED_ID:"unified_id"},o={BIRTH:"df_birth",GENDER:"df_gender",NAME:"df_name",MEMBERSHIP:"df_membership",PUSH_OPTIN:"df_push_optin",PUSH_ADS_OPTIN:"df_push_ads_optin",PUSH_NIGHT_ADS_OPTIN:"df_push_night_ads_optin",SMS_ADS_OPTIN:"df_sms_ads_optin",KAKAO_ADS_OPTIN:"df_kakao_ads_optin"},a={LOG_ENABLE:"logEnable",LOG_LEVEL:"logLevel",SHARE_SUBDOMAIN_COOKIE:"shareSubdomainCookie"},I={DISABLE:0,ERROR:1,WARN:2,INFO:3};_.DFEvent=i,_.DFEventProperty=E,_.DFGender=f,_.DFIdentity=r,_.DFUserProfile=o,_.DFConfig=a,_.DFLogLevel=I,_.Dfinery=d}}(window,document);
```

{% endtab %}
{% endtabs %}

## SDK 초기화

```javascript
init("SERVICE_KEY");
```

매개변수는 다음을 의미합니다.

* `SERVICE_KEY` : DFINERY 콘솔에서 발급된 서비스키

{% hint style="warning" %}
반드시 설치 스크립트 이후에 초기화 스크립트가 실행되어야 합니다.
{% endhint %}

## SDK 설정

```javascript
init("SERVICE_KEY", initOptions);
```

매개변수는 다음을 의미합니다.

* `initOptions` : SDK 설정 Dictionary

### SDK 설정 값

| 이름                   | 타입         | 기본값              | 설명                        | 필수 |
| -------------------- | ---------- | ---------------- | ------------------------- | -- |
| shareSubdomainCookie | boolean    | true             | sub domain과 공유되는 쿠키 사용 여부 | X  |
| logEnable            | boolean    | true             | 로그 활성화 여부                 | X  |
| logLevel             | DFLogLevel | DFLogLevel.Error | [로그레벨](#log_level) 사용     | X  |

### 사용 예시

{% tabs %}
{% tab title="Javascript" %}

```javascript
const initOptions = {}
// INFO로 설정시 자세한 로그를 볼수 있습니다.  테스트시 추천합니다.
initOptions[DFConfig.LOG_LEVEL] = window.DFLogLevel.Info 

Dfinery.init('Your ServiceId', initOptions);
```

{% endtab %}
{% endtabs %}

### SDK 설정 상수 <a href="#init_options" id="init_options"></a>

| 상수                                | 값                    | 설명                   |
| --------------------------------- | -------------------- | -------------------- |
| DFConfig.LOG\_ENABLE              | logEnable            | 로그 활성화 여부            |
| DFConfig.LOG\_LEVEL               | logLevel             | 로그 레벨                |
| DFConfig.SHARE\_SUBDOMAIN\_COOKIE | shareSubdomainCookie | 서브도메인과 공유되는 쿠키 사용 여부 |

### 로그 레벨 <a href="#log_level" id="log_level"></a>

| 상수               | 값 | 설명                      |
| ---------------- | - | ----------------------- |
| DFLogLevel.ERROR | 1 | Error 로그만 표시            |
| DFLogLevel.WARN  | 2 | Warn, Error 로그 표시       |
| DFLogLevel.INFO  | 3 | Error, Warn, Info 로그 표시 |

### 완료

SDK 설치 및 초기화가 완료되었습니다.

SDK 가 정상적으로 설치 확인하기 위해서는 브라우저의 개발자모드 콘솔 창에 window\.Dfinery를 입력하여 객체가 생성되어 있는지 확인합니다. undefined가 아니라면 정상입니다.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.dfinery.ai/developer-guide/platform/web/integration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.