Login with Google, OTP and passkeys

Login with Google: the idea

OAuth 2.0 is a standard that lets a user give an app limited access to their account on another service, without giving away their password. OpenID Connect (OIDC) is a layer on top that also tells the app who the user is, through an ID token (a signed JWT).

The authorization code flow with PKCE

1. The user taps "Continue with Google".
2. Your backend makes a random state value and a random code_verifier, plus code_challenge = SHA-256 of the verifier. It saves them in the session.
3. The browser is sent to Google with client_id, redirect_uri, scope=openid email profile, state and code_challenge.
4. The user logs in at Google (not on your site) and agrees to share their email and profile.
5. Google redirects back to your redirect_uri with ?code=...&state=....
6. Your backend checks state, then sends the code, the code_verifier and its client secret to Google's token endpoint, server to server.
7. Google returns an ID token. Your backend verifies it (signature, iss, aud, exp), finds or creates the user by the sub claim, and starts its own session.

https://accounts.google.com/o/oauth2/v2/auth
  ?response_type=code
  &client_id=1234.apps.googleusercontent.com
  &redirect_uri=https://myshop.in/auth/google/callback
  &scope=openid%20email%20profile
  &state=Zx81kq...
  &code_challenge=E9Melhoa2Owv...
  &code_challenge_method=S256

OTP login

An OTP (one-time password) is a short code, usually 6 digits, sent by SMS, WhatsApp or email. Many Indian apps let you log in with just a mobile number and an OTP. In India, business SMS must go through a DLT-registered sender and template (a TRAI rule), so teams usually use a provider such as MSG91, Twilio or Firebase Authentication.

• Random: made with a secure random generator (crypto.getRandomValues or crypto.randomInt), never Math.random.
• Short life: expires in about 5 minutes.
• Limited attempts: after 3 to 5 wrong tries, the code is dead and a new one is needed.
• Stored hashed: keep only a hash of the OTP, like a password, and delete it after use.
• Rate limited: for example one SMS per 30 seconds and a few per hour per number, to stop abuse and SMS bills.

// Example only: runs on a server with Node.js
import { randomInt, createHmac } from 'node:crypto';

const otp = String(randomInt(0, 1000000)).padStart(6, '0'); // '000000' to '999999'
const otpHash = createHmac('sha256', process.env.OTP_SECRET).update(phone + ':' + otp).digest('hex');

await db.otps.insert({ phone, otpHash, expiresAt: Date.now() + 5 * 60 * 1000, attempts: 0 });
await sms.send(phone, 'Your login code is ' + otp + '. It expires in 5 minutes.');

Passkeys: no password at all

A passkey uses WebAuthn, a web standard. The phone or laptop makes a key pair for your site: the private key stays on the device, unlocked by fingerprint, face or screen lock, and the server stores only the public key. At login the device signs a challenge from the server. Passkeys cannot be phished, because the browser only uses them on the real domain.