AA Snap: Democratizando a Abstração de Contas

MetaMask Snaps é o roteiro para tornar a MetaMask a carteira mais extensível do mundo. Como desenvolvedor, você pode trazer seus recursos e APIs para a MetaMask de maneiras totalmente novas. Os desenvolvedores Web3 são o núcleo desse crescimento, e esta série tem como objetivo destacar os novos MetaMask Snaps sendo construídos hoje.

AA Snap

Repositório do Snap: https://github.com/a42io/AAsnap

Por que você o desenvolveu?

O AA Snap foi criado para democratizar a Account Abstraction (AA) para todos os desenvolvedores e usuários. Acreditamos que a AA será amplamente utilizada no futuro. No entanto, atualmente, é trabalhoso para os devs integrá-la com seus dapps e para os usuários utilizá-la.

Da perspectiva dos devs, é necessário escrever código adicional que suporte AA além do EOA.

Do ponto de vista dos usuários, eles não podem usar suas carteiras habituais, como a MetaMask, e precisam instalar outra carteira que suporte AA, o que resulta em uma UX ruim.

Por isso, queríamos facilitar a integração e o uso da AA utilizando o MetaMask Snaps.

Você pode nos guiar pela implementação técnica?

O AA Snap é composto por três componentes: um frontend de exemplo, o MetaMask snap e um servidor temporário. O snap permite que devs e usuários utilizem uma carteira AA (uma carteira de contrato que suporta EIP-4337) de forma muito simples. Consulte o repositório para a implementação completa.

O frontend de exemplo

O frontend de exemplo é baseado no template fornecido pela MetaMask. Ele demonstra como os desenvolvedores podem integrar facilmente a AA com seus dapps por meio do AA Snap.

Por exemplo, o saldo da carteira AA pode ser obtido com o código simples abaixo.

const balance = (await window.ethereum.request({
    method: 'wallet_invokeSnap',
    params: [
        defaultSnapOrigin,
        {
            method: 'balance',
        },
    ],
})) as string;
Copiar

Para enviar uma transação da carteira AA, basta escrever o código abaixo passando um endereço de beneficiário e um valor.

await window.ethereum.request({
    method: 'wallet_invokeSnap',
    params: [
        defaultSnapOrigin,
        {
            method: 'transfer',
            params: {
                to,        // beneficiary address
                value,     // value in ETH or MATIC
            },
        },
    ],
});
Copiar

O quão fácil é usar a carteira AA do ponto de vista do usuário? Experimente aqui: https://AAsn.app

O Snap

O snap obtém uma instância de AA com o código abaixo. Para implementar a AA, utilizamos o pacote npm @account-abstraction/sdk.

Como o endereço da carteira AA pode ser derivado deterministicamente do EOA do usuário, nenhuma entrada do usuário é necessária.

export const getAbstractAccount = async (): Promise<SimpleAccountAPI> => {
    const provider = new ethers.providers.Web3Provider(wallet as any);
    await provider.send('eth_requestAccounts', []);
    const owner = provider.getSigner();
    const aa = new SimpleAccountAPI({
        provider,
        entryPointAddress,
        owner,
        factoryAddress,
    });
    return aa;
};
Copiar

Há três etapas para enviar uma transação da carteira AA:

1. O snap exibe uma confirmação dentro da MetaMask usando o método snap_confirm do snap. Esse processo não é obrigatório, mas é necessário para uma melhor UX, pois não há como os usuários saberem os detalhes do que irão assinar.

2. O código cria uma operação de usuário da carteira AA e solicita a assinatura de um hash dessa operação. Esse processo é praticamente o mesmo que criar uma tx a partir do EOA e assiná-la.

3. Enviar a operação de usuário assinada para um bundler por meio do nosso servidor.

export const transfer = async (target: string, ethValue: string) => {
    const value = ethers.utils.parseEther(ethValue);
    const aa = await getAbstractAccount();
    const address = await aa.getAccountAddress();

    // 1. Show confirmation within MetaMask
    const result = await wallet.request({
        method: 'snap_confirm',
        params: [{
            prompt: 'Transfer',
            description: 'Transfer from your Abstraction Account',
            textAreaContent: `from: ${address}\ntarget: ${target}\nvalue: ${ethValue}`,
        }],
    });

    if (!result) {
        return;
    }

    // 2. Create a signed user operation of AA wallet
    const op = await aa.createSignedUserOp({
        target,
        value,
        data: '0x',
        maxFeePerGas,
        maxPriorityFeePerGas,
    });

    const printedOp = await printOp(op);
    const body = JSON.stringify({
        op: printedOp,
    });

    // 3. Send a signed user operation to the bundler
    const response = await fetch(SERVER_END_POINT {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body,
    });
};
Copiar

O servidor temporário

Durante o hackathon, encontramos um erro ao chamar o método sendUserOpToBundler dentro do snap. Como não tínhamos tempo para investigar o problema, decidimos criar um servidor para resolvê-lo temporariamente. O servidor temporário apenas recebe a operação de usuário assinada e a repassa para um bundler.

