Are you an LLM? Read llms.txt for a summary of the docs, or llms-full.txt for the full context.
Signup & Login – 1auth
Skip to content

Signup & Login

Add passkey authentication to your app with a single method call. Users authenticate with Face ID or Touch ID - no passwords, no seed phrases.

Using wagmi

Wagmi provides hooks to integrate 1auth authentication into your React app.

Install the SDK

npm install @rhinestone/1auth

Create config.ts

Create a wagmi config file with the 1auth connector:

config.ts
import { createConfig, http } from 'wagmi'
import { base } from 'wagmi/chains'
import { OneAuthClient } from '@rhinestone/1auth'
import { oneAuth } from '@rhinestone/1auth/wagmi'
 
// Create the 1auth client
const client = new OneAuthClient({ 
  providerUrl: 'https://passkey.1auth.box', 
}) 
 
// Create the wagmi config with 1auth connector
export const config = createConfig({
  chains: [base],
  connectors: [oneAuth({ client, chainId: base.id })], 
  transports: {
    [base.id]: http(),
  },
})

Display sign in button

Create a component that connects users with their passkey. The connectors array contains the 1auth connector from your config:

SignInButton.tsx
import { useConnect } from 'wagmi'
 
export function SignInButton() {
  const { connectors, connect } = useConnect()
  const connector = connectors.find((c) => c.id === '1auth') 
 
  return (
    <button onClick={() => connect({ connector })}>
      Sign in with 1auth
    </button>
  )
}

Display account & sign out

After the user signs in, display their account and provide a sign out button:

Done

You have successfully set up passkey authentication with 1auth!

Using the SDK directly

If you prefer not to use wagmi, you can use the SDK's authWithModal() method directly:

import { OneAuthClient } from '@rhinestone/1auth'
 
const client = new OneAuthClient({
  providerUrl: 'https://passkey.1auth.box',
})
 
// Open the authentication modal
const result = await client.authWithModal()
 
if (result.success) {
  console.log('Connected as:', result.user?.username)
  console.log('Address:', result.user?.address)
}

How it works

  1. User clicks sign in - Your app calls authWithModal() or uses the wagmi connector
  2. 1auth modal opens - User enters their username or creates a new account
  3. Passkey prompt - Device prompts for Face ID / Touch ID
  4. Success - You receive the username and wallet address

The entire flow happens in a secure iframe. Your app never sees the passkey credentials.

Next steps