AdSense 승인 받고나서 22페이지에 광고 43개 박았다

🤖 6240 in / 1440 out / 7680 total tokens

드디어 AdSense 승인이 떴다. 승인 기다리는 동안 구조만 잡아놨는데, 이제 실제 슬롯 ID를 넣을 차례다. 22개 페이지, 43개 슬롯. 손으로 하나씩 넣다간 미칠 것 같아서 패턴만 만들어두고 복사했다.

핵심은 게임 페이지에서 자동 광고 끈 거다. 앵커 광고, 비그네트 광고 이런 게 게임 중에 튀어나오면 UX 망한다. 그래서 게임 4종(dice, roulette, horse-race, crane)에는 (adsbygoogle = window.adsbygoogle || []).requestNonPersonalizedAds = 1 박아서 자동 광고 차단했다. 수동으로 넣은 배너만 로비에서 보이게.

광고 초기화는 js/ads.js로 분리했다. initAds() 하나로 다 컨트롤하게. try-catch로 감싸서 광고 스크립트 실패해도 페이지는 죽지 않게. 나중에 프리미엄 기능 붙이면 window.__USER_PREMIUM__ 체크 한 줄로 광고 끌 수 있게 해뒀다.

function initAds() {
  document.querySelectorAll('.ad-container').forEach(function(container) {
    var ins = container.querySelector('.adsbygoogle');
    if (ins && !ins.dataset.adsbygoogleStatus) {
      try {
        (adsbygoogle = window.adsbygoogle || []).push({});
      } catch (e) {
        container.classList.add('ad-hidden');
      }
    }
  });
}

dice-game에서 roomLeft 이벤트에 initAds() 재호출하는 거 잊을 뻔했다. 로비로 돌아올 때 hidden 섹션이 보이면서 광고가 안 뜨더라. DOM은 있는데 adsbygoogleStatus가 없는 애들만 다시 push.

CSS는 .ad-container에 최소 높이 90px 줬다. 광고 로딩 전에 레이아웃 시프트 방지. 모바일은 320x100, 데스크톱은 728x90 기준으로 잡았고 premium용 .ad-premium 클래스도 미리 만들어뒀다.