Status Docs

Implement EIP-1102

Wondering what EIP-1102 is and why it is a requirement for the DApp Store? Start with the introduction to EIP-1102.

Let us turn our attention to the EIP: https://github.com/ethereum/EIPs/blob/master/EIPS/eip-1102.md

Notice this conceptual overview:

Figure 1: EIP-1102 Flow Overview

This summarizes a comparison of the logical flow.

Legacy DApps check for web3, which may or may not be available depending on the user’s wallet privacy mode. This technique is slated for sunsetting.

  • As legacy wallets drop support for DApps that do not implement EIP-1102 those DApps will stop working with those wallets, so it is wise to implement EIP-1102 as soon as possible.

EIP-1102 DApps request access. The user either grants access or rejects the request. Of course, doing so implies new methods of interacting with user wallets. Don’t panic. This can be done quite simply.

Consider the following code snippet.

import Web3 from 'web3';
if (window.ethereum) {
  window.web3 = new Web3(ethereum);
  try {
    // Request account access if needed
    ethereum.enable();
  } catch (error) {
    // User denied account access…
  }
} else if (window.web3) {
  // Legacy dapp browsers…
  window.web3 = new Web3(web3.currentProvider);
} else {
  // Non-dapp browsers…
  console.log(
    'Non-Ethereum browser detected. You should consider trying Status!'
  );
}
console.log(web3);
export default web3;

Figure 2: Request access with EIP-1102.

This line:

If (window.ethereum) {

will return false if EIP-1102 is not supported by the browser, in which case the DApp will try to use the legacy process that requires Preview Privacy Mode switched off, here:

Window.web3 = new Web3(web3.currentProvider);

This line:

ethereum.enable();

is what prompts the user for permission.

Exercise

Let us see this in action.

We have prepared a very simple DApp to work with.

By “very simple,” we mean that we decluttered it by setting aside such concerns as a front-end framework, responsive design, and cosmetics so we can focus exclusively on EIP-1102.

Since the specimen does not implement EIP-1102, you will need to go to the Profile panel in Status and disable Preview Privacy Mode. When you have done so, you should be able to see the app function as expected.

Figure 3: The Specimen DApp running in Status

This example demonstrates that Status is compatible with legacy DApps, but users are required to temporarily compromise their account security in the browser settings.

Enable EIP-1102 Support

Now, we will enable EIP-1102 support.

In the same repo:

  • Checkout the branch named “2-eip-1102-injected.”
  • Restart the web server.

In app/app.js you can see the changes at this commit: https://github.com/b9lab/eip-1102-example/commit/5cb707f801dae5f6d7b15240ea80908c319934bf

  • Return to the Profile panel in your Status client.
  • Enable Preview Privacy Mode. Remember, this is the default situation.
  • Reload the DApp in Status.
  • Press the “Allow my addresses” button.

Notice that Status prompts the user to grant the application access to the wallet.

Understand What Happened

  • Refresh the web page.
  • Press “Allow my addresses”.

It does not ask for permission. Why is that?

EIP-1102 grants permission to DApps, and these permissions are persistent. When the user indicates that they trust the DApp, the browser does not ask again.

Of course, the user can change their mind later. See the DApp Permissions on the Profile tab. This is intuitive from a user perspective, and it normalizes the permissions flow for all DApps which improves usability across all DApps.

As a reminder, DApps must implement EIP-1102 to be listed in the DApp Store.

Figure 4: DApp Permissions on the Profile Tab.

Style Suggestion: Permission in Context

Notice that we waited until line 53 to do this:

displayMyAccounts(await ethereum.enable());

This is to help the web page align with reasonable user expectations about how mobile app permissions should work. The page does not ask for permission to see the user’s Ethereum addresses until such access is necessary for the DApp to continue.

In other words, the permission is requested in context, when the user clicks on “Allow my addresses”.

Style Suggestion: Backward Compatibility

We enable Ethereum inside a conditional block that checks the browser for EIP-1102 support. 

if (typeof ethereum !== 'undefined') {

If the browser doesn’t support EIP-1102, the DApp falls back on legacy Web3 account access. The DApp can still work with injected Web3, local nodes or other preferred providers. 

   } else {
        try {
            displayMyAccounts(await window.web3.eth.getAccounts());
        } catch(error) {
            $("#myAddresses").html(`Failed to get your addresses: ${error}`);
        }        
    }

That’s It!

Congratulations. You have enabled EIP-1102 support in a simple DApp.

Links

Last update: 2023-12-09