Docs

Overview

Auth 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.


Get Started

npm i thirdweb

Get Your Client ID

To use Auth in your app, you'll need a client ID. You can get one for free on your thirdweb dashboard.

Setting Up Auth

import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import { createThirdwebClient } from "thirdweb";
import { createAuth } from "thirdweb/auth";
const client = createThirdwebClient({
clientId: "1234567890", // get yours at https://thirdweb.com/dashboard/settings/api-keys
});
const thirdwebAuth = createAuth({
domain: "localhost:3000",
client,
});
export default function App() {
const [loggedIn, setLoggedIn] = useState(false);
return (
// The ThirdwebProvider should be at the root of your application, but the ConnectButton can be anywhere
<ThirdwebProvider>
<ConnectButton
client={client}
auth={{
getLoginPayload: async (params) => {
return await thirdwebAuth.generatePayload({
address,
chainId: chainId ? parseInt(chainId) : undefined,
});
},
doLogin: async (params) => {
const verifiedPayload =
await thirdwebAuth.verifyLoginPayload(params);
setLoggedIn(verifiedPayload.valid);
},
isLoggedIn: async () => {
return loggedIn;
},
doLogout: async () => {
setLoggedIn(false);
},
}}
/>
</ThirdwebProvider>
);
}

Templates

Quickly get started with one of our templates:

Auth + Next.js

A working example of Auth + Next.js

Auth + Express

A working example of a React + Express app using Auth

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.