원하는 경우 JavaScript 코드만 사용하여 원탭 메시지를 트리거하거나 'Google 계정으로 로그인' 버튼을 렌더링할 수 있습니다.
JavaScript에서 원탭 메시지를 구성하려면 먼저 initialize() 메서드를 호출해야 합니다. 그런 다음 prompt() 메서드를 호출하여 프롬프트 UI를 표시합니다. 다음 코드 스니펫을 참고하세요.
<script>
window.onload = function () {
google.accounts.id.initialize({
client_id: 'YOUR_GOOGLE_CLIENT_ID',
callback: handleCredentialResponse
});
google.accounts.id.prompt();
}
</script>
프롬프트 UI 상태 알림을 수신하려면 prompt() 메서드에 콜백 함수를 제공합니다. 다음 코드 스니펫을 참고하세요.
<script>
window.onload = function () {
google.accounts.id.initialize({
client_id: 'YOUR_GOOGLE_CLIENT_ID',
callback: handleCredentialResponse
});
google.accounts.id.prompt((notification) => {
if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
// try next provider if OneTap is not displayed or skipped
}
});
}
</script>
아래의 코드 예는 JavaScript에서 원탭 및 Google 계정으로 로그인 버튼을 모두 렌더링하는 방법을 보여줍니다.
<script>
window.onload = function () {
google.accounts.id.initialize({
client_id: 'YOUR_GOOGLE_CLIENT_ID',
callback: handleCredentialResponse
});
const parent = document.getElementById('google_btn');
google.accounts.id.renderButton(parent, {theme: "filled_blue"});
google.accounts.id.prompt();
}
</script>