Akıllı Hesap Oturumu Snap: Oyun Dapp Otomatik Onayları

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

Akıllı Hesap Oturumları

Snap Deposu: https://github.com/livingrockrises/snap-auto-approvals

Neden geliştirdiniz?

Oyun dapp'leri için güvenli bir şekilde otomatik onay sağlayarak kesintisiz bir kullanıcı deneyimi oluşturmak amacıyla.

Teknik uygulamayı bize anlatabilir misiniz?

Uygulama

Snap'imiz iki bölümden oluşmaktadır. Birincisi, kullanıcıların etkileşime girdiği bir web sitesidir. İkincisi ise Snap'in kendisidir. Bu iki unsur, istemci-sunucu mimarisine benzer bir şekilde çalışır; Snap sunucu, web sitesi ise istemci rolünü üstlenir.

Web sitesinin kullanıcı akışı şu şekildedir:

1. EOA'nızı bağlayın ve Smart Account Session Snap'i yükleyin.

2. MetaMask adresi üzerinde Akıllı Hesabı etkinleştirin. MetaMask EOA, bu Akıllı Hesabın denetleyicisi olacaktır.

3. Akıllı Hesabınızda Oturum Modülünü etkinleştirin. Modüller, Smart Safe hesabınız için ek erişim denetimi mantığı sağlar. Temelde her Akıllı Hesap iki yolla kontrol edilir: MetaMask hesap sahibi kendi imzalayıcı anahtarlarını kullanarak ve kendi özel erişim mantığına sahip isteğe bağlı modüller aracılığıyla.

4. Bir oturum oluşturun.

5. Bu işlem, akıllı hesabınızda modül aracılığıyla cüzdanınızda işlem yapmaya yetkili geçici oturum anahtarları oluşturur. Oturum; startTime, endTime ve Dapp sözleşmelerindeki özel işlemler için İzinler gibi parametrelere sahip olabilir.

6. Gaz veya imzalar için MetaMask açılır penceresi olmaksızın yukarıdaki oturum anahtarını kullanarak otomatik onaylı işlemler gönderin.

MetaMask API

MetaMask, kullanıcı tarafından izin verilmesi halinde MetaMask Snaps tarafından kullanılabilecek API çağrıları sağlar.

Bu durumda aşağıdakilerden yararlandık:

snap_manageState - MetaMask içinde şifrelenmiş veri depolamamıza olanak tanır. Örneğin, oluşturulan oturum anahtar çiftini saklamak için kullanıyoruz.

export type SessionKeyStorage = {
  owner: string;
  sessionKey: string;
  pk: string;
};

export const storeSessionInfo = async (data: SessionKeyStorage) => {
  await wallet.request({
    method: 'snap_manageState',
    params: ['update', data],
  });
};

export const clearSessionInfo = async () => {
  const result = await wallet.request({
    method: 'snap_manageState',
    params: ['clear'],
  });
  return result;
};

export const getSessionInfo = async () => {
  const result = await wallet.request({
    method: 'snap_manageState',
    params: ['get'],
  });
  return result;
};
Kopyala

snap_confirm - MetaMask içinde şifrelenmiş veri depolamamıza olanak tanır. Örneğin, oluşturulan hesapları saklamak için kullanıyoruz.

export const promptUser = async (
  prompt: string,
  description: string,
  content: string,
): Promise<boolean> => {
  const response: any = await wallet.request({
    method: 'snap_confirm',
    params: [
      {
        prompt,
        description,
        textAreaContent: content,
      },
    ],
  });
  console.log('Prompt user response', response);
  if (response) {
    return response;
  }
  return false;
};

promptUser(getMessage(origin),
            'Do you want to use Smart Account',
            `Your Smart Account Address is ${_smartAccount.address}`,
          ).then((approval) => {
            if (approval) {
              console.log('Sending smart acccount response ', _smartAccount);
              resolve({
                address: _smartAccount.address,
                owner: _smartAccount.owner,
              });
            } else {
              reject(new Error('EOA user'));
            }
          });
Kopyala

Snap, siteden wallet_invokeSnap aracılığıyla gönderilen gelen JSON-RPC isteklerini işleyecektir.

Yukarıdaki uygulama akışı için connect, enable_session_module, create_session ve interact gibi özel istek yöntemleri oluşturduk. Aşağıda bir örnek verilmiştir ve kod burada mevcuttur.

