AA Snap: Hesap Soyutlamayı Demokratikleştirme

MetaMask Snaps, MetaMask'ı dünyanın en genişletilebilir cüzdanı haline getirme yol haritasıdır. Geliştirici olarak, özelliklerinizi ve API'lerinizi MetaMask'a tamamen yeni yollarla sunabilirsiniz. Web3 geliştiricileri bu büyümenin özünü oluşturmaktadır ve bu seri, bugün inşa edilen yenilikçi MetaMask Snaps'leri tanıtmayı amaçlamaktadır.

AA Snap

Snap Deposu: https://github.com/a42io/AAsnap

Neden geliştirdiniz?

AA Snap, Account Abstraction'ı (AA) tüm geliştiriciler ve kullanıcılar için demokratikleştirmek amacıyla geliştirilmiştir. AA'nın gelecekte yaygın biçimde kullanılacağına inanıyoruz. Ancak şu an itibarıyla, geliştiricilerin bunu dapp'leriyle entegre etmesi ve kullanıcıların bu teknolojiyi kullanması oldukça zahmetlidir.

Geliştiriciler açısından bakıldığında, EOA'ya ek olarak AA'yı destekleyen ek kod yazmak gerekmektedir.

Kullanıcılar açısından ise MetaMask gibi alışık oldukları cüzdanları kullanamayıp AA'yı destekleyen başka bir cüzdan yüklemeleri gerekmektedir; bu da kötü bir kullanıcı deneyimine yol açmaktadır.

Bu nedenle, MetaMask Snaps'ten yararlanarak AA'yı entegre etmeyi ve kullanmayı kolaylaştırmak istedik.

Teknik uygulamayı bize anlatabilir misiniz?

AA Snap üç bileşenden oluşmaktadır: örnek bir frontend, MetaMask snap'i ve geçici bir sunucu. Snap, geliştiricilerin ve kullanıcıların bir AA cüzdanını (EIP-4337'yi destekleyen bir kontrat cüzdanı) çok kolay bir şekilde kullanmasını sağlar. Tam uygulama için lütfen depoya bakın.

Örnek Frontend

Örnek frontend, MetaMask tarafından sağlanan şablona dayanmaktadır. Geliştiricilerin AA Snap aracılığıyla AA'yı dapp'leriyle kolayca nasıl entegre edebileceğini göstermektedir.

Örneğin, AA cüzdanının bakiyesi aşağıdaki basit kodla alınabilir.

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

AA cüzdanından işlem göndermek için, aşağıdaki kodu bir alıcı adresi ve değer girerek yazmanız yeterlidir.

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

AA cüzdanını kullanıcı perspektifinden kullanmak ne kadar kolay? Burada deneyin: https://AAsn.app

Snap

Snap, aşağıdaki kodla bir AA örneği alır. AA'yı uygulamak için @account-abstraction/sdk npm paketini kullandık.

AA cüzdan adresi, kullanıcının EOA'sından deterministik olarak türetilebildiğinden herhangi bir kullanıcı girdisi gerekmemektedir.

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;
};
Kopyala

AA cüzdanından işlem göndermek için üç adım bulunmaktadır:

1. Snap, MetaMask içinde snap'in snap_confirm yöntemini kullanarak bir onay gösterir. Bu adım zorunlu değildir; ancak kullanıcıların imzalayacakları işlemin ayrıntılarını göremeyeceğinden daha iyi bir kullanıcı deneyimi için gereklidir.

2. Kod, AA cüzdanının bir kullanıcı işlemi oluşturur ve kullanıcı işleminin hash'ini imzalamasını talep eder. Bu süreç, EOA'dan bir işlem oluşturup imzalamakla neredeyse aynıdır.

3. İmzalanan kullanıcı işlemini sunucumuz aracılığıyla bir bundler'a gönderin.

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,
    });
};
Kopyala

Geçici Sunucu

Hackathon sürecinde, snap içinde sendUserOpToBundler yöntemini çağırırken bir hatayla karşılaştık. Sorunu derinlemesine incelemeye vaktimiz olmadığından, sorunu geçici olarak çözmek için bir sunucu oluşturmaya karar verdik. Geçici sunucu yalnızca imzalanan kullanıcı işlemini alıp bir bundler'a iletmektedir.

Hata büyük olasılıkla bağımlılıklardan kaynaklanmaktadır; zira MetaMask Snaps yürütme ortamında bazı kısıtlamalar mevcuttur. Geçici sunucunun şu belge izlenerek kaldırılabileceğini düşünüyoruz: Bağımlılıkları Düzeltme

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();
  }
});
Kopyala

Bunu uygulasaydınız sonraki adımlar ne olurdu?

Gereksiz sunucu tarafı kodunu kaldırıp snap'i tek başına çalıştırmak istiyoruz. Ayrıca şu an itibarıyla, bizim gibi MetaMask Snaps geliştiricilerinin imzalanacak işlem hash'ini kötü niyetli bir hash ile değiştirmesi mümkün olduğundan, bunu önleyecek bir mekanizma sunmak veya önermek istiyoruz.