O erro provavelmente veio de dependências, pois há algumas restrições no ambiente de execução do MetaMask Snaps. Acreditamos que o servidor temporário pode ser removido seguindo este documento: Patching Dependencies

app.post('/aa', async (req, res) => {
  const provider = new ethers.providers.JsonRpcProvider(
    process.env.RPC_ENDPOINT,
  );
  const client = await getHttpRpcClient(
    provider,
    process.env.BUNDLER_URL as string,
    process.env.ENTRY_POINT_ADDRESS as string,
  );

  try {
    const uoHash = await client.sendUserOpToBundler(JSON.parse(req.body.op));
    return res.json({
      uoHash,
    });
  } catch (e) {
    console.log(e);
    return res.status(400).send();
  }
});
Copiar

Quais seriam os próximos passos se você fosse implementar isso?

Gostaríamos de remover o código desnecessário do lado do servidor e executar o snap de forma independente. Além disso, atualmente é possível para desenvolvedores de MetaMask Snaps como nós substituir um hash de transação a ser assinado por um malicioso, por isso gostaríamos de introduzir ou propor um mecanismo para evitar isso.

Você pode nos contar um pouco sobre você e sua equipe?

Nossa equipe está à frente de uma pequena startup — a a42 — no Japão e em Singapura. A a42 está desenvolvendo uma fechadura inteligente Web3 chamada "wΞlock", que permite autenticação com contratos inteligentes, incluindo NFT e ENS: https://a42.io/w3lock. Em 2022, participamos de vários hackathons para aprender novas tecnologias como o MetaMask Snaps.

Hideyoshi Moriya (piyo.eth): Hideyoshi vem experimentando e desenvolvendo aplicativos baseados em Ethereum desde 2017. Ele desenvolveu um projeto colaborativo de arte NFT chamado "Pixereum" em 2017. Trabalhou no Google como especialista técnico de produtos e fundou sua empresa "a42" em 2019. Na a42, ele desenvolve dapps que funcionam no mundo real. Atualmente, está desenvolvendo uma fechadura inteligente Web3 "wΞlock" que pode ser aberta por ENS/NFT, com base na prova de conceito que desenvolveu em 2021: https://twitter.com/hm0429/status/1465241679800111107

Hiroyuki Tachibana (tachibana.eth): Hiroyuki é cofundador e engenheiro na a42. Ele liderou um projeto para construir um módulo de autenticação blockchain para dispositivos IoT, o "w3a.io", e recebeu uma bolsa da Ethereum Foundation. Conquistou vários prêmios em hackathons da ETHGlobal ao longo de 2022. Atualmente, está desenvolvendo uma solução de privacidade zkp para o produto de fechadura inteligente Web3.

Yusuke Moriya (yskmyskm.eth): Yusuke é designer na a42. Trabalhou como artista de CG/VFX em diversas produções audiovisuais e atuou em projetos que vão de grandes marcas globais a videoclipes de pequena escala. Possui 12 anos de experiência na indústria cinematográfica e é especializado em expressões abstratas utilizando computação gráfica. Também atuou como diretor de fotografia e diretor de documentários.

Que oportunidades você enxerga com o MetaMask Snaps e as possibilidades que ele abre para o espaço Web3?

Acreditamos que o MetaMask Snaps tornará as tecnologias Web3 mais complexas mais acessíveis tanto para desenvolvedores quanto para usuários, e ajudará significativamente as aplicações Web tradicionais a se integrarem com a Web3. Estamos tão animados em criar MetaMask Snaps quanto estávamos quando a primeira loja de aplicativos mobile surgiu. Encorajamos você a experimentar e transformar suas ideias em realidade!

Algum conselho que você gostaria de compartilhar com desenvolvedores interessados em experimentar o MetaMask Snaps?

Recomendamos começar com o template do MetaMask Snaps (https://github.com/MetaMask/template-snap-monorepo) e modificá-lo primeiro.

Dica: Você pode estar se perguntando como obter o objeto ethereum injetado. O objeto wallet é equivalente a ele.

Desenvolvendo com MetaMask Snaps

Para começar com o MetaMask Snaps:

1. Consulte a documentação para desenvolvedores

2. Instale o MetaMask Flask

3. Confira um guia do MetaMask Snaps

4. Fique conectado conosco no Twitter, nas discussões do GitHub e no Discord

Fique de olho na nossa equipe no próximo hackathon perto de você! Bom BUIDLing ⚒️

Aviso legal: Os MetaMask Snaps são geralmente desenvolvidos por terceiros que não a Consensys Software. O uso de MetaMask Snaps desenvolvidos por terceiros é feito a seu próprio critério e risco, com o entendimento de que você será o único responsável por qualquer perda ou dano resultante de tais atividades. A Consensys não oferece nenhuma garantia expressa ou implícita, seja verbal ou escrita, em relação a MetaMask Snaps desenvolvidos por terceiros e se isenta de toda responsabilidade por Snaps desenvolvidos por terceiros. O uso de softwares relacionados a blockchain envolve riscos, e você os assume integralmente ao utilizar o MetaMask Snaps.