Android端Trust Wallet签名消息无响应问题排查求助

问题描述 #

我遇到一个仅在Android端Trust Wallet中出现的签名异常：dApp的消息签名操作，仅在Android设备的Trust Wallet上执行签名/拒绝后，页面无任何后续事件响应；Metamask等其他钱包及iOS端Trust Wallet均能正常触发成功/错误事件。

使用技术栈 #

• vite.js构建Demo
• React开发dApp
• web3modal实现钱包连接
• wagmi管理React Hooks
• 多台不同型号、系统版本的Android/iOS设备
• Trust Wallet
• Metamask

复现步骤 #

1. 在桌面浏览器打开Demo网站
2. 点击“Connect Wallet”
3. 使用Android设备上的Trust Wallet扫描二维码完成连接
4. 点击Demo中的任意“sign”按钮
5. 页面日志会显示“mutate”（wagmi触发的签名调用事件）
6. 在钱包中签名或拒绝消息后，页面无任何后续事件响应

注意：偶尔多次尝试后会触发成功事件，建议先断开再重新连接以复现问题。iOS设备或其他钱包（如Metamask）执行相同操作时，成功事件会正常触发。Demo是按照WalletConnect官方文档实现的。

代码片段 #

Wagmi与WalletConnect配置代码 #

import React, { useEffect, useState } from 'react';
import { EthereumClient, w3mConnectors, w3mProvider } from '@web3modal/ethereum';
import { Web3Modal } from '@web3modal/react';
import { configureChains, createClient, WagmiConfig } from 'wagmi';
import { bsc } from 'wagmi/chains';
import { publicProvider } from 'wagmi/providers/public';

const chains = [bsc];
const projectId = import.meta.env.VITE_WALLET_CONNECT_KEY || '';

// Wagmi provider
const { provider } = configureChains(chains, [
    publicProvider({
        stallTimeout: 1000,
    }),
    w3mProvider({ projectId }),
]);

// Wagmi client
const wagmiClient = createClient({
    autoConnect: true,
    connectors: w3mConnectors({ projectId, version: 1, chains }),
    provider,
});

// Web3Modal Ethereum Client
const ethereumClient = new EthereumClient(wagmiClient, chains);

export function WalletProvider({ children }) {
    return <>
        <WagmiConfig client={wagmiClient}>
            {children}
        </WagmiConfig>

        <Web3Modal projectId={projectId} ethereumClient={ethereumClient} themeMode="dark" />
    </>;
}

Demo核心代码 #

import React, { useState, useEffect } from 'react';
import { Web3Button } from '@web3modal/react';
import { useSignMessage } from 'wagmi';
import { signMessage } from '@wagmi/core';

export default function App() {
    ...

    const wagmiSign = useSignMessage({
        onSuccess(...args) {
            log('sign SYNC success:', ...args);
        },
        onError(...args) {
            log('sign SYNC error:', ...args);
        },
        onMutate(...args) {
            log('sign mutate:', ...args);
        },
        onSettled(...args) {
            log('sign settled:', ...args);
        },
    });

    const signMessageAsync = () => {
        wagmiSign.signMessageAsync({
            message: 'Custom async message',
        }).then((...args) => {
            log('sign ASYNC success:', ...args);
        }).catch((...args) => {
            log('sign ASYNC error:', ...args);
        });
    };

    const signMessageSync = () => {
        wagmiSign.signMessage({
            message: 'Custom sync message',
        });
    };

    ...

    return <>
        ...

        <h2>2. Try sign</h2>
        <div className="buttons">
            <button onClick={signMessageAsync}>Sign asynchronous</button>
            <button onClick={signMessageSync}>Sign synchronous</button>
            <button onClick={signMessageCore}>Sign through @wagmi/core</button>
        </div>

        ...
    </>;
}

疑问与求助 #

不确定问题出在wagmi（事件解析错误）、WalletConnect（DeepLink问题）还是Trust Wallet本身，希望找到原因以便联系开发者修复，若有类似问题的解决方案也请告知。

内容的提问来源于stack exchange，提问作者Patrik Krehák