Web
개요
직광고 데이터를 조회해 직접 UI를 구성하여 광고를 송출합니다.
기기에서 광고 ID 수집이 허용되어 있어야 광고 송출이 가능합니다.
설치
Android Native SDK
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val webView = findViewById<WebView>(R.id.wvWebView)
// Web SDK 연동하는 WebView 설정
webView.settings.apply {
javaScriptEnabled = true // 자바스크립트 활성화
domStorageEnabled = true // DOM 스토리지 활성화
}
// JavaScript Interface 추가
webView.addJavascriptInterface(
SPCWebView.SPCWebBridge(context = context, webView = webView),
SPCWebView.WEB_VIEW_BRIDGE
)
}WebVieiw 내 Javascript 및 Local storage 활성화
Javascript Interface 설정
addJavascriptInterface 함수를 이용해 AvatyeWebBridge를 설정합니다.
이후에는 Web SDK 를 확인해 웹 페이지 내에 배너를 지정하여 광고를 송출할 준비를 진행합니다.
iOS Native SDK
class webSDKTestViewController: ViewController {
var webView: WKWebView = WKWebView()
var pageUrl = "test.html"
override func viewDidLoad(){
super.viewDidLoad()
// 웹뷰에 Javascript Bridge 설정
let scriptMessageHandler = AvatyeWebSDKController(rootWebView: webView)
webView.configuration.userContentController.add(scriptMessageHandler, name: "AvatyeBridge_SPC")
// 웹뷰 Delegate 설정
webView.navigationDelegate = self
// 웹뷰를 뷰에 추가
view.addSubview(webView)
// 웹 페이지 로드
if let url = URL(string: pageUrl) {
let request = URLRequest(url: url)
webView.load(request)
}
}
}
// WKWebview Delegate 구현
extension webSDKTestViewController: WKNavigationDelegate{
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
guard let url = navigationAction.request.url, url.absoluteString != "about:blank" else {
decisionHandler(.cancel)
return
}
if url.absoluteString != pageUrl {
// 웹뷰에서 사용중인 url과 다를 경우, 기본 브라우저로 오픈 처리
UIApplication.shared.open(url, options: [:]) { isSuccess in
// after open
}
decisionHandler(.cancel)
} else {
// 웹뷰 내에서 랜딩
decisionHandler(.allow)
}
}
}AvatyeWebSDKController에 rootWebView 객체를 설정 후 생성해줍니다.
AvatyeWebSDKController를 생성 후, “AvatyeBridge_SPC” 이름으로 scriptMessageHandler를 등록해줍니다.
기본브라우저에서 랜딩을 처리할 수 있도록 Delegate를 구현합니다.
이후에는 Web SDK 를 확인해 웹 페이지 내에 배너를 지정하여 광고를 송출할 준비를 진행합니다.
Web SDK
<Html>
<Head>
</Head>
<body>
// 상용
<script src={'https://s.avatye.com/webSDK/spc/pointhome-{version}.min.js'} />
// 테스트
<script src={'https://s.avatye.com/webSDK/spc/pointhome-{version}-test.min.js'} />
</body>
</Html>script 태그를 <body> 태그 내부의 하단에 추가합니다.
pointhome-1.0.6.min.js
스크립트의 URL이 v1.0.6부터 변경되었습니다.
https://s.avatye.com/webSDK/spc/pointhome-1.0.6.min.js
(이전 레거시 파일(v1.0.6 미만)들은 기존 경로와 최신 경로 모두 import 가능합니다.)
직광고
// 최초 initialize하여 광고 세팅에 필요한 데이터를 초기화합니다.
// Promise로 동작하며, init 이후에 바로 피드 광고를 조회할 경우 비동기 처리가 필요합니다.
Pointhome.direct.init({
appID: '', // 아래 표를 참고해 주세요.
appSecret: '', // 아래 표를 참고해 주세요.
userID: '', // user key
isTest: false, // test 대역일 경우 true로 세팅
});
// (Sample) 피드 광고를 조회합니다.
const getDirect = async () => {
const result = await Pointhome.direct.get({
placementID: '', // 아래 표를 참고해 주세요.
});
console.log(result);
// {
// ads: [
// {
// placementID: "c42912ac-a588-4240-b40a-76e2f626588f",
// advertiseID: "f5405131ad464d20991dc6900384f291",
// title: "6/20 15:35",
// productID: "CPC",
// imageUrl:
// "https://s.avatye.com/images/spc/1718866494904_%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-06-20%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%203.54.44.png",
// iconUrl: null,
// reward: 0,
// rewardType: 3,
// rewardFrequencyMinutes: 60,
// landingUrl: "https://naver.com",
// useInAppBrowser: false,
// },
// {
// placementID: "c42912ac-a588-4240-b40a-76e2f626588f",
// advertiseID: "a36e40c659914fc89a1dfd83e6e089d9",
// title: "[벨류모어] 홈헬스",
// productID: "CPP",
// imageUrl:
// "https://s.avatye.com/pointhome/valuemore_homehealth_middle_240430.png",
// iconUrl: "",
// reward: 1,
// rewardType: 3,
// rewardFrequencyMinutes: 1440,
// landingUrl: "https://homehealth.sep11.kr/join/391",
// useInAppBrowser: false,
// },
// ],
// }
};
// 매출 정산을 위하여 광고 클릭 전에 호출 필요
Pointhome.direct.impression({
placementID: '', // 아래 표를 참고해 주세요.
advertiseID: '', // 광고 조회 시에 나온 값 사용
});
// SPC 직광 광고에 참여하고 리워드를 지급합니다.
Pointhome.direct.click({
placementID: '', // 아래 표를 참고해 주세요.
advertiseID: '', // 광고 조회 시에 나온 값 사용
});Function
Parameter
Require
Description
init() : 세팅 초기화
appID (String)
O
앱 식별자 [TEST] AOS: dca19cb2e4f14c0895b7bdb4d728c685
iOS: af46ad7d30ea40f88ddf0d76345d89f9 [PROD] AOS: 91fa96ba80234b21b6f21757552d2141 iOS: 78d42982598e4f61b60e360a05b5a58b
appSecret (String)
O
비밀 키 [TEST] AOS: d6edd2574bcf43a9
iOS: 18f4a1ec94574607 [PROD] AOS: fc3d90ce08ef44a9 iOS: 027891858ac643c3
userID (String)
O
유저 키
isTest (Boolean)
X
대역 세팅
get() : 직광고 조회
placementID(String)
O
지면 ID
[리스트 배너] [TEST] AOS: c42912ac-a588-4240-b40a-76e2f626588f iOS: 305b2564-2cfc-4036-9ca4-30b5fd39f607
[PROD] AOS: 28515954-cfbe-47cc-8b3c-2dc69ed216a8 iOS: 5a42b6d7-f4ab-45da-803b-bfb0b79524c9 [슬라이드 배너] [TEST] AOS: eb294264-896a-414b-ac51-b93033b2f282 iOS: 305b2564-2cfc-4036-9ca4-30b5fd39f607 [PROD] AOS: f99bfb86-8014-43f4-bda8-97dce9525395 iOS: f28d523b-12f8-4df6-97ba-ec53a5b58dc8
impression() : 매출 정산용
placementID (String)
O
지면 ID
advertiseID (String)
O
광고 ID
click() : 직광고 적립
placementID (String)
O
지면 ID
advertiseID (String)
O
광고 ID
Response Data의 자세한 타입은 링크을 참조해 주세요.
연동 시 주의사항
광고 임프레션
광고 노출여부를 확인하기 위해 실행하는 메소드입니다. 매 광고마다 광고가 노출되었을 때, 해당 메소드를 호출해주세요.
호출되지 않을 경우 광고 매출정산이 맞지 않을 수 있습니다.
광고 클릭
사용자가 광고를 참여한 경우 호출하는 API입니다.
Error
code
status
message
Description
init_required
-
필수 값이 세팅되지 않았습니다.
init()을 호출하지 않은 경우 발생
required_adid_agree
-
광고 ID 수집 동의가 필요합니다.
기기 설정에 광고ID를 받아오지 않게끔 설정되어 있는 경우
request_adid_failed
-
광고 ID를 가져오는데 실패했습니다.
브릿지 통신에 실패한 경우
invalid_parameter
400
${parameter} is not defined.
필요한 파라미터를 받아오지 못한 경우(SDK 에러)
UNAUTHORIZED
401
인증 정보를 찾을 수 없습니다.\n인증이 필요합니다.
인증에 실패한 경우 발생하며, 자주 발생 시엔 문의 필요
INVALIDPARAMETER
499
입력값이 잘못되었습니다
필요한 파라미터를 받아오지 못한 경우(서버 에러)
Exception
-
-
네트워크 연결 불가능 또는 분류되지 않은 에러 발생 시
Pointhome Interface [@types/Pointhome.d.ts]
interface Pointhome {
NAM: {
init: ({ pubID, eventListener }: {
pubID: string;
eventListener?: {
onLoaded?: (elementID: string) => void;
onClicked?: (elementID: string) => void;
onError?: (elementID: string, stat: number) => void;
};
}) => Promise<void>;
setPlacements: (
params:
| {
elementID: string;
placementID: string;
adUnitID: string;
onClick: (elementID: string, curl: string) => void;
}
| {
elementID: string;
placementID: string;
adUnitID: string;
onClick: (elementID: string, curl: string) => void;
}[]
) => void;
};
feed: {
init: ({
uniqueID,
gender,
birthDate,
}: {
uniqueID: string;
gender?: string;
birthDate?: string;
}) => void;
get: ({
placementID,
targetFill,
cursor,
}: {
placementID: string;
targetFill?: string;
cursor?: string;
}) => Promise<Feed>;
};
direct: {
init: ({
appID,
appSecret,
userID,
isTest,
}: {
appID: string;
appSecret: string;
userID: string;
isTest?: boolean;
}) => Promise<void>;
get: ({ placementID, }: {
placementID: string;
}) => Promise<Direct>;
impression: ({ placementID, advertiseID, }: {
placementID: string;
advertiseID: string;
}) => Promise<void>;
click: ({ placementID, advertiseID, }: {
placementID: string;
advertiseID: string;
}) => Promise<void>;
};
};
type Direct = {
ads: {
placementID: string;
advertiseID: string;
productID: string;
title: string;
imageUrl: string;
iconUrl: string;
reward: number;
rewardFrequencyMinutes: number;
landingUrl: string;
useInAppBrowser: boolean;
isClicked: boolean;
isChecked: boolean;
}[];
};
type Feed = {
cursor: string;
items: {
id: string;
name: string;
impression_urls: string[];
reward: number;
reward_condition: string;
check_participation_url: string;
type: string;
payload: string;
creative: {
title: string;
description: string;
click_url: string;
call_to_action: string;
width: number;
height: number;
icon_url: string;
image_url: string;
is_deeplink: boolean;
};
}[];
}Last updated