export const useSmartAccount = async () => {
  console.log('invoke Snap...');
  const smartAccountResponse: any = await window.ethereum.request({
    method: 'wallet_invokeSnap',
    params: [
      defaultSnapOrigin,
      {
        method: 'connect',
        params: [],
      },
    ],
  });
  return smartAccountResponse;
};
Kopyala

Oturum Anahtarı Modülü

Oturum anahtarlarıyla erişim denetimi kullanarak akıllı sözleşme cüzdanının işlevselliğini genişletmek amacıyla Gnosis safe tarzında bir modül yazdık.

Modül ve cüzdan sözleşmeleri için kod burada bulunabilir.

struct Session {
        address smartAccount;
        address sessionKey;
        uint256 startTimestamp;
        uint256 nonce;
        uint256 endTimestamp;
        bool enable;
        PermissionStorage permission;
    }

struct PermissionStorage {
        address[] whitelistDestinations;
        mapping(address => bool) whitelistDestinationMap;
        mapping(address => bytes4[]) whitelistMethods;
        mapping(address => mapping(bytes4 => bool)) whitelistMethodsMap;
        mapping(address => TokenApproval) tokenApprovals;
    }
Kopyala

Snap çağrılarak ve akıllı hesap devreye alınarak oturum oluşturulduğunda, aşağıdaki yöntem bir aktarıcı aracılığıyla Akıllı Hesaptan Oturum Anahtarı modülünde çağrılır.

