인앱광고..어떻게하는거죠?ㅠㅠㅠ

이 글의 성격은 무엇인가요?

질문 / 문제 해결

내용을 설명해주세요

저는 비개발자인데 클로드코드만으로 웹뷰 앱을 만들어서 앱인토스 배포했는데 광고가 안 나옵니다 ㅠㅠ

웹뷰로 앱을 만들어서 npx ait build로 빌드했습니다

배포 완료했고,
광고 그룹도 콘솔에서 활성화했습니다

앱을 열면 광고 자리가 그냥 비어있습니다
콘솔 창을 열어보니 “TossAds SDK not available” 이라는 메시지가 나옵니다

콘솔의 수익 현황을 봐도 광고 노출수가 0입니다

뭘 해야 하나요 ㅜㅜㅜ

개발자가 아니라 뭐가 문제인지 정말 모르겠습니다
혹시 간단한 해결 방법이 있을까요?

아무리 찾아봐도 같은 문제를 겪은 사람이 없어서 올립니다

도움 부탁드립니다 :folded_hands:

안녕하세요 :slight_smile:
클로드 코드에 광고 코드를 발췌 요청하셔서 여기 올려주실 수 있을까요 ?
혹은 아래 예제 클로드에 주시면 도움이 될 것 같아요. (아래 코드에서 adGroupId는 사용하시는 id로 변경해주셔야 해요)

import { loadFullScreenAd, showFullScreenAd } from '@apps-in-toss/web-framework';
import { useState, useEffect } from 'react';

function AdComponent() {
  const AD_GROUP_ID = 'ait.dev.43daa14da3ae487b';
  const [isAdLoaded, setIsAdLoaded] = useState(false);

  useEffect(() => {
    // 컴포넌트 마운트 시 광고 로드
    const unregister = loadFullScreenAd({
      options: { adGroupId: AD_GROUP_ID },
      onEvent: (event) => {
        if (event.type === 'loaded') {
          setIsAdLoaded(true);
        }
      },
      onError: (error) => {
        console.error('광고 로드 실패:', error);
      },
    });

    return () => unregister();
  }, []);

  const handleShowAd = () => {
    showFullScreenAd({
      options: { adGroupId: AD_GROUP_ID },
      onEvent: (event) => {
        switch (event.type) {
          case 'requested':
            console.log('광고 표시 요청됨');
            break;
          case 'show':
            console.log('광고 화면 표시됨');
            break;
          case 'impression':
            console.log('광고 노출 기록됨 (수익 발생)');
            break;
          case 'clicked':
            console.log('광고 클릭됨');
            break;
          case 'dismissed':
            console.log('광고가 닫힘');
            setIsAdLoaded(false);
            // 다음 광고 로드
            loadNextAd();
            break;
          case 'failedToShow':
            console.error('광고 표시 실패');
            break;
          case 'userEarnedReward':
            console.log('리워드 획득:', event.data);
            // 사용자에게 리워드 지급
            grantReward(event.data.unitType, event.data.unitAmount);
            break;
        }
      },
      onError: (error) => {
        console.error('광고 표시 실패:', error);
      },
    });
  };

  const loadNextAd = () => {
    loadFullScreenAd({
      options: { adGroupId: AD_GROUP_ID },
      onEvent: (event) => {
        if (event.type === 'loaded') setIsAdLoaded(true);
      },
      onError: console.error,
    });
  };

  const grantReward = (unitType: string, unitAmount: number) => {
    // 리워드 지급 로직
    console.log(`${unitType} ${unitAmount}개 지급`);
  };

  return (
    <button onClick={handleShowAd} disabled={!isAdLoaded}>
      광고 보기
    </button>
  );
}

저는 웹뷰이고 배너형 광고긴한데,
이렇게 만들었습니다 ㅠㅠ

<!-- 🎯 TossAds 배너 광고 (가이드 기준) -->

<script>

// TossAds SDK 초기화 (필수!)

function initializeTossAds() {

if (!window.TossAds) {

return;

}

// 현재 환경에서 배너 광고 사용 가능한지 확인

if (!TossAds.initialize.isSupported()) {

return;

}

// SDK 초기화

TossAds.initialize({

callbacks: {

onInitialized: () => {

// 초기화 완료 후 광고 부착

attachBannerAd();

},

onInitializationFailed: (error) => {

// 초기화 실패 (샌드박스 환경에서는 정상)

},

},

});

}

// 배너 광고 부착

function attachBannerAd() {

if (!window.TossAds) {

return;

}

const adContainer = document.getElementById('ad-banner-container');

if (!adContainer) {

return;

}

// 실제 광고 ID

const adGroupId = '**';

try {

TossAds.attachBanner(adGroupId, adContainer, {

theme: 'auto',

tone: 'blackAndWhite',

variant: 'expanded',

callbacks: {

onAdRendered: (payload) => {

adContainer.classList.add('show');

},

onAdViewable: (payload) => {

// 광고 노출됨

},

onAdImpression: (payload) => {

// 광고 노출 기록됨 (수익 발생 시점)

},

onAdClicked: (payload) => {

// 사용자 클릭

},

onNoFill: (payload) => {

adContainer.classList.remove('show');

},

onAdFailedToRender: (payload) => {

adContainer.classList.remove('show');

},

},

});

} catch (error) {

// 오류 무시 (샌드박스 환경에서는 정상)

}

}

adGroupId 에 실제 광고 ID를 넣어주셨나요 ?
이 부분입니다!
const adGroupId = ''

그것과 별개로 destroy() 호출이 누락되었네요.

관련 가이드를 전달드립니다!

실제 광고 ID를 넣었고, destory를 넣어도 광고가 안나타나네요 ㅠㅠ

비개발자다보니 너무 어렵네요

약간 1호로 첫 앱을 만들어본거라서 소스 전체를 드려서라도 정확히 만들어보고싶지만..ㅠㅠ

AI 에게 여쭤보세요 .