Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 20 additions & 13 deletions docs/build/tools/clients/fcl-js/authentication.md
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
# Authentication

Authentication in FCL is closely tied to the concept of `currentUser`. In fact, `fcl.authenticate` and `fcl.unauthenticate` are simply aliases for `fcl.currentUser.authenticate()` and `fcl.currentUser.unauthenticate()`, respectively. So, let’s take a closer look at `currentUser`.
Authentication in Flow Client Library (FCL) is closely tied to the concept of `currentUser`. In fact, `fcl.authenticate` and `fcl.unauthenticate` are simply aliases for `fcl.currentUser.authenticate()` and `fcl.currentUser.unauthenticate()`, respectively. So, let’s take a closer look at `currentUser`.

As an onchain app developer using FCL, the primary authentication functionalities revolve around:
As an onchain app developer who uses FCL, the primary authentication functionalities revolve around how to:

- Determining the `currentUser` and whether they are logged in.
- Logging a user in.
- Logging a user out.
- Determine the `currentUser` and whether they are logged in.
- Log a user in.
- Log a user out.

Due to the way FCL works, logging in and signing up are essentially the same process.
Due to the way FCL works, to log in and sign up are essentially the same process.

# Retrieving Information About the Current User
# Retriev information about the current user

FCL provides two ways to get information about the current user:

1. **A promise-based method** that returns a snapshot of the user’s data.
2. **A subscription-based method** that triggers a callback function with the latest user information whenever it changes.

### Snapshot of the Current User
### Snapshot of the current user

```javascript
import * as fcl from '@onflow/fcl';
Expand All @@ -37,14 +37,21 @@ const unsubscribe = fcl.currentUser.subscribe((currentUser) => {
});
```

# Authenticating and Unauthenticating
# Authenticate and unauthenticate

The TL;DR: Call `fcl.authenticate()` to log in and `fcl.unauthenticate()` to log out.

On Flow mainnet, no additional configuration is neededyour app’s users will go through the authentication process and be able to use any FCL-compatible wallet provider.
On Flow mainnet, no additional configuration is needed, because your app’s users will go through the authentication process and can use any FCL-compatible wallet provider.

