# Wallet Login

## Requirements

Before continuing make sure you've followed the [setup guide](https://docs.picketapi.com/picket-docs/quick-start-guides/quick-start-guides/start-here-setup)

{% content-ref url="start-here-setup" %}
[start-here-setup](https://docs.picketapi.com/picket-docs/quick-start-guides/quick-start-guides/start-here-setup)
{% endcontent-ref %}

## Wallet Authentication

The easiest way to authenticate a wallet is with one of our [client libraries](https://docs.picketapi.com/picket-docs/quick-start-guides/quick-start-guides/broken-reference). Simply call the `login()` method and everything will be handled for you. A successful wallet authentication will return an [access token](https://docs.picketapi.com/picket-docs/reference/concepts/access-tokens). 

Take a look at how you can initiate the authentication flow by using our official libraries, or via `curl`:

{% tabs %}
{% tab title="Javascript" %}

```javascript
import Picket from "@picketapi/picket-js";
const picket = new Picket('YOUR_PUBLISHABLE_KEY_HERE');
 
const { accessToken, user } = await picket.login({ chain: "ethereum" });

console.log(user);//Logs the user object for your inspection.
```

{% endtab %}

{% tab title="React" %}

```tsx
import { PicketProvider, usePicket } from "@picketapi/picket-react";

function MyApp({ children }) {
  return (
    <PicketProvider apiKey="YOUR_PUBLISHABLE_KEY_HERE">
      {children}
    </PicketProvider>
  );
}

// set this to the chain you want to authenticate users for
// if the chain parameters is omitted, it will default to the ethereum mainnet
const chain = "ethereum"; // "solana"

function MySecurePage() {
  const { 
          isAuthenticating, 
          isAuthenticated, 
          authState, 
          logout,
          login
          } = usePicket();
  
  // user is logging in
  if (isAuthenticating) return "Loading";

  // user is not logged in
  if (!isAuthenticated) {
      return (
        <div>
            <p>You are not logged in!</p>
            <button onClick={() => login({ chain })}>
                Login with Wallet
            </button>
        </div>
      )
  }

  // user is logged in 🎉
  const { user } = authState;
  const { walletAddress } = user;
  
  return (
    <div>
       <p>You are logged in as {walletAddress} </p>
       <button onClick={() => logout()}>Logout</button>
    </div>
  )
}
```

{% endtab %}

{% tab title="curl" %}

```shell
curl https://picketapi.com/api/v1/auth \
    -X POST \
    -u PROJECT_SECRET_KEY \
    -H 'Content-Type: application/json' \
    -d '{
      "walletAddress": "0xWALLET_ADDRESS",
      "signature": "SUPER_SECRET_SIGNATURE"
    }'
```

{% endtab %}
{% endtabs %}

To authenticate users on other blockchains, simply change out the `chain` parameter within the `picket.login()` call from `"ethereum"` to whichever chain you want to authenticate users on. To see which other chains you can choose to authenticate users on, check out our [supported blockchains](https://docs.picketapi.com/picket-docs/reference/concepts/supported-blockchains).

{% hint style="success" %}
**You successfully authenticated a user!**

The user has proven ownership of their wallet.

You can now also use the [access token](https://docs.picketapi.com/picket-docs/reference/concepts/access-tokens) in future requests to your backend to verify wallet ownership without requiring any future user interaction (until token expiration).&#x20;

To validate the token from your backend you can call [`/auth/validate`](https://docs.picketapi.com/picket-docs/reference/concepts/access-tokens#validate-an-access-token) with the `accessToken` in the body of the request.
{% endhint %}

{% hint style="info" %}
**Good to know**: The `login()` method can be used to both authenticate wallets and verify token ownership for token gating.&#x20;

* To verify ownership, simply include a contract address and minimum balance as parameters.&#x20;
* To only authenticate the wallet, call the method with no parameters.
  {% endhint %}

## **Using Authenticated Wallets for On Chain Interactions**

**(Optional) Obtaining a Provider for Future On Chain Interactions**

The above example verifies that the user owns their wallet and provides you with a JWT to repeatedly validate without further user interaction. If your app needs to use the users wallet for any other on chain interactions, you can optionally connect the users wallet to your site. Simply add `picket.connect()` before you call which returns a reference to a provider that can be used for further on-chain operations via your web3 library of choice.

```javascript
import Picket from "@picketapi/picket-js"
const picket = new Picket('YOUR_PUBLISHABLE_KEY_HERE')
import { ethers } from "ethers";


const { walletAddress, signature, provider } = await picket.connect();
const { accessToken } = await picket.login({ walletAddressess, signature });

// use provider for other on-chain operation
const wallet = new ethers.providers.Web3Provider(provider);
const signer = wallet.getSigner();
const balance = await signer.getBalance();
```

## Using Access Tokens

Congrats 🎉 your user is now successfully logged in. After authenticated/authorizing a user, you get an access token. You can use this access token to make secure requests to your backend. Read more in the [working with access tokens guide](https://docs.picketapi.com/picket-docs/quick-start-guides/quick-start-guides/working-with-access-tokens)&#x20;

{% content-ref url="working-with-access-tokens" %}
[working-with-access-tokens](https://docs.picketapi.com/picket-docs/quick-start-guides/quick-start-guides/working-with-access-tokens)
{% endcontent-ref %}