December 8, 2021
Author: Reed McGinley-Stempel
Today, we’re excited to launch support for Google One Tap, a passwordless technology that can significantly improve sign-up and login conversion for applications.
Google One Tap is a particularly powerful way to improve onboarding and login flows, and companies that have done the heavy lifting to integrate it have observed impressive results:
With countless eye-popping conversion results, what is Google One Tap and how does it actually improve conversion?
Google One Tap is a technology from Google that improves upon their traditional OAuth option for “Sign up with Google” — instead of a user choosing to sign up with Google to initiate an OAuth login flow, Google One Tap is able to detect a user’s logged-in Chrome or Gmail session and present the option to continue with one of their recognized accounts.
Google One Tap introduces two fundamental changes to the user experience:
Zapier does a great job of illustrating the UX differences between regular “Sign In with Google” and Google One Tap in their blog post on the subject:
Google One Tap is powered through an iframe that Google provides compared to the traditional OAuth flow of redirecting the user to a separate Google page. As a result, the available accounts are displayed within a developer’s application, and the user clicks their desired account to login or create an account. Hence, a “One Tap” experience.
The Google iframe detects the available accounts by reading the Google sessions from cookies stored in the user’s browser. These sessions are set by Google when a user signs into Google or a Google service (i.e. Gmail or YouTube). Since Google allows users to sign into multiple accounts, each account gets its own session, and Google One Tap shows up to two as options. If a user has more than two accounts, Google One Tap hides the rest behind a dropdown button.
When a user clicks their desired account, Google starts the authentication process. If the user is signing up for the first time, the One Tap iframe gets the consent of the user, otherwise signing them in immediately. Google returns a JWT representing that user, and the developer is responsible for verifying that the JWT is signed and valid. If the JWT is sent to a backend server, the developer is responsible for preventing CSRF attacks.
Stytch offers Google One Tap through a streamlined integration with the JS SDK. This allows developers to focus on creating a delightful experience instead of worrying about authentication and security. The JS SDK allows developers to either embed the Google One Tap Iframe into the SDK like Zapier or have it as a floating window like Redfin (Make sure you aren’t logged in!). The JS SDK captures the login event and forwards the user to the Stytch API to verify the response. The API handles the CSRF protection and JWT verification for the developers as a part of the verification process before redirecting the user back to the login or sign-up redirect URL for that application. At that point, the developer verifies the Stytch request and can request a Stytch session.
All of this work can be enabled through a single line of additional code and minimal configuration in the Stytch dashboard. Google One Tap is supported across all major browsers except Safari.
Stytch is a platform for passwordless authentication that supports high security and low-friction authentication methods like Google One Tap. If you’re interested in integrating One Tap or other Stytch products like biometric authentication, email magic links, OAuth logins, or SMS passcodes, you can sign up for a developer account here to get started or reach out to email@example.com.