Google One Tap not showing on mobile

16 Views Asked by At

I'm experiencing an issue with displaying the Google OneTap button. I have an ionic vue app that is supposed to work both on mobile and on a regular browser. On the regular browser I can see the button just fine and the whole process works perfectly. However on mobile, the OneTap button is not displayed. I tried on several phones / browsers and nothing shows. I can't seem to find many more info on this, likely because this is the "new correct" way of doing things, meaning most tutorials / info on adding Google SSO use the deprecated codetrix-studio/capacitor-google-auth method.

Here is my code:

<template>
  <ion-page class="login-page">
    <ion-header :translucent="false">
      <ion-toolbar>
        <div class="toolbar-logo-container">
          <img src="/logo_final.png" alt="Logo" class="toolbar-logo" />
        </div>
      </ion-toolbar>
    </ion-header>
    <ion-content :fullscreen="true">
      <div class="login-container">
        <!-- Other stuff -->
        <div class="socials">
          <div class="label">Sign in with Google</div>
          <div id="g_id_onload"
              data-client_id="my_client_id"
              data-context="signin"
              data-ux_mode="popup"
              data-login_uri="my_login_endpoint"
              data-auto_select="true"
              data-itp_support="true">
            </div>

            <div class="g_id_signin"
              data-type="standard"
              data-shape="pill"
              data-theme="filled_black"
              data-text="signin_with"
              data-size="large"
              data-logo_alignment="left">
            </div>
          <div class="actions">
            
          </div>
        </div>

        <!-- Other stuff -->
      </div>
    </ion-content>
    <ion-footer>
      <p>Copyright 2024</a></p>
    </ion-footer>
  </ion-page>
</template>

Any help highly appreciated. I'm working on the iOS / Android versions of the app but would really like folks to be able to use the web version until then...

0

There are 0 best solutions below