이벤트 리스너 추가

1. 광고 이벤트 리스너 추가

gladsdk.addEventListener()를 사용하여 광고 슬롯 렌더링중에 발생하는 이벤트에 대해 이벤트리스너를 추가할 수 있습니다.

2. 이벤트 종류

이벤트	이벤트 타입명	설명
광고 로드	gladsdk.event.AD_LOADED	광고 슬롯에 광고 로드 시 발생
광고 클릭	gladsdk.event.AD_CLICKED	광고 슬롯에 랜더링된 소재 클릭 시 발생
광고 노출	gladsdk.event.AD_IMPRESSED	광고 슬롯에 랜더링된 소재 노출 기준 만족 시 발생
광고 에러	gladsdk.event.ERROR	광고 로드 실패 혹은 실행 에러 시 발생
광고 뮤트 발생	gladsdk.event.AD_MUTE_COMPLETED	광고 뮤트 사유 클릭 시 발생

위험

광고 에러 이벤트가 발생했을 때 광고 슬롯이 삭제되지 않아야 합니다.

SDK는 렌더링에 실패한 광고에 대해서도 유효노출을 체크하기 때문에 adSlotElement.remove() 등의 호출로 광고 영역이 삭제되지 않아야 하고 display: none이 적용되지 않아야 합니다.

window.gladsdk = window.gladsdk || { cmd: [] };

window.gladsdk.cmd.push(function () {
  // 광고 로드
  window.gladsdk.addEventListener(window.gladsdk.event.AD_LOADED, function (ad) {
    console.debug(window.gladsdk.event.AD_LOADED);

    var adSlot = ad.slot;
    var adUnitId = adSlot.getAdUnitId();
    var adSlotElementId = adSlot.getAdSlotElementId();
  });

  // 광고 클릭
  window.gladsdk.addEventListener(window.gladsdk.event.AD_CLICKED, function (ad) {
    console.debug(window.gladsdk.event.AD_CLICKED);
  });

  // 광고 Viewable
  window.gladsdk.addEventListener(window.gladsdk.event.AD_IMPRESSED, function (ad) {
    console.debug(window.gladsdk.event.AD_IMPRESSED);
  });

  // 광고 에러
  window.gladsdk.addEventListener(window.gladsdk.event.ERROR, function (ad, error) {
    console.debug(window.gladsdk.event.ERROR);
  });

  // AD mute 발생
  window.gladsdk.addEventListener(window.gladsdk.event.AD_MUTE_COMPLETED, function (ad) {
    console.debug(window.gladsdk.event.AD_MUTE_COMPLETED);
  });

  var adSlotInfo = {
    adUnitId: 'WEB_nw_banner-N345765840',
    adSlotElementId: 'division',
  };

  var adSlot = window.gladsdk.defineAdSlot(adSlotInfo);
  window.gladsdk.displayAd(adSlot);
});

3. 광고 이벤트 리스너 제거

이벤트 리스너 개별 제거

glad.addEventListener()를 통해 추가했던 리스너를 제거하려면, gladsdk.removeEventListener()를 추가했던 콜백 함수의 레퍼런스와 함께 호출합니다.

var listener = function (ad) {
  console.debug(window.gladsdk.event.AD_CLICKED);
}
window.gladsdk.addEventListener(window.gladsdk.event.AD_CLICKED, listener);
window.gladsdk.removeEventListener(window.gladsdk.event.AD_CLICKED, listener);

이벤트 리스너 일괄 제거

gladsdk.removeAllEventListener()를 이용하여 모든 이벤트리스너를 제거할 수 있습니다.

window.gladsdk.removeAllEventListener();