During development, you’ll likely want to configure your app to use [`@onflow/dev-wallet`](https://github.com/onflow/fcl-dev-wallet). The [Quick Start](../../../../blockchain-development-tutorials/cadence/getting-started/index.md) guide will walk you through setting it up.
During development, you’ll likely want to configure your app to use [`@onflow/dev-wallet`]. The [Quick Start] guide will walk you through how to set it up.

We also recommend using the [FCL Discovery Service](discovery.md) to help users discover and connect to FCL-compatible wallets.
We also recommend that you use the [FCL Discovery Service] to help users discover and connect to FCL-compatible wallets.

Whether you're new to building onchain, or an established veteran, we’re here to help. If you run into any issues, reach out to us on [Discord](https://discord.gg/flow) — we’re happy to assist!
Whether you're new to building onchain, or an established veteran, we’re here to help. If you run into any issues, reach out to us on [Discord] — we’re happy to assist!

<!-- Reference-style links, will not render on page. -->

[`@onflow/dev-wallet`]: https://github.com/onflow/fcl-dev-wallet
[Quick Start]: ../../../../blockchain-development-tutorials/cadence/getting-started/index.md
[FCL Discovery Service]: discovery.md
[Discord]: https://discord.gg/flow
55 changes: 35 additions & 20 deletions docs/build/tools/clients/fcl-js/configure-fcl.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,12 @@ title: How to Configure FCL

## Configuration

FCL provides a mechanism to configure various aspects of its behavior. The key principle is that when switching between different Flow Blockchain environments (e.g., Local Emulator → Testnet → Mainnet), the only required change should be your FCL configuration.
Flow Client Library (FCL) provides a mechanism to configure various aspects of its behavior. The key principle is that when you switch between different Flow Blockchain environments (for example, Local Emulator → Testnet → Mainnet), the only required change should be your FCL configuration.

## Setting Configuration Values
## Set configuration values

Values only need to be set once. We recommend that you do this once and as early in the life cycle as possible.

Values only need to be set once. We recommend doing this once and as early in the life cycle as possible.
To set a configuration value, the `put` method on the `config` instance needs to be called, the `put` method returns the `config` instance so they can be chained.

```javascript
Expand All @@ -20,11 +21,15 @@ fcl
.put('baz', 'buz'); // configures "baz" to be "buz"
```

> **Note**: For advanced use cases requiring scoped configuration, isolated client instances, or multi-tenancy support, see the [`createFlowClient` reference documentation](./packages-docs/fcl/createFlowClient.md).
:::info

For advanced use cases that require scoped configuration, isolated client instances, or multi-tenancy support, see the [`createFlowClient` reference documentation].

## Getting Configuration Values
:::

The `config` instance has an asynchronous `get` method. You can also pass it a fallback value incase the configuration state does not include what you are wanting.
## Get configuration values

The `config` instance has an asynchronous `get` method. You can also pass it a fallback value in case the configuration state does not include what you want.

```javascript
import * as fcl from '@onflow/fcl';
Expand All @@ -44,28 +49,28 @@ async function addStuff() {
addStuff().then((d) => console.log(d)); // 13 (5 + 7 + 1)
```

## Common Configuration Keys
## Common configuration keys

- `accessNode.api` -- Api URL for the Flow Blockchain Access Node you want to be communicating with.
- `app.detail.title` - **(INTRODUCED `@onflow/[email protected]`)** Your applications title, can be requested by wallets and other services. Used by WalletConnect plugin & Wallet Discovery service.
- `app.detail.icon` - **(INTRODUCED `@onflow/[email protected]`)** Url for your applications icon, can be requested by wallets and other services. Used by WalletConnect plugin & Wallet Discovery service.
- `app.detail.description` - **(INTRODUCED `@onflow/[email protected]`)** Your applications description, can be requested by wallets and other services. Used by WalletConnect plugin & Wallet Discovery service.
- `app.detail.url` - **(INTRODUCED `@onflow/[email protected]`)** Your applications url, can be requested by wallets and other services. Used by WalletConnect plugin & Wallet Discovery service.
- `accessNode.api` -- API URL for the Flow Blockchain Access Node you want to communicate with.
- `app.detail.title` - **(INTRODUCED `@onflow/[email protected]`)** Your applications title, can be requested by wallets and other services. Used by WalletConnect plugin and Wallet Discovery service.
- `app.detail.icon` - **(INTRODUCED `@onflow/[email protected]`)** URL for your applications icon, can be requested by wallets and other services. Used by WalletConnect plugin and Wallet Discovery service.
- `app.detail.description` - **(INTRODUCED `@onflow/[email protected]`)** Your applications description, can be requested by wallets and other services. Used by WalletConnect plugin and Wallet Discovery service.
- `app.detail.url` - **(INTRODUCED `@onflow/[email protected]`)** Your applications URL, can be requested by wallets and other services. Used by WalletConnect plugin and Wallet Discovery service.
- `challenge.handshake` -- **(DEPRECATED `@onflow/[email protected]`)** Points FCL at the Wallet or Wallet Discovery mechanism.
- `discovery.wallet` -- **(INTRODUCED `@onflow/[email protected]`)** Points FCL at the Wallet or Wallet Discovery mechanism.
- `discovery.wallet.method` -- Describes which service strategy a wallet should use: `IFRAME/RPC`, `POP/RPC`, `TAB/RPC`, `HTTP/POST`, `EXT/RPC`
- `env` -- **(DEPRECATED `@onflow/[email protected]`)** Used in conjunction with stored interactions. Possible values: `local`, `testnet`, `mainnet`
- `fcl.limit` -- Specifies fallback compute limit if not provided in transaction. Provided as integer.
- `flow.network` (recommended) -- **(INTRODUCED `@onflow/[email protected]`)** Used in conjunction with stored interactions and provides FCLCryptoContract address for `testnet` and `mainnet`. Possible values: `local`, `testnet`, `mainnet`.
- `service.OpenID.scopes` - **(INTRODUCED `@onflow/[email protected]`)** Open ID Connect claims for Wallets and OpenID services.
- `walletconnect.projectId` -- **(INTRODUCED `@onflow/[email protected]`)** Your app's WalletConnect project ID. See [WalletConnect Cloud](https://cloud.walletconnect.com/sign-in) to obtain a project ID for your application.
- `walletconnect.projectId` -- **(INTRODUCED `@onflow/[email protected]`)** Your app's WalletConnect project ID. See [WalletConnect Cloud] to obtain a project ID for your application.
- `walletconnect.disableNotifications` -- **(INTRODUCED `@onflow/[email protected]`)** Flag to disable pending WalletConnect request notifications within the application's UI. Default is `false`.

## Using Contracts in Scripts and Transactions
## Use contracts in scripts and transactions

### Address Replacement
### Address replacement

Configuration keys that start with `0x` will be replaced in FCL scripts and transactions, this allows you to write your script or transaction Cadence code once and not have to change it when you point your application at a difference instance of the Flow Blockchain.
Configuration keys that start with `0x` will be replaced in FCL scripts and transactions. This allows you to write your script or transaction Cadence code once and not have to change it when you point your application at a difference instance of the Flow Blockchain.

```javascript
import * as fcl from '@onflow/fcl';
Expand Down Expand Up @@ -115,9 +120,9 @@ fcl
.put('0xFlowToken', '0x7e60df042a9c0868');
```

### Using `flow.json`
### Use `flow.json`

A simpler way to import contracts in scripts and transactions is to use the `config.load` method to ingest your contracts from your `flow.json` file. This keeps the import syntax unified across tools and lets FCL figure out which address to use for what network based on the network provided in config. To use `config.load` you must first import your `flow.json` file and then pass it to `config.load` as a parameter.
A simpler way to import contracts in scripts and transactions is to use the `config.load` method to ingest your contracts from your `flow.json` file. This keeps the import syntax unified across tools and lets FCL figure out which address to use for what network based on the network provided in the config. To use `config.load` you must first import your `flow.json` file and then pass it to `config.load` as a parameter.

```javascript
import { config } from '@onflow/fcl';
Expand Down Expand Up @@ -146,6 +151,16 @@ Then in your scripts and transactions, all you have to do is:
import "HelloWorld"
```

FCL will automatically replace the contract name with the address for the network you are using.
FCL will automatically replace the contract name with the address for the network you use.

:::info

Never put private keys in your `flow.json`. Instead, use the [key/location syntax] to separate your keys into a separate git ignored file.

:::

<!-- Reference-style links, will not render on page. -->

> Note: never put private keys in your `flow.json`. You should use the [key/location syntax](../../flow-cli/flow.json/security.md) to separate your keys into a separate git ignored file.
[`createFlowClient` reference documentation]: ./packages-docs/fcl/createFlowClient.md
[WalletConnect Cloud]: https://cloud.walletconnect.com/sign-in
[key/location syntax]: ../../flow-cli/flow.json/security.md
Loading