Sign in with Ethereum

Sign in with Ethereum (SIWE) allows anyone to integrate passwordless web3-native authentication and authorization into their applications. Users can then login using any thirdweb wallet (in-app, browser, or smart wallet).

This allows developers to create a familiar, secure authentication flow that works with traditional backends while leveraging the features of a web3 application.

At the root of your React application:


import { ThirdwebProvider } from "thirdweb/react";
 
export default function App() {
  return <ThirdwebProvider>{/* Your app here */}</ThirdwebProvider>;
}

In your components directory:


import { ConnectButton } from "thirdweb/react";
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({ clientId });
 
export default function Connect() {
  <ConnectButton
    client={client}
    auth={{
      getLoginPayload: async (params) => {
        const address = params.address;
        // fetch the login payload here using address from your server
      },
      doLogin: async (params) => {
        // send the signed login payload (params) to your server to verify the signature
      },
      isLoggedIn: async () => {
        // fetch the user's login status from your server
      },
      doLogout: async () => {
        // send a logout request to your server
      },
    }}
  />;
}

Templates

Quickly get started with one of our templates:

Auth + Next.js

A working example of Auth + Next.js

View on GitHub

Auth + Express

A working example of a React + Express app using Auth

View on GitHub

Frameworks

Auth integrates with a variety of server-side and client-side development frameworks. We're always adding support for more frameworks, so if you don't see yours, let us know.

Next.js

Integrate Auth in Next.js applications.

React + Express

Integrate Auth in React applications using Vite and Express.