중간 iframe 지원 JavaScript API 참조

이 참조 페이지에서는 원탭에서 후속 UX의 중간 iframe을 조작하는 데 사용하는 중간 iframe 지원 JavaScript API를 설명합니다.

중간 iframe을 사용하는 방법은 Iframe을 사용하여 원탭 통합 가이드를 참고하세요.

다음 표에는 사용 가능한 모든 메서드와 그 동작이 나와 있습니다.

메서드
verifyParentOrigin 부모 출처 확인을 수행합니다.
notifyParentClose 원탭 UX 흐름을 건너뛰었다고 상위 프레임에 알림
notifyParentDone 상위 프레임에 원탭 UX 흐름이 완료되었음을 알립니다.
notifyParentResize 상위 프레임에 중간 iframe의 크기를 조절하도록 알림
notifyParentTapOutsideMode 사용자가 중간 iframe 외부를 클릭할 때 중간 iframe을 취소할지 여부를 상위 프레임에 알립니다.

중간 iframe 지원 JavaScript 라이브러리 로드

중간 iframe을 로드하려는 HTML 페이지에 다음 코드 스니펫을 배치합니다.

<script src="https://accounts.google.com/gsi/intermediatesupport"></script>

메서드: google.accounts.id.intermediate.verifyParentOrigin

google.accounts.id.intermediate.verifyParentOrigin 메서드는 상위 출처 확인을 수행합니다. 메서드의 다음 코드 예를 참조하세요.

google.accounts.id.intermediate.verifyParentOrigin(
    origins, verifiedCallback, verificationFailedCallback)

다음 코드 예는 상위 출처가 확인된 후에만 UI를 표시하는 방법을 보여줍니다.

<script>
  window.onload = () => {
    google.accounts.id.intermediate.verifyParentOrigin(
        "https://example.com", showUI, showError);
  };
</script>

다음 표에는 매개변수가 나와 있습니다.

매개변수
origins 중간 iframe을 삽입할 수 있는 출처입니다.
verifiedCallback 현재 상위 출처가 중간 iframe을 삽입할 수 있을 때 트리거되는 자바스크립트 콜백 메서드입니다.
verificationFailedCallback 현재 상위 출처가 중간 iframe을 삽입할 수 없는 경우 트리거되는 JavaScript 콜백 메서드입니다.

origins

중간 iframe을 삽입할 수 있는 출처입니다. 자세한 내용은 다음 표를 참조하세요.

유형 필수 예
문자열, 문자열 배열 또는 함수 선택사항 allowed_parent_origin: "https://example.com"

다음 표에는 지원되는 값 유형과 설명이 나와 있습니다.

값 유형
string 단일 도메인 URI입니다. "https://example.com"
string array 도메인 URI 배열입니다. "https://news.example.com,https://local.example.com"

verifiedCallback

이 필드는 현재 상위 출처가 중간 iframe을 삽입할 수 있을 때 트리거되는 JavaScript 콜백 메서드입니다.

verificationFailedCallback

이 필드는 현재 상위 출처에서 중간 iframe을 삽입할 수 없을 때 트리거되는 JavaScript 콜백 메서드입니다.

메서드: google.accounts.id.intermediate.notifyParentClose

google.accounts.id.intermediate.notifyParentClose 메서드는 원탭 UX 흐름을 건너뛸 때 상위 프레임에 중간 iframe을 닫도록 알립니다. 메서드의 다음 코드 예를 참조하세요.

google.accounts.id.intermediate.notifyParentClose()

메서드: google.accounts.id.intermediate.notifyParentDone

google.accounts.id.intermediate.notifyParentDone 메서드는 상위 프레임에 중간 iframe을 닫고 로그인 상태를 새로고침하도록 알립니다. 메서드의 다음 코드 예를 참조하세요.

google.accounts.id.intermediate.notifyParentDone()

메서드: google.accounts.id.intermediate.notifyParentResize

google.accounts.id.intermediate.notifyParentResize 메서드는 상위 프레임에 중간 iframe의 크기를 조절하도록 알립니다. 메서드의 다음 코드 예를 참조하세요.

google.accounts.id.intermediate.notifyParentResize(height)

높이

새 높이(픽셀)입니다. 필수 입력란입니다. 값은 음수가 아닌 숫자여야 합니다.

height 매개변수가 0보다 크면 중간 iframe이 새 높이로 설정됩니다. 높이 매개변수가 0이면 중간 iframe이 표시되지 않습니다. 숨겨진 iframe은 닫히지 않습니다. 나중에 다른 크기 조절 메서드 호출을 통해 표시할 수 있습니다.

메서드: google.accounts.id.intermediate.notifyParentTapOutsideMode

google.accounts.id.intermediate.notifyParentTapOutsideMode 메서드는 사용자가 중간 iframe 외부를 클릭할 때 중간 iframe을 취소할지 여부를 상위 프레임에 알립니다. 메서드의 다음 코드 예를 참조하세요.

google.accounts.id.intermediate.notifyParentTapOutsideMode(cancel)

취소

이 필수 불리언 값은 사용자가 중간 iframe 외부를 클릭할 때 중간 iframe을 취소할지 여부를 나타냅니다.