Блог

Я пытаюсь подписывать и проверять сообщения с помощью wallet connect для моего DAPP. До сих пор я пытался использовать ethers и web3 для переноса WalletConnect, а на своем мобильном устройстве я использую приложения metamask и trust wallet. Пока ни один из подходов не работает.

 <template>
  <div id="app">
    <div>Steps:
      <br>Connect wallet (i used metamask mobile and trust wallet)
      <br>Once connected Sign the message
      <br>
      <br>Issues:
      <br>On metamask mobile wallet you receive a message to sign but nothing is sent back once signed
      <br>On Trust wallet the the signature is returned to the DAPP but it does not verifiy to the current account? Verification fails
      <br>
      <br>
    </div>
    <button @click="connectWallet">Connect wallet</button>

    <template v-if="coinbase">
      <div>Account: {{ coinbase }}</div>

      <button @click="sign">Sign</button>

      <div>Signature: {{ signature }}</div>

      <div>verified message: {{ verified }}</div>

      <div>verified2 message: {{ verified }}</div>

      <div>verificationMatch: {{ verificationMatch }}</div>
    </template>
  </div>
</template>

<script>
import { ethers } from "ethers";
import Web3 from "web3";
import WalletConnectProvider from "@walletconnect/web3-provider";

export default {
  name: "App",
  data: () => ({
    coinbase: "",
    web3: {},
    signer: {},
    verified: "",
    verified2: "",
    signature: ""
  }),

  computed: {
    verificationMatch() {
      // these should match
      return this.coinbase === this.verified;
    }
  },

  methods: {
    async connectWallet() {
      const walletConnectProvider = new WalletConnectProvider({
        infuraId: "3cd774e14cf34ff78167908f8377051c" // Required
        // qrcode: true
      });
      await walletConnectProvider.enable();
      this.web3 = new Web3(walletConnectProvider);
      this.coinbase = walletConnectProvider.wc.accounts[0];
      console.log(this.web3.eth.accounts[0]);
      // this.coinbase = await this.web3.eth.getAccounts()[0];
    },
    async sign() {
      var message = "Hello World";
      this.signature = await this.web3.eth.sign(message, this.coinbase);
      this.verified = ethers.utils.verifyMessage(message, this.signature);
      this.verified2 = this.web3.eth.accounts.recover(message, this.signature);
    }
  }
};
</script>

<style>
#app {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
  

Вы можете найти некоторые кодовые песочницы здесь

Эта ссылка предназначена для ethersjs https://codesandbox.io/s/peaceful-cdn-jtkvb?file=/src/App.vue

Эта ссылка, если для web3https://codesandbox.io/s/objective-franklin-gkr3s?file=/src/App.vue

Вместо вызова соединителя нижнего уровня, как описано @Vyacheslav, другим вариантом является прямой вызов personal_sign.

 // configure web3, e.g. with web3Modal or in your case WalletConnect
const web3 = await web3Modal.connect();

const provider = new providers.Web3Provider(web3);
const signer = provider.getSigner()
const address = await signer.getAddress();

let signedMessage;
if (web3.wc) {
    signedMessage = await provider.send(
        'personal_sign',
        [ ethers.utils.hexlify(ethers.utils.toUtf8Bytes(rawMessage)), address.toLowerCase() ]
    );
}
else { 
    signedMessage = await signer.signMessage(rawMessage)
}

const verified = ethers.utils.verifyMessage(rawMessage, signedMessage);
  

У меня такая же проблема для WalletConnectProvider , но она работает с вызовом низкоуровневого соединителя:

 var rawMessage = "Hello World";
var rawMessageLength = new Blob([rawMessage]).size
var message = ethers.utils.toUtf8Bytes("x19Ethereum Signed Message:n"   rawMessageLength   rawMessage)
message = ethers.utils.keccak256(message)
var params = [
    await this.signer.getAddress(),
    message
]
this.signature = await this.wc.connector.signMessage(params);
this.verified = ethers.utils.verifyMessage(rawMessage, this.signature);
  

this.wc является ли ссылка на walletConnectProvider