Use MetaMask SDK with pure JavaScript

Import MetaMask SDK into your pure JavaScript dapp to enable your users to easily connect to the MetaMask browser extension and MetaMask Mobile. The SDK for pure JavaScript has the same prerequisites as for standard JavaScript.

To import, instantiate, and use the SDK, you can insert a script in the head section of your website:

index.html
<head>
  ...
  <script src="https://c0f4f41c-2f55-4863-921b-sdk-docs.github.io/cdn/metamask-sdk.js"></script>
  <script>
    const MMSDK = new MetaMaskSDK.MetaMaskSDK(
      dappMetadata: {
        name: "Example Pure JS Dapp",
        url: window.location.href,
      },
      infuraAPIKey: process.env.INFURA_API_KEY,
      // Other options.
    )
    // Because the init process of MetaMask SDK is async.
    setTimeout(() => {
      // You can also access via window.ethereum.
      const ethereum = MMSDK.getProvider();

      ethereum.request({ method: 'eth_requestAccounts' });
    }, 0)
  </script>
  ...
</head>

You can configure the SDK using any options:

Use dappMetadata to display information about your dapp in the MetaMask connection modal.
Use infuraAPIKey to make read-only RPC requests from your dapp.
Use modals to customize the logic and UI of the displayed modals.

You can call any provider API methods using the SDK. Always call eth_requestAccounts using request() first, since it prompts the installation or connection popup to appear.

You can also call the SDK's connectAndSign method, and batch multiple JSON-RPC requests using the metamask_batch method.

Example

See the example pure JavaScript dapp in the JavaScript SDK GitHub repository for more information.

Use MetaMask SDK with pure JavaScript

Example​

Example