postMessage 와일드카드 (origin) 사용

postMessage Wildcard Target Origin ('*')

설명

window.postMessage 사용 시 두 번째 인자(targetOrigin)에 '*'를 지정하면, 메시지가 어떤 출처(origin)로 로드되어 있든 대상 창/iframe으로 전송됩니다. 대상 창이 악성 사이트로 바뀌었거나 공격자가 임의의 페이지에서 해당 창을 제어하고 있는 경우, 전송한 데이터가 제3자에게 그대로 노출됩니다. 공격자는 피해 페이지를 iframe으로 삽입하거나, window.open으로 열린 창의 위치를 자신의 도메인으로 변경한 뒤 postMessage로 전달되는 토큰, 사용자 정보 등을 가로채 악용할 수 있습니다.

잠재적 영향

• 민감정보 유출: '*'로 전송된 메시지를 악성 출처가 수신해 토큰, 세션 정보, 개인정보 등이 외부로 노출될 수 있습니다.

• 계정 탈취/권한 남용: 인증 토큰이나 OAuth code 유출 시 공격자가 사용자로 가장하거나 API 권한을 남용할 수 있습니다.

• 비즈니스 로직 악용: 신뢰된 창에만 전달해야 하는 명령/데이터가 제3자에게 전달되어 결제, 설정 변경 등 중요 기능이 오동작할 수 있습니다.

해결 방법

• targetOrigin에 '*'을 사용하지 말고 정확한 origin(스킴+호스트+포트)을 명시하세요. 예: 'https://example.com'.

• 대상이 여러 개인 경우 허용 목록(allowlist)을 두고, 입력된 origin이 목록에 포함될 때만 해당 origin으로 전송하세요. 기본값은 전송하지 않도록 합니다.

• 수신 측에서도 반드시 검증하세요: event.origin이 기대한 값인지 확인하고, event.source가 신뢰된 창인지 확인하며, 메시지 스키마(타입, 필드)도 검증합니다.

• 민감한 데이터는 가급적 postMessage로 보내지 마세요. 불가피하다면 최소한의 데이터만 보내고, 암호화/서명, 일회성 토큰 등 추가 보호를 적용하세요.

• iframe의 src를 고정하고 필요 시 sandbox, rel="noopener"(window.open 사용 시) 등으로 교차 창 제어 위험을 줄이세요.

취약한 코드 및 안전한 코드 예시

취약한 코드

// sender (부모 페이지)
const iframe = document.getElementById("payFrame");
// 로컬에 저장된 인증 토큰을 그대로 전송 (민감정보)
const token = localStorage.getItem("auth_jwt");

// 취약: targetOrigin을 '*'로 사용 => 어떤 출처로 로드되었든 모두 수신 가능
iframe.contentWindow.postMessage({ type: "AUTH", token }, "*");

안전한 코드

// sender (부모 페이지)
const iframe = document.getElementById("payFrame");
// iframe의 실제 목적지 origin을 코드로 계산하거나 상수로 고정
const TARGET_ORIGIN = new URL(iframe.src).origin; // 예: https://pay.example.com

// 민감정보는 보내지 않거나, 최소화/대체(예: 일회성 code)하여 전송
const message = { type: "REQUEST_PAYMENT", orderId: "ORD-2025-0912-001" };
iframe.contentWindow.postMessage(message, TARGET_ORIGIN);

// receiver (자식 iframe 페이지)
window.addEventListener("message", (event) => {
  // 수신 측 검증: 기대하는 부모 origin만 허용
  if (event.origin !== "https://app.example.com") return;
  // 메시지 형태/타입 검증
  if (!event.data || event.data.type !== "REQUEST_PAYMENT") return;

  // 안전한 처리 로직
  processPayment(event.data.orderId);
});

설명:

• 취약한 코드: '*'를 targetOrigin으로 사용하면 대상 창의 실제 출처가 무엇이든 메시지를 수신합니다. 공격자가 대상 iframe을 자신의 도메인으로 로드하게 만들면, AUTH 토큰 같은 민감정보가 그대로 유출되어 계정 탈취로 이어질 수 있습니다.

• 안전한 코드: 정확한 targetOrigin을 명시해 특정 출처에게만 메시지를 전송하고, 수신 측에서도 event.origin과 메시지 스키마를 검증합니다. 또한 민감정보 전송을 피하거나 최소화하여, 출처 변조나 오인식이 발생해도 피해 범위를 줄입니다.

참조

• CWE-201