WordPress에서 방문자 IP별 지역 콘텐츠 표시하기

저자:Lisa Farrell·2026-06-01

WordPress 사이트에서는 글, 상품 페이지, 랜딩 페이지에서 방문자 지역에 따라 다른 콘텐츠를 보여줘야 할 때가 많습니다. Shortcode로 기본 콘텐츠를 출력하고 브라우저에서 https://my.ipin.io/info 를 호출합니다.

설계 목표

“WordPress에서 방문자 IP별 지역 콘텐츠 표시하기”에서는 IP 요청이 끝나기 전에도 페이지가 유용해야 합니다. 위치 결과는 보조 정보로 검증한 뒤 한정된 판단에만 사용하고, 필드가 불완전하면 적용하지 않습니다.

요청 및 판단 흐름

WordPress에서 방문자 IP별 지역 콘텐츠 표시하기: 아래 흐름은 이 구현에 맞춘 것으로, 일반적인 IP 조회 체크리스트를 재사용한 것이 아닙니다.

  1. 단계 1 — 기본 상태: shortcode fallback HTML
  2. 단계 2 — 요청: wp_unique_id + static guard
  3. 단계 3 — 검증: 2.5s timeout
  4. 단계 4 — 판단: sessionStorage
  5. 단계 5 — 폴백: ipin:geo-content

운영 환경을 고려한 예제

WordPress에서 방문자 IP별 지역 콘텐츠 표시하기: 예제에는 타임아웃, 응답 검증, 결정적인 기본값, 프레임워크별 생명주기 처리가 포함됩니다.

<?php
function ipin_geo_content_shortcode(): string {
    $id = wp_unique_id('ipin-geo-');
    $default = 'Support is available through our global help center.';
    return sprintf(
        '<aside id="%s" class="ipin-geo-note" data-default="%s">%s</aside>',
        esc_attr($id), esc_attr($default), esc_html($default)
    );
}
add_shortcode('geo_content', 'ipin_geo_content_shortcode');

function ipin_geo_content_assets(): void {
    wp_register_script('ipin-geo-content', '', [], null, true);
    wp_enqueue_script('ipin-geo-content');
    wp_add_inline_script('ipin-geo-content', <<<'JS'
(() => {
  if (window.__ipinGeoContentLoaded) return;
  window.__ipinGeoContentLoaded = true;
  const copy = {
    JP: 'Japan support: weekdays 09:00–18:00 JST.',
    DE: 'EU support: weekdays 09:00–17:00 CET.',
    US: 'US support: weekdays 09:00–17:00 ET.'
  };
  async function country() {
    const cached = sessionStorage.getItem('ipin_country');
    if (/^[A-Z]{2}$/.test(cached || '')) return cached;
    const controller = new AbortController();
    const timer = setTimeout(() => controller.abort(), 2500);
    try {
      const response = await fetch('https://my.ipin.io/info', {
        headers: {Accept: 'application/json'}, signal: controller.signal
      });
      if (!response.ok) throw new Error(`HTTP ${response.status}`);
      const data = await response.json();
      const value = String(data.country || '').toUpperCase();
      if (!/^[A-Z]{2}$/.test(value)) throw new Error('invalid country');
      sessionStorage.setItem('ipin_country', value);
      return value;
    } finally { clearTimeout(timer); }
  }
  country().then(value => {
    document.querySelectorAll('.ipin-geo-note').forEach(el => {
      el.textContent = copy[value] || el.dataset.default;
      el.dispatchEvent(new CustomEvent('ipin:geo-content', {
        bubbles: true, detail: {state: copy[value] ? 'resolved' : 'fallback'}
      }));
    });
  }).catch(() => {});
})();
JS);
}
add_action('wp_enqueue_scripts', 'ipin_geo_content_assets');

테스트 매트릭스

“WordPress에서 방문자 IP별 지역 콘텐츠 표시하기”을 게시하기 전에 모의 응답이나 제어 가능한 VPN 출구로 다음 항목을 확인합니다.

조건입력 / 설정예상 결과
T1[geo_content] × 22 unique DOM id; fetch × 1
T2CSP blockdefault HTML
T3latency > 2500 msAbortController; fallback
T4sessionStorage=JPfetch × 0

자동화 / 스모크 테스트

// Browser console smoke test after inserting [geo_content] twice:
const boxes = [...document.querySelectorAll('.ipin-geo-note')];
console.assert(boxes.length === 2);
console.assert(new Set(boxes.map(x => x.id)).size === 2);

장애 처리

WordPress에서 방문자 IP별 지역 콘텐츠 표시하기: 오류는 로그나 개발자 도구에서 확인할 수 있어야 하지만 빈 모듈이나 깨진 결제 화면을 방문자에게 보여서는 안 됩니다.

장애원인대응
CORSOrigin headerdefault HTML
script merged × 2cache pluginglobal loaded flag
country invalidschemaignore value
consent=falseanalytics eventUI state only

실제 적용 사례

“WordPress에서 방문자 IP별 지역 콘텐츠 표시하기”의 현실적인 적용 사례: 문서 사이트가 shortcode로 지역별 지원 시간을 표시하면서 모든 방문자에게 동일한 완전한 검색 가능 도움말 본문을 유지합니다.

운영 시 주의사항

WordPress에서 방문자 IP별 지역 콘텐츠 표시하기: 기본 HTML을 완전하게 유지하십시오. IP 위치는 신원 증명이 아니며 브라우저의 위치 결과를 권한 제어에 사용하면 안 됩니다.

정리

“WordPress에서 방문자 IP별 지역 콘텐츠 표시하기”은 이제 공통 템플릿이 아니라 고유한 구현 경로, 테스트 근거, 폴백 동작을 갖습니다.