> For the complete documentation index, see [llms.txt](https://document.wisetracker.co.kr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://document.wisetracker.co.kr/v2-developer/sdk/website/javascript-integration.md).
# Javascript SDK Integration
분석 시스템의 핵심 구성요소인 SDK는 웹사이트 애널리틱스에 필요한 데이터 포인트를 확보하는 역할을 수행합니다. 데이터 측정을 위해 본 문서의 안내에 따라 Javascript SDK를 웹사이트에 연동하여 주시기 바랍니다.
## 1. 필수 설정
필수 설정이란 SDK가 동작하기 위해서 반드시 웹사이트에 추가되어야 하는 설정을 말합니다. 필수 설정을 적용하게 되면 방문, 페이지뷰, 사용자의 환경 정보 등을 측정할 수 있게 됩니다.
### SDK 추가
웹사이트 SDK는 일반적인 웹사이트에 적용하는 "Javascript 타입"과 "JSX 모듈 타입" 2가지로 제공되고 있습니다. 분석하고자 하는 웹사이트의 개발 환경에 적합한 SDK 타입을 다음과 같이 타입에 맞게 추가할 수 있습니다.
#### Javascript, jQuery 등으로 개발된 웹사이트인 경우
아래의 파일을 다운로드한 후, 압축을 해제하여 개발코드가 저장된 경로에 위치시키면 됩니다.
{% file src="/files/pl1Um3aqxeG7zZxq2eMD" %}
2026.07.10 Updated
{% endfile %}
#### React.js 등 JSX로 개발된 웹사이트인 경우
아래와 같이 npm 의존성 설치를 통해 SDK 모듈을 개발코드에 import 하면 됩니다.
{% tabs %}
{% tab title="JSX" %}
```jsx
npm i dop-website-sdk
```
{% endtab %}
{% endtabs %}
### SDK 초기화
SDK 초기화(Initialization)는 SDK를 사용하기 전 반드시 먼저 실행되어야 하는 과정입니다. 이는 SDK를 웹사이트로 불러오는 코드 동작을 웹페이지의 **헤더**에 위치 시킴으로써, 웹사이트가 SDK에서 제공하는 API를 미리 인지할 수 있도록 만들어줍니다.
#### SDK 초기화 스크립트 확인
SDK 초기화 코드는 와이즈트래커 시스템에 로그인 하신 후, 아래의 메뉴에서 확인할 수 있습니다.
![서비스 선택 > \[서비스 설정\] > \[어플리케이션 설정\] > "스크립트 받기" 클릭](/files/-Mj7aruiiimkjNlFzbx3)
####
#### SDK 초기화 스크립트 적용
Javascript, jQuery 등으로 개발된 웹사이트일 경우
1. **index.html**의 `` 태그 안에 SDK 초기화 스크립트를 적용합니다.
이를 위해, 먼저 위에서 다운로드 받았던 SDK 파일(dop-website-sdk.js)에 대한 경로를 `
...
```
{% endtab %}
{% tab title="JSX" %}
```jsx
import { useEffect } from "react";
import WDOTInitialization from "dop-website-sdk";
function App() {
...
// Wisetracker SDK 초기화 스크립트
useEffect(() => {
window.WDOTInitialization.setConfig({
serviceNumber: {service number},
dotAccessToken:"Wisetracker access token string",
combackUserLimitDays:14,
dotEndPoint:"The endpoint of data receiving",
adClkEndPoint:"The endpoint of data receiving",
includeUrl:"Regular expression of analysis websites",
excludeUrl:"",
referrerExpire:7,
firstEventSendMode : false,
isSPA: true
});
window.WDOTInitialization.init();
}, []);
let WDOT = window.WDOT;
...
```
{% endtab %}
{% endtabs %}