Can't get valid signatures for signMessage for web3-provider

I can’t get a verifiable signature when I use web3 provider like ethers, direct usage of connector works fine.

This works (with direct connector usage): https://codesandbox.io/s/unruffled-benz-9ubn6?file=/src/App.vue

This doesn’t work: https://codesandbox.io/s/gallant-banach-z7svg?file=/src/App.vue the same code works for direct MetaMask usage as a browser extension.

I was also testing with wrappers like:

const rawMessageLength = new Blob([rawMessage]).size
let message = ethers.utils.toUtf8Bytes("\x19Ethereum Signed Message:\n" + rawMessageLength + rawMessage)
message = ethers.utils.keccak256(message)

They don’t help as well.

This topic was also discussed here: https://stackoverflow.com/questions/63793873/sign-and-verifiy-message-on-ethereum-using-wallet-connect-not-working/63817084#63817084

[Xaber20110202]

The method below you can try, and you can see the full raw message (not hex) on the client side

import { Signer, utils, providers } from 'ethers'

const signMessageAsync = async (signer: Signer, address: string, message: string): Promise<string> => {
  const messageBytes = utils.toUtf8Bytes(message)
  if (signer instanceof providers.JsonRpcSigner) {
    try {
      const signature = await signer.provider.send('personal_sign', [
        utils.hexlify(messageBytes),
        address.toLowerCase()
      ])
      return signature
    } catch (e) {
      if (e.message.includes('personal_sign')) {
        return await signer.signMessage(messageBytes)
      }
      throw e
    }
  } else {
    return await signer.signMessage(messageBytes)
  }
}

reference from zkSync

1. change message string to Utf8Bytes
   1. zkSync utils getSignedBytesFromMessage call
   2. zkSync utils getSignedBytesFromMessage
2. use provider to send personal_sign call
   1. zkSync utils signMessagePersonalAPI call
   2. zkSync utils signMessagePersonalAPI

[pakokrew]

Here’s my workaround that works for window.ethereum and wallet connect, with ethers:

async function signMessage(provider: ethers.providers.Web3Provider, rawMessage: string) {
  if(provider.provider instanceof WalletConnectProvider) {
    const rawMessageLength = new Blob([rawMessage]).size
    const message = ethers.utils.toUtf8Bytes("\x19Ethereum Signed Message:\n" + rawMessageLength + rawMessage)
    const signer = provider.getSigner();
    const address = await signer.getAddress();
    const keccakMessage = ethers.utils.keccak256(message);

    const wc = provider.provider as WalletConnectProvider;
    const signature = await wc.connector.signMessage([
      address.toLowerCase(),
      keccakMessage,
    ]);
    return signature;
  } else {
    const signer = provider.getSigner();
    return await signer.signMessage(rawMessage);
  }
}