Blockchain Uygulamalarına Mobil Cüzdan ile Bağlanma

Blockchain Uygulama Geliştirme yazı serisinde UI projesinde cüzdan olarak MetaMask'ı kullanmıştık. Uygulamayı kullanmak için tarayıcıda MetaMask'ın eklenti olarak kurulu olması gerekiyordu. MetaMask'ın aynı zamanda mobil uygulaması da var. Cüzdan ile iletişimi tarayıcı eklentisi yerine mobil ile sağlayabilir miyiz? Cevap evet sağlayabiliriz.

WalletConnect, cüzdanları blockchain uygulamalarına bağlamak için geliştirilmiş açık bir protokol. Blockchain uygulamalarımıza WalletConnect'i provider olarak ekliyoruz. Cüzdan ile bağlantı kur denildiğinde ekrana QR Code basıyor. Mobil uygulamamızdaki herhangi bir cüzdandan bu QR Code'u okuttuğumuzda Dapp ile mobil cüzdan arasında bağlantı kuruluyor.

Aşağıdaki komut ile provider'ı yüklüyoruz.

    npm i @walletconnect/web3-provider

Blockchain ağına bağlanmak için RPC URL belirtmemiz gerekli. RPC URL yerine standart haline gelmeye başlayan Infura da kullanılabilir. Yazı serimizde Infura'yı tercih etmiştik. Bu örnekte de Infura'yı tercih edeceğiz. Infura projesi oluşturmak için aşağıdaki yazıyı okuyabilirsiniz.

Provider konfigürasyonu aşağıdaki gibi yapılıyor. Sonra web3'e provider olarak veriliyor.

    import WalletConnectProvider from "@walletconnect/web3-provider"
import Web3 from "web3";

export default async () => {

    let web3

    const provider = new WalletConnectProvider({
        infuraId: 'INFURA_PROJECT_ID'
    });

    provider.on('accountsChanged', (accounts) => {

        console.log('Selected Account', accounts[0])
    })

    provider.on('disconnect', () => {

        console.log('Disconnected')
    })

    await provider.enable();

    web3 = new Web3(provider)

    return { web3 }
}

Test Link : https://blockchain-multiple-wallet.herokuapp.com/

Vuejs ile hazırladığım örnek projenin kaynak koduna Github'dan erişebilirsiniz.

Kolay gelsin.