react-native-google-signin.github.io/docs/one-tap.html at gh-pages · react-native-google-signin/react-native-google-signin.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!doctype html><html lang=en dir=ltr class="docs-wrapper plugin-docs plugin-id-default docs-version-current docs-doc-page docs-doc-id-one-tap" data-has-hydrated=false><head><meta charset=UTF-8><meta name=generator content="Docusaurus v3.10.1"><title data-rh=true>Universal sign in | React Native Google Sign In</title><meta data-rh=true name=viewport content="width=device-width, initial-scale=1.0"/><meta data-rh=true name=twitter:card content=summary_large_image /><meta data-rh=true property=og:image content=https://react-native-google-signin.github.io/img/social-card.jpg /><meta data-rh=true name=twitter:image content=https://react-native-google-signin.github.io/img/social-card.jpg /><meta data-rh=true property=og:url content=https://react-native-google-signin.github.io/docs/one-tap /><meta data-rh=true property=og:locale content=en /><meta data-rh=true name=docusaurus_locale content=en /><meta data-rh=true name=docsearch:language content=en /><meta data-rh=true name=docusaurus_version content=current /><meta data-rh=true name=docusaurus_tag content=docs-default-current /><meta data-rh=true name=docsearch:version content=current /><meta data-rh=true name=docsearch:docusaurus_tag content=docs-default-current /><meta data-rh=true property=og:title content="Universal sign in | React Native Google Sign In"/><meta data-rh=true name=description content="Google's recommended Sign-In API for Android (Credential Manager), iOS/macOS (Google Sign-In SDK), and web. Covers `configure()`, sign-in flows, user data access, and token handling."/><meta data-rh=true property=og:description content="Google's recommended Sign-In API for Android (Credential Manager), iOS/macOS (Google Sign-In SDK), and web. Covers `configure()`, sign-in flows, user data access, and token handling."/><link data-rh=true rel=icon href=/img/favicon.ico /><link data-rh=true rel=canonical href=https://react-native-google-signin.github.io/docs/one-tap /><link data-rh=true rel=alternate href=https://react-native-google-signin.github.io/docs/one-tap hreflang=en /><link data-rh=true rel=alternate href=https://react-native-google-signin.github.io/docs/one-tap hreflang=x-default /><script data-rh=true type=application/ld+json>{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","item":"https://react-native-google-signin.github.io/docs/one-tap","name":"Universal Google sign in","position":1}]}</script><link rel=stylesheet href=/assets/css/styles.c655e8c7.css /><script src=/assets/js/runtime~main.27c8b818.js defer></script><script src=/assets/js/main.1cb569e4.js defer></script></head><body><svg style="display: none;"><defs>
<symbol id=theme-svg-external-link viewBox="0 0 24 24"><path fill=currentColor d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"/></symbol>
</defs></svg>
<script>!function(){var t=function(){try{return new URLSearchParams(window.location.search).get("docusaurus-theme")}catch(t){}}()||function(){try{return window.localStorage.getItem("theme-32e")}catch(t){}}();document.documentElement.setAttribute("data-theme",t||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")),document.documentElement.setAttribute("data-theme-choice",t||"system")}(),function(){try{for(var[t,e]of new URLSearchParams(window.location.search).entries())if(t.startsWith("docusaurus-data-")){var a=t.replace("docusaurus-data-","data-");document.documentElement.setAttribute(a,e)}}catch(t){}}()</script><div id=__docusaurus><link rel=preload as=image href=/img/logo.png /><link rel=preload as=image href=/img/onetap/signing-in-android.png /><link rel=preload as=image href=/img/onetap/sign-in-web.png /><link rel=preload as=image href=/img/onetap/signing-in-web.png /><link rel=preload as=image href=/img/onetap/signing-up-android.png /><link rel=preload as=image href=/img/onetap/signing-up-ios.png /><link rel=preload as=image href=/img/onetap/signing-up-web.png /><link rel=preload as=image href=/img/onetap/explicit-android.png /><link rel=preload as=image href=/img/onetap/authorize-android.jpg /><link rel=preload as=image href=/img/onetap/add-scopes-ios.png /><div role=region aria-label="Skip to main content"><a class=skipToContent_fXgn href=#__docusaurus_skipToContent_fallback>Skip to main content</a></div><nav aria-label=Main class="theme-layout-navbar navbar navbar--fixed-top"><div class=navbar__inner><div class="theme-layout-navbar-left navbar__items"><button aria-label="Toggle navigation bar" aria-expanded=false class="navbar__toggle clean-btn" type=button><svg width=30 height=30 viewBox="0 0 30 30" aria-hidden=true><path stroke=currentColor stroke-linecap=round stroke-miterlimit=10 stroke-width=2 d="M4 7h22M4 15h22M4 23h22"/></svg></button><a class=navbar__brand href=/><div class=navbar__logo><img src=/img/logo.png alt="My Site Logo" class="themedComponent_mlkZ themedComponent--light_NVdE"/><img src=/img/logo.png alt="My Site Logo" class="themedComponent_mlkZ themedComponent--dark_xIcU"/></div><b class="navbar__title text--truncate">RN Google Sign In</b></a><a aria-current=page class="navbar__item navbar__link navbar__link--active" href=/docs/install>Guides</a><a class="navbar__item navbar__link" href=/docs/api>API</a><a class="navbar__item navbar__link" href=/examples>Example native & web app</a><div class="navbar__item dropdown dropdown--hoverable"><a href=# aria-haspopup=true aria-expanded=false role=button class=navbar__link>LLMs</a><ul class=dropdown__menu><li><a href=/llms.txt target=_blank rel="noopener noreferrer" class=dropdown__link>llms.txt<svg width=12 height=12 aria-label="(opens in new tab)" class=iconExternalLink_nPIU><use href=#theme-svg-external-link /></svg></a><li><a href=/llms-full.txt target=_blank rel="noopener noreferrer" class=dropdown__link>llms-full.txt<svg width=12 height=12 aria-label="(opens in new tab)" class=iconExternalLink_nPIU><use href=#theme-svg-external-link /></svg></a></ul></div></div><div class="theme-layout-navbar-right navbar__items navbar__items--right"><a class="navbar__item navbar__link" href=/github-repo>GitHub</a><div class="toggle_vylO colorModeToggle_DEke"><button class="clean-btn toggleButton_gllP toggleButtonDisabled_aARS" type=button disabled title="system mode" aria-label="Switch between dark and light mode (currently system mode)"><svg viewBox="0 0 24 24" width=24 height=24 aria-hidden=true class="toggleIcon_g3eP lightToggleIcon_pyhR"><path fill=currentColor d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"/></svg><svg viewBox="0 0 24 24" width=24 height=24 aria-hidden=true class="toggleIcon_g3eP darkToggleIcon_wfgR"><path fill=currentColor d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"/></svg><svg viewBox="0 0 24 24" width=24 height=24 aria-hidden=true class="toggleIcon_g3eP systemToggleIcon_QzmC"><path fill=currentColor d="m12 21c4.971 0 9-4.029 9-9s-4.029-9-9-9-9 4.029-9 9 4.029 9 9 9zm4.95-13.95c1.313 1.313 2.05 3.093 2.05 4.95s-0.738 3.637-2.05 4.95c-1.313 1.313-3.093 2.05-4.95 2.05v-14c1.857 0 3.637 0.737 4.95 2.05z"/></svg></button></div><div class=navbarSearchContainer_Bca1><div class=navbar__search><span aria-label="expand searchbar" role=button class=search-icon tabindex=0></span><input id=search_input_react type=search placeholder=Loading... aria-label=Search class="navbar__search-input search-bar" disabled/></div></div></div></div><div role=presentation class=navbar-sidebar__backdrop></div></nav><div id=__docusaurus_skipToContent_fallback class="theme-layout-main main-wrapper mainWrapper_z2l0"><div class=docsWrapper_hBAB><button aria-label="Scroll back to top" class="clean-btn theme-back-to-top-button backToTopButton_sjWU" type=button></button><div class=docRoot_UBD9><aside class="theme-doc-sidebar-container docSidebarContainer_YfHR"><div class=sidebarViewport_aRkj><div class=sidebar_njMd><nav aria-label="Docs sidebar" class="menu thin-scrollbar menu_SIkG"><ul class="theme-doc-sidebar-menu menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/install><span title=Installation class=linkLabel_WmDU>Installation</span></a><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class=menu__list-item-collapsible><a class="categoryLink_byQd menu__link menu__link--sublist" href=/docs/category/setting-up><span title="Setting up" class=categoryLinkLabel_W154>Setting up</span></a><button aria-label="Expand sidebar category 'Setting up'" aria-expanded=false type=button class="clean-btn menu__caret"></button></div><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item sponsor-heart"><a class="menu__link menu__link--active" aria-current=page href=/docs/one-tap><span title="Universal Google sign in" class=linkLabel_WmDU>Universal Google sign in</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/original><span title="Original Google sign in" class=linkLabel_WmDU>Original Google sign in</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item sponsor-heart"><a class=menu__link href=/docs/web-support><span title="Web support" class=linkLabel_WmDU>Web support</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item sponsor-heart"><a class=menu__link href=/docs/security><span title="Advanced security" class=linkLabel_WmDU>Advanced security</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/migrating><span title="Migration guides" class=linkLabel_WmDU>Migration guides</span></a><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class=menu__list-item-collapsible><a class="categoryLink_byQd menu__link menu__link--sublist" href=/docs/category/react-components><span title="React components" class=categoryLinkLabel_W154>React components</span></a><button aria-label="Expand sidebar category 'React components'" aria-expanded=false type=button class="clean-btn menu__caret"></button></div><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/testing><span title=Testing class=linkLabel_WmDU>Testing</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/errors><span title="Error handling" class=linkLabel_WmDU>Error handling</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/integration-notes><span title="Integration notes" class=linkLabel_WmDU>Integration notes</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/troubleshooting><span title=Troubleshooting class=linkLabel_WmDU>Troubleshooting</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item sponsor-heart"><a class=menu__link href=/docs/config-doctor><span title="Config doctor" class=linkLabel_WmDU>Config doctor</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/screenshots><span title=Screenshots class=linkLabel_WmDU>Screenshots</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/license><span title=License class=linkLabel_WmDU>License</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/other-libs><span title="Other libraries" class=linkLabel_WmDU>Other libraries</span></a><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class=menu__link href=/docs/api><span title="API reference" class=linkLabel_WmDU>API reference</span></a></ul></nav></div></div></aside><main class=docMainContainer_TBSr><div class="container padding-top--md padding-bottom--lg"><div class=row><div class="col docItemCol_VOVn"><div class=docItemContainer_Djhp><article><div class=breadcrumbsWrapper_xlkt><nav class="theme-doc-breadcrumbs breadcrumbsContainer_Z_bl" aria-label=Breadcrumbs><ul class=breadcrumbs><li class=breadcrumbs__item><a aria-label="Home page" class=breadcrumbs__link href=/><svg viewBox="0 0 24 24" class=breadcrumbHomeIcon_YNFT><path d="M10 19v-5h4v5c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-7h1.7c.46 0 .68-.57.33-.87L12.67 3.6c-.38-.34-.96-.34-1.34 0l-8.36 7.53c-.34.3-.13.87.33.87H5v7c0 .55.45 1 1 1h3c.55 0 1-.45 1-1z" fill=currentColor /></svg></a><li class="breadcrumbs__item breadcrumbs__item--active"><span class=breadcrumbs__link>Universal Google sign in</span></ul></nav></div><div class="tocCollapsible_ETCw theme-doc-toc-mobile tocMobile_ITEo"><button type=button class="clean-btn tocCollapsibleButton_TO0P">On this page</button></div><div class="theme-doc-markdown markdown"><header><h1>Universal sign in</h1></header>
<p>This is Google's recommended way to implement Google Sign In. This API is available on Android, iOS, macOS and web (with a little extra work <a href=#web-support class="">described below</a>). It is a replacement for the <a class="" href=/docs/original>Original Google sign in</a>. The module APIs are named <code>GoogleOneTapSignIn</code> for historical reasons.</p>
<!-- -->
<div class="theme-admonition theme-admonition-tip admonition_xJq3 alert alert--success"><div class=admonitionHeading_Gvgb><span class=admonitionIcon_Rf37><svg viewBox="0 0 12 16"><path fill-rule=evenodd d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"/></svg></span>tip</div><div class=admonitionContent_BuS1><p>The functionality covered in this page is available in the licensed
version. <a href=https://universal-sign-in.com/#pricing target=_blank rel="noopener noreferrer" class="">You can get a license here</a> ⭐️.</div></div>
<ul>
<li class="">
<p>On Android, it is built on top of the new <a href=https://developers.google.com/identity/android-credential-manager target=_blank rel="noopener noreferrer" class="">Credential Manager</a> APIs.</p>
</li>
<li class="">
<p>On Apple (iOS and macOS), it is built on top of the <a href=https://developers.google.com/identity/sign-in/ios/start-integrating target=_blank rel="noopener noreferrer" class="">Google Sign In SDK for iOS and macOS</a>.</p>
</li>
<li class="">
<p>On the web, it covers both the <a href=https://developers.google.com/identity/gsi/web/guides/offerings#one_tap target=_blank rel="noopener noreferrer" class="">One-tap</a> flow and the <a href=https://developers.google.com/identity/gsi/web/guides/offerings#sign_in_with_google_button target=_blank rel="noopener noreferrer" class="">Google Sign-In button</a>. <a class="" href=/docs/web-support>Learn more</a>.</p>
</li>
</ul>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id=usage>Usage<a href=#usage class=hash-link aria-label="Direct link to Usage" title="Direct link to Usage" translate=no></a></h2>
<p>You can copy-paste this snippet to get a complete sign-in flow quickly. Read more about the methods below.</p>
<div class="language-tsx codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockTitle_OeMC>example of going through the sign in flow</div><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-tsx codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class="codeBlockLines_e6Vv codeBlockLinesWithNumbering_o6Pm" style="counter-reset:line-count 0"><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token keyword" style=color:#00009f>import</span><span class="token plain"> </span><span class="token imports punctuation" style=color:#393A34>{</span><span class="token imports"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token imports">  </span><span class="token imports maybe-class-name">GoogleOneTapSignIn</span><span class="token imports punctuation" style=color:#393A34>,</span><span class="token imports"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token imports">  </span><span class="token imports maybe-class-name">GoogleLogoButton</span><span class="token imports punctuation" style=color:#393A34>,</span><span class="token imports"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token imports"></span><span class="token imports punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>from</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'@react-native-google-signin/google-signin'</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain" style=display:inline-block></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token tag punctuation" style=color:#393A34>&lt;</span><span class="token tag class-name" style=color:#00009f>GoogleLogoButton</span><span class="token tag" style=color:#00009f> </span><span class="token tag attr-name" style=color:#00a4db>onPress</span><span class="token tag script language-javascript script-punctuation punctuation" style=color:#393A34>=</span><span class="token tag script language-javascript punctuation" style=color:#393A34>{</span><span class="token tag script language-javascript" style=color:#00009f>startSignInFlow</span><span class="token tag script language-javascript punctuation" style=color:#393A34>}</span><span class="token tag" style=color:#00009f> </span><span class="token tag attr-name" style=color:#00a4db>label</span><span class="token tag attr-value punctuation attr-equals" style=color:#393A34>=</span><span class="token tag attr-value punctuation" style=color:#393A34>"</span><span class="token tag attr-value" style=color:#e3116c>Sign in with Google</span><span class="token tag attr-value punctuation" style=color:#393A34>"</span><span class="token tag" style=color:#00009f> </span><span class="token tag punctuation" style=color:#393A34>/></span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain" style=display:inline-block></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token keyword" style=color:#00009f>export</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>const</span><span class="token plain"> </span><span class="token function-variable function" style=color:#d73a49>startSignInFlow</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>=</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>async</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token arrow operator" style=color:#393A34>=></span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  </span><span class="token keyword" style=color:#00009f>try</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token maybe-class-name">GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token method function property-access" style=color:#d73a49>configure</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"> </span><span class="token comment" style=color:#999988;font-style:italic>// move this to after your app starts</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> </span><span class="token maybe-class-name">GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token method function property-access" style=color:#d73a49>checkPlayServices</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>const</span><span class="token plain"> signInResponse </span><span class="token operator" style=color:#393A34>=</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> </span><span class="token maybe-class-name">GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token method function property-access" style=color:#d73a49>signIn</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">signInResponse</span><span class="token punctuation" style=color:#393A34>.</span><span class="token property-access">type</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>===</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'success'</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// use signInResponse.data</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>else</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">signInResponse</span><span class="token punctuation" style=color:#393A34>.</span><span class="token property-access">type</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>===</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'noSavedCredentialFound'</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// the user wasn't previously signed into this app</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token keyword" style=color:#00009f>const</span><span class="token plain"> createResponse </span><span class="token operator" style=color:#393A34>=</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> </span><span class="token maybe-class-name">GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token method function property-access" style=color:#d73a49>createAccount</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">createResponse</span><span class="token punctuation" style=color:#393A34>.</span><span class="token property-access">type</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>===</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'success'</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token comment" style=color:#999988;font-style:italic>// use createResponse.data</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>else</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">createResponse</span><span class="token punctuation" style=color:#393A34>.</span><span class="token property-access">type</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>===</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'noSavedCredentialFound'</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token comment" style=color:#999988;font-style:italic>// no Google user account was present on the device yet (unlikely but possible)</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token keyword" style=color:#00009f>const</span><span class="token plain"> explicitResponse </span><span class="token operator" style=color:#393A34>=</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> </span><span class="token maybe-class-name">GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token method function property-access" style=color:#d73a49>presentExplicitSignIn</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain" style=display:inline-block></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">explicitResponse</span><span class="token punctuation" style=color:#393A34>.</span><span class="token property-access">type</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>===</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'success'</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token comment" style=color:#999988;font-style:italic>// use explicitResponse.data</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token comment" style=color:#999988;font-style:italic>// the else branches correspond to the user canceling the sign in</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>catch</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">error</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token comment" style=color:#999988;font-style:italic>// handle error</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token punctuation" style=color:#393A34>}</span><span class="token punctuation" style=color:#393A34>;</span></span><br/></div></code></pre></div></div>
<p>Note that on Apple and Android, you can combine the Universal sign in methods with those one from the <a class="" href=/docs/original>Original Google Sign In</a>. To do that, use the Universal sign in to sign in the user. Then call <code>signInSilently()</code> and then (for example) <code>getCurrentUser()</code> to get the current user's information. However, this shouldn't be necessary because this module should cover all your needs. Please open an issue if that's not the case.</p>
<hr/>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id=methods>Methods<a href=#methods class=hash-link aria-label="Direct link to Methods" title="Direct link to Methods" translate=no></a></h2>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=configure><code>configure</code><a href=#configure class=hash-link aria-label="Direct link to configure" title="Direct link to configure" translate=no></a></h3>
<p>signature: (<code>params</code>: <a class="" href=/docs/api#onetapconfigureparams><code>OneTapConfigureParams</code></a>) => <code>void</code></p>
<p>It is mandatory to call <code>configure</code> before attempting to call any of the sign-in methods. This method is synchronous, meaning you can call e.g. <code>signIn</code> right after it. Typically, you would call <code>configure</code> only once, soon after your app starts.</p>
<p><code>webClientId</code> is a required parameter. Use <code>"autoDetect"</code> for <a href=#automatic-config class="">automatic webClientId detection</a>.</p>
<p>If you're using neither Expo nor Firebase, you also need to provide the <code>iosClientId</code> parameter. All other parameters are optional.</p>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockTitle_OeMC>Example of calling the configure() method</div><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token plain">GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>configure</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span><br/></div><div class=token-line style=color:#393A34><span class="token plain">  webClientId</span><span class="token operator" style=color:#393A34>:</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'autoDetect'</span><span class="token punctuation" style=color:#393A34>,</span><span class="token plain"></span><br/></div><div class=token-line style=color:#393A34><span class="token plain"></span><span class="token punctuation" style=color:#393A34>}</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><br/></div></code></pre></div></div>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=signin><code>signIn</code><a href=#signin class=hash-link aria-label="Direct link to signin" title="Direct link to signin" translate=no></a></h3>
<p>signature: (<code>params</code>?: <a class="" href=/docs/api#onetapsigninparams><code>OneTapSignInParams</code></a>) => <code>Promise</code>&lt;<a class="" href=/docs/api#onetapresponse><code>OneTapResponse</code></a>></p>
<table><thead><tr><th>Platform<th>Behavior<tbody><tr><td>Android<td>Attempts to sign in user automatically, without interaction. <a href=https://developers.google.com/identity/android-credential-manager/android/reference/kotlin/com/google/android/libraries/identity/googleid/GetGoogleIdOption.Builder#setAutoSelectEnabled(kotlin.Boolean) target=_blank rel="noopener noreferrer" class="">Docs</a>.<tr><td>Apple<td>Attempts to restore a previous user sign-in without interaction. <a href=https://developers.google.com/identity/sign-in/ios/reference/Classes/GIDSignIn#-restoreprevioussigninwithcompletion: target=_blank rel="noopener noreferrer" class="">Docs</a>.<tr><td>Web<td>Attempts to sign in user automatically, without interaction. <a href=https://developers.google.com/identity/gsi/web/reference/js-reference#auto_select target=_blank rel="noopener noreferrer" class="">Docs</a>. If none is found, presents a sign-in UI. <a href=#web-support class="">Read below</a> for web support.</table>
<p>If there is no user that was previously signed in, the returned promise resolves with <a class="" href=/docs/api#nosavedcredentialfound><code>NoSavedCredentialFound</code></a> object. In that case, you can call <a class="" href=/docs/one-tap#createaccount><code>createAccount</code></a> to start a flow to create a new account. You don't need to call <code>signIn</code> as a response to a user action - you can call it when your app starts or when suitable.</p>
<!-- -->
<details class="details_lb9f alert alert--info details_b_Ee" data-collapsed=true><summary>UI screenshots</summary><div><div class=collapsibleContent_i85q><table><thead><tr><th style=text-align:center>Android<th style=text-align:center>iOS<th style=text-align:center>Web<tbody><tr><td style=text-align:center>No UI, no user interaction the first time. If user has signed up previously, they will see this: <br/> <img src=/img/onetap/signing-in-android.png style=max-width:300px /><td style=text-align:center>(no UI, no user interaction)<td style=text-align:center>The prompt presented the first time: <img src=/img/onetap/sign-in-web.png style=max-width:300px /><br/> If user has signed in previously, they will see this: <img src=/img/onetap/signing-in-web.png style=max-width:300px /></table></div></div></details>
<h4 class="anchor anchorTargetStickyNavbar_Vzrq" id=example-code-snippet>Example code snippet<a href=#example-code-snippet class=hash-link aria-label="Direct link to Example code snippet" title="Direct link to Example code snippet" translate=no></a></h4>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockTitle_OeMC>Example of calling the signIn() method</div><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class="codeBlockLines_e6Vv codeBlockLinesWithNumbering_o6Pm" style="counter-reset:line-count 0"><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token keyword" style=color:#00009f>import</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>,</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  statusCodes</span><span class="token punctuation" style=color:#393A34>,</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  isErrorWithCode</span><span class="token punctuation" style=color:#393A34>,</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  isSuccessResponse</span><span class="token punctuation" style=color:#393A34>,</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  isNoSavedCredentialFoundResponse</span><span class="token punctuation" style=color:#393A34>,</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>from</span><span class="token plain"> </span><span class="token string" style=color:#e3116c>'@react-native-google-signin/google-signin'</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain" style=display:inline-block></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token comment" style=color:#999988;font-style:italic>// Somewhere in your code</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token keyword" style=color:#00009f>const</span><span class="token plain"> </span><span class="token function-variable function" style=color:#d73a49>signIn</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>=</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>async</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token operator" style=color:#393A34>=></span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  </span><span class="token keyword" style=color:#00009f>try</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>checkPlayServices</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>const</span><span class="token plain"> response </span><span class="token operator" style=color:#393A34>=</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>signIn</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain" style=display:inline-block></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token function" style=color:#d73a49>isSuccessResponse</span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">response</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// read user's info</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token builtin">console</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>log</span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">response</span><span class="token punctuation" style=color:#393A34>.</span><span class="token plain">data</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>else</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token function" style=color:#d73a49>isNoSavedCredentialFoundResponse</span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">response</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// Android and Apple only.</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// No saved credential found (user has not signed in yet, or they revoked access)</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// call `createAccount()`</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>catch</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">error</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token builtin">console</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>error</span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">error</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token keyword" style=color:#00009f>if</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token function" style=color:#d73a49>isErrorWithCode</span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">error</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token keyword" style=color:#00009f>switch</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">error</span><span class="token punctuation" style=color:#393A34>.</span><span class="token plain">code</span><span class="token punctuation" style=color:#393A34>)</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token keyword" style=color:#00009f>case</span><span class="token plain"> statusCodes</span><span class="token punctuation" style=color:#393A34>.</span><span class="token constant" style=color:#36acaa>PLAY_SERVICES_NOT_AVAILABLE</span><span class="token operator" style=color:#393A34>:</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token comment" style=color:#999988;font-style:italic>// Android: play services not available or outdated.</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token comment" style=color:#999988;font-style:italic>// Get more details from `error.userInfo`.</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token comment" style=color:#999988;font-style:italic>// Web: when calling an unimplemented api (requestAuthorization)</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token comment" style=color:#999988;font-style:italic>// or when the Google Client Library is not loaded yet.</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">          </span><span class="token keyword" style=color:#00009f>break</span><span class="token punctuation" style=color:#393A34>;</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token keyword" style=color:#00009f>default</span><span class="token operator" style=color:#393A34>:</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">        </span><span class="token comment" style=color:#999988;font-style:italic>// something else happened</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"> </span><span class="token keyword" style=color:#00009f>else</span><span class="token plain"> </span><span class="token punctuation" style=color:#393A34>{</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">      </span><span class="token comment" style=color:#999988;font-style:italic>// an error that's not related to google sign in occurred</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">    </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain">  </span><span class="token punctuation" style=color:#393A34>}</span><span class="token plain"></span></span><br/></div><div class="token-line codeLine_lJS_" style=color:#393A34><span class=codeLineNumber_Tfdd></span><span class=codeLineContent_feaV><span class="token plain"></span><span class="token punctuation" style=color:#393A34>}</span><span class="token punctuation" style=color:#393A34>;</span></span><br/></div></code></pre></div></div>
<hr/>
<!-- -->
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=utility-functions>Utility Functions<a href=#utility-functions class=hash-link aria-label="Direct link to Utility Functions" title="Direct link to Utility Functions" translate=no></a></h3>
<div class="theme-admonition theme-admonition-tip admonition_xJq3 alert alert--success"><div class=admonitionHeading_Gvgb><span class=admonitionIcon_Rf37><svg viewBox="0 0 12 16"><path fill-rule=evenodd d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"/></svg></span>tip</div><div class=admonitionContent_BuS1><p>There are 4 helper functions available:</div></div>
<ul>
<li class=""><a class="" href=/docs/errors#iserrorwithcodevalue><code>isErrorWithCode</code></a> for processing errors</li>
<li class=""><a class="" href=/docs/api#issuccessresponse><code>isSuccessResponse</code></a> for checking if a response represents a successful operation. Same as checking <code>response.type === 'success'</code>.</li>
<li class=""><a class="" href=/docs/api#isnosavedcredentialfoundresponse><code>isNoSavedCredentialFoundResponse</code></a> for checking if a response represents no saved credentials case. Same as checking <code>response.type === 'noSavedCredentialFound'</code>.</li>
<li class=""><a class="" href=/docs/api#iscancelledresponse><code>isCancelledResponse</code></a> for checking if a response represents user cancellation case. Same as checking <code>response.type === 'cancelled'</code>.</li>
</ul>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=createaccount><code>createAccount</code><a href=#createaccount class=hash-link aria-label="Direct link to createaccount" title="Direct link to createaccount" translate=no></a></h3>
<p>signature: (<code>params</code>?: <a class="" href=/docs/api#onetapcreateaccountparams><code>OneTapCreateAccountParams</code></a>) => <code>Promise</code>&lt;<a class="" href=/docs/api#onetapresponse><code>OneTapResponse</code></a>></p>
<table><thead><tr><th>Platform<th>Behavior<tbody><tr><td>Android<td>Starts a flow to sign in with your app for the first time (to create a user account). It offers a list of user accounts to choose from (multiple Google accounts can be logged in on the device).<tr><td>Apple<td>Starts an interactive sign-in flow. <a href=https://developers.google.com/identity/sign-in/ios/reference/Classes/GIDSignIn#-signinwithpresentingviewcontroller:hint:completion: target=_blank rel="noopener noreferrer" class="">Docs</a>. It offers a list of user accounts to choose from (multiple Google accounts can be logged in on the device).<tr><td>Web<td>Presents a one-tap prompt and waits for user interaction (it will not sign in automatically). The prompt has a slightly different styling than with <code>signIn</code> (configrable via the <code>context</code> param). <a href=#web-support class="">Read below</a> for web support.</table>
<p>You don't need to call <code>createAccount</code> as a response to a user action - you can call it some time after your app starts (Though keep in mind the way the dialog is presented on iOS might be inconvenient to users if they didn't ask for it) or when suitable.</p>
<p>Use <code>createAccount</code> if <code>signIn</code> resolved with <a class="" href=/docs/api#nosavedcredentialfound><code>NoSavedCredentialFound</code> result</a>, as indicated in the code snippet above.</p>
<!-- -->
<details class="details_lb9f alert alert--info details_b_Ee" data-collapsed=true><summary>UI screenshots</summary><div><div class=collapsibleContent_i85q><table><thead><tr><th style=text-align:center>Android<th style=text-align:center>iOS<th style=text-align:center>Web<tbody><tr><td style=text-align:center><img src=/img/onetap/signing-up-android.png style=max-width:300px /><td style=text-align:center><img src=/img/onetap/signing-up-ios.png style=max-width:300px /><td style=text-align:center><img src=/img/onetap/signing-up-web.png style=max-width:300px /></table></div></div></details>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>createAccount</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><br/></div></code></pre></div></div>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=presentexplicitsignin><code>presentExplicitSignIn</code><a href=#presentexplicitsignin class=hash-link aria-label="Direct link to presentexplicitsignin" title="Direct link to presentexplicitsignin" translate=no></a></h3>
<p>signature: (<code>params</code>?: <a class="" href=/docs/api#onetapexplicitsigninparams><code>OneTapExplicitSignInParams</code></a>) => <code>Promise</code>&lt;<a class="" href=/docs/api#onetapexplicitsigninresponse><code>OneTapExplicitSignInResponse</code></a>></p>
<table><thead><tr><th>Platform<th>Behavior<tbody><tr><td>Android<td>Presents the sign in dialog explicitly. This is useful if both <code>signIn</code> and <code>createAccount</code> resolve with <a class="" href=/docs/api#nosavedcredentialfound><code>NoSavedCredentialFound</code></a> object - which happens (in the unlikely case) when no Google account is present on the device. This prompts the user to add a Google account.<tr><td>Apple<td>Starts an interactive sign-in flow. Same as <code>createAccount</code>.<tr><td>Web<td>Presents a one-tap prompt. Same as <code>createAccount</code>.</table>
<p>Preferably, call this method only as a reaction to when user taps a <a class="" href=/docs/buttons/google-logo-button>sign in button</a>.</p>
<!-- -->
<details class="details_lb9f alert alert--info details_b_Ee" data-collapsed=true><summary>UI screenshots</summary><div><div class=collapsibleContent_i85q><table><thead><tr><th style=text-align:center>Android<th style=text-align:center>iOS<th style=text-align:center>Web<tbody><tr><td style=text-align:center><img src=/img/onetap/explicit-android.png style=max-width:300px /><td style=text-align:center><img src=/img/onetap/signing-up-ios.png style=max-width:300px /><td style=text-align:center><img src=/img/onetap/signing-up-web.png style=max-width:300px /></table></div></div></details>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>presentExplicitSignIn</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><br/></div></code></pre></div></div>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=checkplayservices><code>checkPlayServices</code><a href=#checkplayservices class=hash-link aria-label="Direct link to checkplayservices" title="Direct link to checkplayservices" translate=no></a></h3>
<p>signature: (<code>showErrorResolutionDialog</code>?: <code>boolean</code>): <code>Promise</code>&lt;<a class="" href=/docs/api#playservicesinfo><code>PlayServicesInfo</code></a>></p>
<p>The behavior of <code>checkPlayServices</code> varies across platforms:</p>
<ul>
<li class="">Android: The function resolves if the device has Play Services installed and their version is >= the minimum required version. Otherwise, it rejects with <code>statusCodes.PLAY_SERVICES_NOT_AVAILABLE</code> error code, and more information in <code>userInfo</code> field (see <a href=#example-code-snippet class="">below</a>).</li>
</ul>
<p>The <code>showErrorResolutionDialog</code> parameter (default <code>true</code>) controls whether a dialog that helps to resolve an error is shown (only in case the error is user-resolvable).</p>
<p>On Android, the presence of up-to-date Google Play Services is required to call any of the provided authentication and authorization methods. It is therefore necessary to call <code>checkPlayServices</code> any time prior to calling the authentication / authorization methods and only call those if <code>checkPlayServices</code> is successful.</p>
<p>Some errors are user-resolvable (e.g. when Play Services are outdated or disabled) while other errors cannot be resolved (e.g. when the phone doesn't ship Play Services at all - which is the case with some device vendors).</p>
<details class="details_lb9f alert alert--info details_b_Ee" data-collapsed=true><summary>Dialog screenshots</summary><div><div class=collapsibleContent_i85q><p><img decoding=async loading=lazy alt="prompt install" src=/assets/images/prompt-install-b928a962a8d2c0a416628bffd0c95448.png width=614 height=350 class=img_ev3q />
<img decoding=async loading=lazy alt="prompt enable" src=/assets/images/prompt-enable-812fb1d8cb868511c8b8baccb13306e0.png width=734 height=332 class=img_ev3q /></div></div></details>
<ul>
<li class="">Apple: Play Services are an Android-only concept and are not needed on Apple. Hence, the method always resolves.</li>
<li class="">Web: resolves when the Google Client Library <a class="" href=/docs/setting-up/web>is loaded</a>, rejects otherwise.</li>
</ul>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockTitle_OeMC>Example of checkPlayServices() method</div><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>checkPlayServices</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><br/></div></code></pre></div></div>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=signout><code>signOut</code><a href=#signout class=hash-link aria-label="Direct link to signout" title="Direct link to signout" translate=no></a></h3>
<p>signature: () => <code>Promise</code>&lt;<code>null</code>></p>
<p>Signs out the current user. This disables the automatic sign-in.</p>
<p>Returns a <code>Promise</code> that resolves with <code>null</code> or rejects in case of error.</p>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>signOut</span><span class="token punctuation" style=color:#393A34>(</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><br/></div></code></pre></div></div>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=revokeaccess><code>revokeAccess</code><a href=#revokeaccess class=hash-link aria-label="Direct link to revokeaccess" title="Direct link to revokeaccess" translate=no></a></h3>
<p>signature: (<code>emailOrUniqueId</code>: <code>string</code>) => <code>Promise</code>&lt;<code>null</code>></p>
<p>Revokes access given to the current application and signs the user out. Use when a user deletes their account in your app. On the web, you need to provide the <code>id</code> or email of the user. On Android and Apple, the <code>emailOrUniqueId</code> parameter does not have any effect.</p>
<p>Returns a <code>Promise</code> that resolves with <code>null</code> or rejects in case of error.</p>
<div class="language-ts codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-ts codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token keyword" style=color:#00009f>await</span><span class="token plain"> GoogleOneTapSignIn</span><span class="token punctuation" style=color:#393A34>.</span><span class="token function" style=color:#d73a49>revokeAccess</span><span class="token punctuation" style=color:#393A34>(</span><span class="token plain">user</span><span class="token punctuation" style=color:#393A34>.</span><span class="token plain">id</span><span class="token punctuation" style=color:#393A34>)</span><span class="token punctuation" style=color:#393A34>;</span><br/></div></code></pre></div></div>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=requestauthorization><code>requestAuthorization</code><a href=#requestauthorization class=hash-link aria-label="Direct link to requestauthorization" title="Direct link to requestauthorization" translate=no></a></h3>
<p>signature: (<code>params</code>: <a class="" href=/docs/api#requestauthorizationparams><code>RequestAuthorizationParams</code></a>) => <code>Promise</code>&lt;<a class="" href=/docs/api#authorizationresponse><code>AuthorizationResponse</code></a>></p>
<p>The underlying Android SDK separates authentication and authorization - that means that on Android you can request an access token and call Google APIs on behalf of the user without previously signing the user in.</p>
<p>This method is used to request extra authorization from the user. Use this on Android to obtain server-side access (offline access) to the user's data or for requesting an access token that has access to additional scopes.</p>
<table><thead><tr><th>Platform<th>Behavior<tbody><tr><td>Android<td>Presents a modal that asks user for additional access to their Google account. Uses <a href=https://developers.google.com/android/reference/com/google/android/gms/auth/api/identity/AuthorizationRequest.Builder target=_blank rel="noopener noreferrer" class="">AuthorizationRequest.Builder</a>.<tr><td>Apple<td>Calls <a class="" href=/docs/original#addscopes><code>addScopes</code></a>. The resulting <code>accessToken</code> has access to the requested scopes. Use this if you want to read more user metadata than just the basic info.<tr><td>Web<td>Not implemented at the moment.</table>
<!-- -->
<details class="details_lb9f alert alert--info details_b_Ee" data-collapsed=true><summary>UI screenshots</summary><div><div class=collapsibleContent_i85q><table><thead><tr><th style=text-align:center>Android<th style=text-align:center>iOS<tbody><tr><td style=text-align:center><img src=/img/onetap/authorize-android.jpg style=max-width:400px /><td style=text-align:center><img src=/img/onetap/add-scopes-ios.png style=max-width:400px /></table></div></div></details>
<hr/>
<h3 class="anchor anchorTargetStickyNavbar_Vzrq" id=clearcachedaccesstoken><code>clearCachedAccessToken</code><a href=#clearcachedaccesstoken class=hash-link aria-label="Direct link to clearcachedaccesstoken" title="Direct link to clearcachedaccesstoken" translate=no></a></h3>
<p>signature: (<code>accessTokenString</code>: <code>string</code>) => <code>Promise</code>&lt;<code>null</code>></p>
<p>This method is only needed on Android. You may run into a <code>401 Unauthorized</code> error when an access token is invalid. Call this method to remove the token from local cache and then call <code>requestAuthorization()</code> to get a fresh access token. Calling this method on Apple does nothing and always resolves. This is because on Apple, <code>requestAuthorization()</code> always returns valid tokens, refreshing them first if they have expired or are about to expire (see <a href=https://developers.google.com/identity/sign-in/ios/reference/Classes/GIDGoogleUser#-refreshtokensifneededwithcompletion: target=_blank rel="noopener noreferrer" class="">docs</a>).</p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id=automatic-config>Automatic <code>webClientId</code> & <code>iosClientId</code> detection<a href=#automatic-config class=hash-link aria-label="Direct link to automatic-config" title="Direct link to automatic-config" translate=no></a></h2>
<p>If you use Expo (with the config plugin and prebuild), or if you're using Firebase, you don't need to provide the <code>iosClientId</code> parameter to the <code>configure</code> method.</p>
<p>Additionally, this module can automatically detect the <code>webClientId</code> from Firebase's configuration file (does not work on web where you need to provide it explicitly).</p>
<p>This is useful if you're using Firebase and want to avoid manually setting the <code>webClientId</code> in your code, especially if you have multiple environments (e.g. staging, production).</p>
<p>To use this feature:</p>
<ol>
<li class="">Add <code>WEB_CLIENT_ID</code> entry to the <code>GoogleService-Info.plist</code> file.</li>
</ol>
<p>On Android, the <code>google-services.json</code> file already contains the web client ID information. Unfortunately, it's not the case on iOS, so we need to add it ourselves.</p>
<p>Open the <code>GoogleService-Info.plist</code> in your favorite text editor and add the following:</p>
<div class="language-xml codeBlockContainer_Ckt0 theme-code-block" style=--prism-color:#393A34;--prism-background-color:#f6f8fa><div class=codeBlockContent_QJqH><pre tabindex=0 class="prism-code language-xml codeBlock_bY9V thin-scrollbar" style=color:#393A34;background-color:#f6f8fa><code class=codeBlockLines_e6Vv><div class=token-line style=color:#393A34><span class="token tag punctuation" style=color:#393A34>&lt;</span><span class="token tag" style=color:#00009f>key</span><span class="token tag punctuation" style=color:#393A34>></span><span class="token plain">WEB_CLIENT_ID</span><span class="token tag punctuation" style=color:#393A34>&lt;/</span><span class="token tag" style=color:#00009f>key</span><span class="token tag punctuation" style=color:#393A34>></span><span class="token plain"></span><br/></div><div class=token-line style=color:#393A34><span class="token plain"></span><span class="token tag punctuation" style=color:#393A34>&lt;</span><span class="token tag" style=color:#00009f>string</span><span class="token tag punctuation" style=color:#393A34>></span><span class="token plain">your-web-client-id.apps.googleusercontent.com</span><span class="token tag punctuation" style=color:#393A34>&lt;/</span><span class="token tag" style=color:#00009f>string</span><span class="token tag punctuation" style=color:#393A34>></span><br/></div></code></pre></div></div>
<ol start=2>
<li class="">pass <code>"autoDetect"</code> as the <code>webClientId</code> parameter.</li>
</ol>
<div class="theme-admonition theme-admonition-tip admonition_xJq3 alert alert--success"><div class=admonitionHeading_Gvgb><span class=admonitionIcon_Rf37><svg viewBox="0 0 12 16"><path fill-rule=evenodd d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"/></svg></span>tip</div><div class=admonitionContent_BuS1><p>As explained above, <code>iosClientId</code> can also be detected automatically - simply do not pass any <code>iosClientId</code> value.
The reason <code>webClientId</code> is a required parameter is API uniformity across all platforms.</div></div>
<hr/>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id=web-support>Web support<a href=#web-support class=hash-link aria-label="Direct link to Web support" title="Direct link to Web support" translate=no></a></h2>
<p><a class="" href=/docs/web-support>Learn more</a>.</div><footer class="theme-doc-footer docusaurus-mt-lg"><div class="row margin-top--sm theme-doc-footer-edit-meta-row"><div class="col noPrint_WFHX"><a href=https://github.com/react-native-google-signin/docs/edit/main/docs/one-tap.mdx target=_blank rel="noopener noreferrer" class=theme-edit-this-page><svg fill=currentColor height=20 width=20 viewBox="0 0 40 40" class=iconEdit_Z9Sw aria-hidden=true><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"/></g></svg>Edit this page</a></div><div class="col lastUpdated_JAkA"></div></div></footer></article><nav class="docusaurus-mt-lg pagination-nav" aria-label="Docs pages"><a class="pagination-nav__link pagination-nav__link--prev" href=/docs/setting-up/get-config-file><div class=pagination-nav__sublabel>Previous</div><div class=pagination-nav__label>Configuration</div></a><a class="pagination-nav__link pagination-nav__link--next" href=/docs/original><div class=pagination-nav__sublabel>Next</div><div class=pagination-nav__label>Original Google sign in</div></a></nav></div></div><div class="col col--3"><div class="tableOfContents_bqdL thin-scrollbar theme-doc-toc-desktop"><ul class="table-of-contents table-of-contents__left-border"><li><a href=#usage class="table-of-contents__link toc-highlight">Usage</a><li><a href=#methods class="table-of-contents__link toc-highlight">Methods</a><ul><li><a href=#configure class="table-of-contents__link toc-highlight"><code>configure</code></a><li><a href=#signin class="table-of-contents__link toc-highlight"><code>signIn</code></a><li><a href=#utility-functions class="table-of-contents__link toc-highlight">Utility Functions</a><li><a href=#createaccount class="table-of-contents__link toc-highlight"><code>createAccount</code></a><li><a href=#presentexplicitsignin class="table-of-contents__link toc-highlight"><code>presentExplicitSignIn</code></a><li><a href=#checkplayservices class="table-of-contents__link toc-highlight"><code>checkPlayServices</code></a><li><a href=#signout class="table-of-contents__link toc-highlight"><code>signOut</code></a><li><a href=#revokeaccess class="table-of-contents__link toc-highlight"><code>revokeAccess</code></a><li><a href=#requestauthorization class="table-of-contents__link toc-highlight"><code>requestAuthorization</code></a><li><a href=#clearcachedaccesstoken class="table-of-contents__link toc-highlight"><code>clearCachedAccessToken</code></a></ul><li><a href=#automatic-config class="table-of-contents__link toc-highlight">Automatic <code>webClientId</code> & <code>iosClientId</code> detection</a><li><a href=#web-support class="table-of-contents__link toc-highlight">Web support</a></ul></div></div></div></div></main></div></div></div><footer class="theme-layout-footer footer footer--dark"><div class="container container-fluid"><div class="footer__bottom text--center"><div class=footer__copyright>Copyright © 2026 <a href=https://universal-sign-in.com/>universal-sign-in.com</a></div></div></div></footer></div></body>