showFullScreenAd

기능 설명

loadFullScreenAd로 미리 불러온 통합 전면 광고를 사용자에게 노출해요. loadFullScreenAd에서 사용한 것과 같은 adGroupId를 전달해야 해요. 이미 표시한 광고는 다시 표시할 수 없으므로, 광고가 닫힌 뒤에는 새로 로드해야 해요.

토스앱 5.227.0 이상에서 사용할 수 있어요 (5.239.0 이상은 Toss Ad + AdMob 통합, 그 미만은 AdMob 전용). 호출 전에 showFullScreenAd.isSupported()로 지원 여부를 확인할 수 있어요.

타입

showFullScreenAd(params: ShowFullScreenAdParams): () => void;

Params

type ShowFullScreenAdParams = {
  options: ShowFullScreenAdOptions;
  onEvent: (event: ShowFullScreenAdEvent) => void;
  onError: (error: unknown) => void;
};

type ShowFullScreenAdOptions = {
  /** loadFullScreenAd에서 사용한 것과 같은 광고 그룹 ID예요. */
  adGroupId: string;
};

type ShowFullScreenAdEvent =
  | { type: "requested" }
  | { type: "show" }
  | { type: "impression" }
  | { type: "clicked" }
  | { type: "dismissed" }
  | { type: "failedToShow" }
  | {
      type: "userEarnedReward";
      data: { unitType: string; unitAmount: number };
    };

이벤트 type 값:

type	설명
requested	광고 표시 요청이 성공했어요
show	광고가 화면에 표시됐어요
impression	광고 노출이 기록됐어요 (수익 발생 시점)
clicked	사용자가 광고를 클릭했어요
dismissed	사용자가 광고를 닫았어요
failedToShow	광고 표시에 실패했어요
userEarnedReward	사용자가 리워드를 획득했어요 (리워드 광고 전용)

Response

앱브릿지 콜백을 해제하는 함수(() => void)를 반환해요.

에러

광고 표시에 실패하면 failedToShow 이벤트 또는 onError 콜백으로 전달돼요. 리워드 광고는 userEarnedReward 이벤트가 발생했을 때만 리워드를 지급해야 해요.

예시 코드

import {
  loadFullScreenAd,
  showFullScreenAd,
} from "@apps-in-toss/web-framework";

const AD_GROUP_ID = "AD_GROUP_ID";
const button = document.querySelector("#show-full-screen-ad");

button.addEventListener("click", () => {
  const cleanup = showFullScreenAd({
    options: { adGroupId: AD_GROUP_ID },
    onEvent: (event) => {
      switch (event.type) {
        case "impression":
          console.log("광고 노출 기록됨 (수익 발생)");
          break;
        case "userEarnedReward":
          console.log(
            "리워드 획득:",
            event.data.unitType,
            event.data.unitAmount,
          );
          break;
        case "dismissed":
          console.log("광고가 닫혔어요. 다음 광고를 새로 로드하세요.");
          cleanup();
          break;
        case "failedToShow":
          console.error("광고 표시에 실패했어요.");
          cleanup();
          break;
      }
    },
    onError: (error) => {
      console.error(error);
      cleanup();
    },
  });
});