function createSession(
        address sessionKey,
        PermissionParam[] calldata permissions,
        SessionParam calldata sessionParam
    ) external {
        require(
            !sessionMap[sessionKey].enable,
            "Session for key is already enabled"
        );
        Session storage _session = sessionMap[sessionKey];
        ...
Kopyala

txHash: https://goerli.etherscan.io/tx/0x8b45f4cb0a7527bb7c44f6923eb9bb391faa656e212829ce0fd9c733ca71352b

Oturum oluşturulduktan sonra, bir aktarıcı geçerli oturum anahtarı ve imzayla oturum anahtarı modülünde işlem başlatabilir.

function executeTransaction(
        address _sessionKey,
        address payable _to,
        uint256 _value,
        bytes calldata _data,
        bytes calldata signature
    ) external returns (bool success) {
        Session storage session = sessionMap[_sessionKey];
        require(session.enable, "Session is not active");
        require(
            session.startTimestamp <= block.timestamp,
            "Session has not yet started"
        );
        require(session.endTimestamp >= block.timestamp, "Session has expired");
        ...
Kopyala

txHash: https://goerli.etherscan.io/tx/0xf6d40bf9c74cff266f8bc26dabcf7a44ca1c0e85387f297f43fa5cb89bbea1a0

SDK

Biconomy SDK, geliştiricilerin akıllı hesaplardan yararlanması ve karmaşık çok adımlı kullanıcı deneyimlerini tek tıklamayla gerçekleştirilebilir basit deneyimlere dönüştürmesi için nihai Web3 paketidir.

Her kullanıcı, basit bir kriptografik anahtar çifti yerine bir akıllı sözleşme cüzdanı edinir; dApp'ler ise bu SC cüzdanı aracılığıyla işlem paketleri kullanarak kullanıcı için her türlü kesintisiz etkileşimi özelleştirebilir.

Aşağıdaki fonksiyonu, snap'i çağırarak 'connect' rpc çağrısıyla ilişkilendirdik.

import SmartAccount from '@biconomy-sdk/smart-account';

async function getsmartAccount(): Promise<SmartAccount> {
  smartAccount = new SmartAccount(wallet, {
    activeNetworkId: Number(wallet.chainId),
    // supportedNetworksIds: supportedChains,
  });

  smartAccount = await smartAccount.init();
  console.log('initialized');
  console.log(smartAccount);
  return smartAccount;
}
Kopyala

Bunu hayata geçirecek olsanız sonraki adımlar neler olurdu?

Keyring özelliğini ve MetaMask arayüzünde EOA'lar yerine akıllı hesap bilgilerini görüntüleme imkânını dört gözle bekliyoruz.

1. Geliştiricilerin kullanması için MetaMask Snaps ile uyumlu Biconomy SDK'yı yayımlayacağız.

2. Sosyal kurtarma modülü ve Akıllı Hesaplar kullanarak tek tıklamayla zincirler arası toplu işlemler ekleme ve hedef zincir işlemi gerçekleştirilir gerçekleştirilmez bildirim gösterme.

Kendiniz ve ekibiniz hakkında biraz bilgi verebilir misiniz?

Sachin, Biconomy'nin CTO'su ve Kurucu Ortağıdır. Bilgisayar bilimi geçmişiyle 6 yıl web2 ve 5 yıl web3 deneyimine sahiptir. Problem çözmeye yapılandırılmış bir yaklaşım benimsemeyi sever; fikirlerini hızla hayata geçirmek ve test etmek için bizzat çalışmaktan keyif alır.

Chirag, Biconomy'de bir blok zinciri mühendisidir. Programlamayı sever ve araştırma-geliştirme yoluyla web3 ile ilgili her şeyi öğrenmekten zevk alır.

MetaMask Snaps ile ilk ne zaman tanıştınız ve deneyiminiz nasıldı?

MetaMask Snaps hakkında ETHBogota hackathon'undan kısa süre önce öğrendik. Dokümantasyondan ve snap yöntemleri aracılığıyla sunulan yeteneklerden son derece etkilendik.

MetaMask Snaps'i diğer cüzdanlardan farklı kılan nedir?

MetaMask çekirdek ekibine bağımlı olmadan MetaMask cüzdanının özelliklerini genişletme ve daha hızlı büyümeyi mümkün kılma yeteneği. Geliştiriciler, JSON RPC çağrıları arayüzü ve depolama gibi MetaMask'ın mevcut özelliklerine erişebilir.

MetaMask ile MetaMask Snaps geliştirmek sizin ve ekibiniz için nasıl bir deneyim?

Temel geliştirme oldukça sezgiseldi; ancak belirli yöntemler için gerekli izin gereksinimlerini anlamak epey zaman aldı. Örneğin, EOA'larda olduğu gibi akıllı sözleşme cüzdanlarının bakiyesini görüntülemek amacıyla özel UI öğeleri oluşturma yeteneği şu an için oldukça karmaşık.

MetaMask Snaps sizin için ne ifade ediyor?

Ön uçlarına özel widget entegre etmek zorunda kalmadan veya dapp'lerin bunu yapmasına gerek kalmadan ERC4337 Akıllı Sözleşme cüzdanlarını MetaMask içinde desteklememizi sağlayan gizli bir silah.

MetaMask Snaps'in Web3 alanı için sunduğu fırsatlar ve açtığı olanaklar nelerdir?

Dapp'e özgü özelleştirilmiş MetaMask Snaps, daha iyi kullanıcı deneyimi sunabilir ve çok zincirli etkileşimleri mümkün kılabilir. Mevcut Web3 kullanıcı tabanının üzerine ücret soyutlama, hesap soyutlama ve cüzdan güvenliği yetenekleri eklemek.

MetaMask Snaps'i denemek isteyen geliştiricilere tavsiyeleriniz nelerdir?

Geliştirme sürecinizdeki pek çok engeli aşmanıza yardımcı olabilecek GitHub tartışmalarına ve Discord'a göz atın. JavaScript ve JSON RPC çağrılarına aşina olan herkes geliştirebilir. snap-monorepos ve örnek MetaMask Snaps, geliştirme sürecinizi hızlandırmak için iyi bir başlangıç noktasıdır.

Bir şey depolamak istiyorsanız yalnızca tek bir nesne saklanabilir; bu nedenle birden fazla anahtar-değer çiftini tek bir nesne içinde iç içe yerleştirebilirsiniz. Özel olarak çağrılan snap yöntemlerinden yanıt döndürmeniz gerektiğinde, bunun düz bir JSON nesnesi döndürdüğünden emin olun.

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 bakı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'ler ⚒️

Sorumluluk Reddi: MetaMask Snaps genellikle Consensys Software dışındaki üçüncü taraflarca geliştirilmektedir. Üçüncü taraflarca geliştirilen MetaMask Snaps'lerin kullanımı tamamen sizin 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 için sözlü veya yazılı, açık veya zımni hiçbir garanti vermez ve üçüncü taraflarca geliştirilen MetaMask Snaps için tüm sorumluluğu reddeder. Blok zinciri ile ilgili yazılımların kullanımı risk taşır ve MetaMask Snaps kullanımında bu riskleri tamamen üstlenmiş olursunuz.