메인 콘텐츠로 건너뛰기

​
개요

빌드 도구 없이 CDN 스크립트를 통해 Adrop Web SDK를 연동할 수 있습니다. 정적 웹사이트나 간단한 HTML 페이지에 적합합니다.

​
지원 광고 포맷

  • 배너 광고
  • 네이티브 광고 (커스텀 UI 지원)

​
요구 사항

  • 모던 브라우저 (Chrome, Firefox, Safari, Edge)

​
설치

HTML 문서의 <head> 섹션에 스크립트를 추가합니다. 
<script src="https://cdn.jsdelivr.net/npm/@adrop/ads-web-sdk@latest/dist/adrop-ads.min.js"></script>
특정 버전을 고정하려면 @latest 대신 버전 번호를 명시하세요. 예: @adrop/ads-web-sdk@1.0.1

​
초기화

스크립트 로드 후 SDK를 초기화합니다. 
<script>
  const adrop = Adrop.observe({
    appId: 'YOUR_APP_ID',
    debug: true  // 개발 환경에서만 true
  });
</script>

​
초기화 옵션 (AdropConfig)

​
appId
string
required
애드컨트롤 콘솔에서 발급받은 앱 ID
​
uid
string
사용자 식별자 (타겟팅에 활용)
​
appKey
string
API 인증 키 (사용자 속성 업데이트 시 필요)
​
debug
boolean
default:false
디버그 로깅 활성화
프로덕션 환경에서는 debug: false로 설정하세요.

​
인스턴스 접근

초기화 후 어디서든 Adrop.instance()로 SDK에 접근할 수 있습니다. 
const adrop = Adrop.instance();
// SDK 사용

​
설정 동적 변경

로그인 후 사용자 ID를 설정하는 등 런타임에 설정을 변경할 수 있습니다. 
// Setter 사용
Adrop.instance().uid = 'USER_ID';
Adrop.instance().appKey = 'YOUR_APP_KEY';

// 또는 setConfig 사용
Adrop.instance().setConfig({
  uid: 'USER_ID',
  appKey: 'YOUR_APP_KEY'
});
타겟팅 광고가 정상 동작하려면 광고 지면 렌더링 전에 uid를 설정하세요.

​
목차

배너 광고

배너 광고 구현하기

네이티브 광고

네이티브 광고 구현하기

백필 광고

백필 광고 설정하기

타겟팅 설정

오디언스/문맥 타겟팅

레퍼런스

클래스, 인터페이스, 상수

예제

React, CDN 예제 코드