Provisioning a Wallet

Coinbase Managed Wallet Creation

If you want Coinbase to manage the backup and restoration of the backup material, you can enable the hostedBackups feature.

To start, use the enableHostedBackups InitializeWaasOptions flag.

React

return (
  <WalletProvider
    enableHostedBackups
  >
    <App /> {/* Your app component */}
  </WalletProvider>
);

Pure JS

const waas = await InitializeWaas({
  enableHostedBackups: true,
  // ...
});

When creating your wallet, the backup material is automatically secured by Coinbase.

Several MPC methods require access to the backup material. You should use the ...fromHostedBackup methods on wallets whose backups have been secured by Coinbase.

For example:

• To restore a wallet, you can use the user.restoreFromHostedBackup(passcode) method.
• To export the private key for a wallet, you can use the user.exportKeysFromHostedBackup(...) method.

See our API reference for more information.

Developer Managed Wallet Creation

By default, the backup material is returned to the developer the first time a wallet is created. This is your chance to back up the wallet, or inform the user of the need to backup this material.

React

import { useWalletContext } from "@coinbase/waas-sdk-web-react";

const App = () => {
    const {waas, user, wallet} = useWalletContext();
    // this button creates a wallet, if the user doesn't have one.
    // NOTE: a user can have only one wallet associated with them, but many addresses!
    return <button disabled={!user || !wallet || user.hasWallet} onClick={() => async () => {
        const wallet = await user.create("optional passcode");

        // TODO: securely backup on behalf of user, or communicate to user to backup themselves.
        const backupMaterialSensitive = wallet.backup;
    }}>Create Wallet</button>
}

If your user already has a wallet, you can restore it using the backup material (and the user's passcode, if one was specified.)

import { useWalletContext } from "@coinbase/waas-sdk-web-react";

const App = ({backup, passcode}: {backup: string, passcode: string}) => {
    const {waas, user, wallet} = useWalletContext();

    // this button restores the user wallet, if they have one already.
    // note that "backup" (backup material) and "passcode" are passed in as props.
    return <button disabled={!user || !wallet || !user.hasWallet} onClick={() => async () => {
        const wallet = await user.restoreFromBackup(backup, passcode);
    }}>Restore Wallet</button>
}

Pure JS

const backup = "...."; // as previously returned from a freshly created Wallet `.backup` property.
const passcode = "..."; // as previously specified by the user.

if (!waas.auth.user) {
    // NOTE: call `login() with no parameters if you want to use Coinbase hosted auth.
    const user = await waas.auth.login({
        provideAuthToken: async () => {
            // call your backend endpoint /auth/token that invokes `issueUserToken`
            const tokenResponse = await fetch("/auth/token", { method: 'POST'}).then(r => r.json())
            return tokenResponse.token;
        }
    });
    await user.restoreFromBackup(backup, passcode)
}

More information

Coinbase's 2-of-2 MPC Wallets are designed to be user-friendly and secure. While Coinbase holds 1 of the 2 shards, developers can choose how and where to store the 2nd shard (backup material).

• Wallets can be configured with an optional 6+ character passcode, that is used to validate all operations (key export, signing, login).
• Wallets can only be accessed on the origin that they are created on. This helps keep your users safe from a wide host of security threats.

info

A wallet created on https://localhost:3000 is not accessible from https://localhost:3001, or https://coinbase.com.

Getting an address

Once you have access to a wallet, you can derive an address for use onchain.

React

import { useEVMAddress, useWalletContext } from "@coinbase/waas-sdk-web-react";
// a component that displays the current address.
const AddressComponent = () => {
    const {waas, user, wallet} = useWalletContext();
    const address = useEVMAddress(wallet);

    return <div>
        {address && <p>{address!.address}</p>}
        {!address && <p>No address available.</p>}
    </div>
}

Pure JS

import {Wallet, Waas, ProtocolFamily} from '@coinbase/waas-sdk-web';

const getAddress = async (wallet: Wallet) => {
    const address = await wallet.addresses.for(ProtocolFamily.EVM);
    console.log(`got address: ${address.address}`);
    return address;
}