Kendiniz ve ekibiniz hakkında biraz bilgi verebilir misiniz?

Ekibimiz, Japonya ve Singapur'da küçük bir girişim olan a42'yi yönetmektedir. a42, NFT ve ENS dahil olmak üzere akıllı sözleşmelerle kimlik doğrulamayı mümkün kılan bir Web3 akıllı kilit olan "wΞlock"u geliştirmektedir: https://a42.io/w3lock 2022 yılında, MetaMask Snaps gibi yeni teknolojileri öğrenmek için çeşitli hackathon'lara katıldık.

Hideyoshi Moriya (piyo.eth): Hideyoshi, 2017'den bu yana Ethereum tabanlı uygulamalar üzerinde deneyler yapıp geliştirmeler yapmaktadır. 2017'de "Pixereum" adlı ortak bir NFT sanat projesi geliştirdi. Google'da teknik ürün uzmanı olarak çalıştı ve 2019'da "a42" şirketini kurdu. a42'de gerçek dünyada işe yarayabilecek dapp'ler geliştirmektedir. Şu anda 2021'de geliştirdiği PoC'ye dayanan, ENS/NFT ile açılabilen bir Web3 akıllı kilidi "wΞlock"u geliştirmektedir: https://twitter.com/hm0429/status/1465241679800111107

Hiroyuki Tachibana (tachibana.eth): Hiroyuki, a42'nin kurucu ortağı ve mühendisidir. IoT cihazları için bir blockchain kimlik doğrulama modülü olan "w3a.io" projesine liderlik etti ve Ethereum Foundation'dan hibe aldı. 2022 boyunca ETHGlobal hackathon'larında çeşitli ödüller kazandı. Şu anda Web3 akıllı kilit ürünü için bir zkp gizlilik çözümü geliştirmektedir.

Yusuke Moriya (yskmyskm.eth): Yusuke, a42'de tasarımcı olarak görev yapmaktadır. Çeşitli video prodüksiyonlarında CG/VFX sanatçısı olarak çalıştı ve küçük ölçekli müzik videolarından küresel markalara kadar pek çok projede yer aldı. Film sektöründe 12 yıllık deneyime sahip olup bilgisayar grafikleri kullanarak soyut ifadeler oluşturma konusunda uzmanlaşmıştır. Aynı zamanda görüntü yönetmeni ve belgesel yönetmeni olarak da çalışmıştır.

MetaMask Snaps ve Web3 alanı için sunduğu olanaklar konusunda ne gibi fırsatlar görüyorsunuz?

MetaMask Snaps'in karmaşık Web3 teknolojilerini hem geliştiriciler hem de kullanıcılar için daha erişilebilir hale getireceğine ve geleneksel Web uygulamalarının Web3 ile entegrasyonuna önemli ölçüde katkı sağlayacağına inanıyoruz. MetaMask Snaps geliştirme konusundaki heyecanımız, ilk mobil uygulama mağazasının çıktığı zamanki kadar büyük. Sizi de denemekten çekinmemeye ve fikirlerinizi hayata geçirmeye davet ediyoruz!

MetaMask Snaps'i denemek isteyen geliştiricilere vermek istediğiniz tavsiyeler var mı?

MetaMask Snaps şablonuyla (https://github.com/MetaMask/template-snap-monorepo) başlayıp önce onu değiştirmenizi öneririz.

İpucu: Enjekte edilen ethereum nesnesini nasıl alacağınızı merak ediyor olabilirsiniz. wallet nesnesi bunun eşdeğeridir.

MetaMask Snaps ile Geliştirme

MetaMask Snaps'e başlamak için:

1. Geliştirici belgelerine göz atın

2. MetaMask Flask'ı yükleyin

3. Bir MetaMask Snaps kılavuzuna göz atın

4. Twitter, GitHub tartışmaları ve Discord üzerinden bizimle bağlantıda kalın

Size yakın bir yerde düzenlenecek bir sonraki hackathon'da ekibimizi takip edin! Mutlu BUIDLing ⚒️

Sorumluluk Reddi: MetaMask Snaps, genel olarak Consensys Software dışındaki üçüncü taraflarca geliştirilmektedir. Üçüncü taraflarca geliştirilen MetaMask Snaps'lerin kullanımı tamamen kendi takdirinize ve riskinize bağlıdır; bu tür faaliyetlerden doğabilecek herhangi bir kayıp veya zarardan yalnızca siz sorumlu olacaksınız. Consensys, üçüncü taraflarca geliştirilen MetaMask Snaps'ler için sözlü veya yazılı hiçbir açık ya da zımni garanti vermemekte ve üçüncü taraflarca geliştirilen Snaps'ler için tüm sorumlulukları reddetmektedir. Blockchain tabanlı yazılımların kullanımı risk barındırmaktadır ve MetaMask Snaps'i kullandığınızda bu riskleri tamamen kabul etmiş sayılırsınız.