Connectors are Javascript classes that define how your dApp will interact with the Ethereum blockchain and user accounts. Connectors are fully extensible, meaning that if you don't like any of the options documented below, you can implement your own! web3-react will work just the same. For more information, see Custom-Connectors.md.
Note: Some Connectors throw specific errors that can be identified and handled appropriately by your dApp. In general, these error codes are available in the .errorCodes property of any Connector.
Manages connectivity to injected web3 providers such as MetaMask (or Trust/Tokenary/etc.).
import { Connectors } from 'web3-react'
const MetaMask = Connectors.InjectedConnector({
supportedNetworks: [...]
})Arguments:
supportedNetworks: number[](optional): Enforces that the injected connector is connected to a particular network, throwing an error if not.
Throws:
-
Connector.UNSUPPORTED_NETWORK: Thrown if asupportedNetworksarray is provided, and the user is not on one of those networks. -
InjectedConnector.ETHEREUM_ACCESS_DENIED: Thrown when a user denies permission for your dApp to access their account. -
InjectedConnector.LEGACY_PROVIDER: Thrown when no globalethereumobject is available, only the deprecatedweb3object. -
InjectedConnector.NO_WEB3: Thrown when visiting from a non-web3 browser. -
InjectedConnector.UNLOCK_REQUIRED: Thrown when a user's account is locked.
Manages connectivity to a remote web3 provider such as Infura (or Quiknode/etc.).
import { Connectors } from 'web3-react'
const Infura = Connectors.NetworkOnlyConnector({
providerURL: ...
})Arguments:
providerURL- The URL of a remote node.
Throws:
Connector.UNSUPPORTED_NETWORK: Thrown if asupportedNetworksarray is provided, and the user is not on one of those networks.
yarn add trezor-connect@^7Manages connectivity to a Trezor device. Note: Currently, only the first account is exported/made accessible. If this limits your dApp's functionality, please file an issue.
import { Connectors } from 'web3-react'
import TrezorApi from 'trezor-connect'
const Trezor = Connectors.TrezorConnector({
api: TrezorApi,
supportedNetworkURLs: { ... },
defaultNetwork: ...,
manifestEmail: ...,
manifestAppUrl: ...
})Arguments:
-
api: any- An instance of thetrezor-connectAPI, version^7. -
supportedNetworkURLs: any- An object whose keys are network IDs, and values are remote nodes connected to that network ID. -
defaultNetwork: number- The network ID that the connector will use by default. -
manifestEmail: string- Manifest email -
manifestAppUrl: string- Manifest email
Methods:
changeNetwork(networkId: number)- Changes to a different network insupportedNetworkURLs.
Manages connectivity to a Ledger device. Note: Currently, only the first account is exported/made accessible. If this limits your dApp's functionality, please file an issue.
import { Connectors } from 'web3-react'
const Ledger = Connectors.LedgerConnector({
supportedNetworkURLs: { ... },
defaultNetwork: ...
})Arguments:
-
supportedNetworkURLs: any- An object whose keys are network IDs, and values are remote nodes connected to that network ID. -
defaultNetwork: number- The network ID that the connector will use by default.
Methods:
changeNetwork(networkId: number)- Changes to a different network insupportedNetworkURLs.
yarn add @walletconnect/web3-subprovider@^1.0.0-beta.1Manages connectivity to a WalletConnect wallet.
import { Connectors } from 'web3-react'
import WalletConnectApi from '@walletconnect/web3-subprovider'
const WalletConnect = Connectors.WalletConnectConnector({
api: WalletConnectApi,
bridge: ...,
supportedNetworkURLs: ...,
defaultNetwork: ...
})Arguments:
-
api: any- An instance of the@walletconnect/web3-subproviderAPI, version^1.0.0-beta.1. -
bridge: string- The URL of the WalletConnect bridge. -
supportedNetworkURLs: any- An object whose keys are network IDs, and values are remote nodes that can connect to that network ID. -
defaultNetwork: number- The network ID that the connector will use by default.
yarn add fortmatic@^0.7Manages connectivity to Fortmatic.
import { Connectors } from 'web3-react'
import FortmaticApi from 'fortmatic'
const Fortmatic = Connectors.FortmaticConnector({
api: FortmaticApi,
apiKey: ...,
logoutOnDeactivation: ...,
testNetwork: ...
})Arguments:
-
api: any- An instance of thefortmaticAPI, version^0.7. -
apiKey: string- Fortmatic API key. -
logoutOnDeactivation: boolean- Whether to log the user out or not when the connector is unset,falseby default. -
testNetwork: string(optional) - A network to initialize the Formatic SDK with.
yarn add @portis/web3@^2.0.0-beta.1Manages connectivity to Portis.
import { Connectors } from 'web3-react'
import PortisApi from '@portis/web3'
const Portis = Connectors.PortisConnector({
api: PortisApi,
dAppId: ...,
network: ...,
options: ...
})Arguments:
-
api: any- An instance of the@portis/web3API, version^2.0.0-beta.1. -
dAppId: string- Portis API key. -
network: any- The network you wish to connect to. -
options: any(optional) - Portis SDK initialization object.
Methods:
changeNetwork(networkId: string)- Changes to a different network.
npm install squarelinkManages connectivity to Squarelink.
import { Connectors } from 'web3-react'
import Squarelink from 'squarelink'
const squarelink = Connectors.SquarelinkConnector({
api: Squarelink,
clientId: ...,
network: ...,
options: ...
})Arguments:
-
api: any- An instance of thesquarelinkprovider, version^1.1.2. -
clientId: string- Squarelink Client ID. -
network: any- The network you're connecting to. -
options: any(optional) - Squarelink SDK custom options.