fail to connect wallet in mobile device

[wrapupc]

here is my code

  <button @click="aaa">aaa</button>

 async function aaa () {
      const provider = new WalletConnectProvider({
        infuraId: "27e484dcd9e3efcfd25a83a78777cdf1",
      });

      //  Enable session (triggers QR Code modal)
      await provider.enable();
    }

i copied the js code from the docs, but it worked partly correctly. correct situation: 1.scan the QRcode wrong situation: 1.open the website on mobile phone browser, and click imToken to build connection. There are 3 types of prompt: (1). Missing or invalid topic field (2). regenerate new QRcode and retry(This prompt occured after prompt 1, whether or not i re-clicked the 'aaa' button, and then clicked the imToken icon again) (3). No connection.(This prompt occured after prompt 2, if I got back to browser and did not re-click the 'aaa' button and clicked the imToken icon agian)

Another strange thing is: If I open the html on my PC browser with http://localhost:8080, the QRcode works fine, and I can successfully connect to my phone wallet via it. But if I open the html on my PC browser with http://my-PCServer-LAN-IP:8080, the QRcode fails to function. And the console prints

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'importKey')
    at browserImportKey (browser.ts?92cd:44:1)
    at browserAesEncrypt (browser.ts?92cd:59:1)
    at Module.aesCbcEncrypt (aes.ts?2e5c:8:1)
    at Module.encrypt (index.ts?6744:49:1)
    at async WalletConnect._encrypt (index.ts?6744:1172:1)
    at async WalletConnect._sendRequest (index.ts?6744:790:1)

Weird thing happens here, if I open the Html on my iPhone and iPad browser, the QRcode works properly. (Ive tried both safari and chrome)

Now, I dont have a clue what cause the problem, my code or I didnt use https or something else.

[ivanhdzd]

I think that the error is launched when you don't run your app in a domain without SSL (HTTPS), for testing purposes this error isn't launched in your localhost.

[wrapupc]

Thx that makes sense to me

[finessevanes]

Is this still an issue?

[smonn]

I've run into this just now when using a custom local domain setup in the hosts file, e.g.:

127.0.0.1        app.internal

And then open http://app.internal:3000 in my browser.

browser.js?81dd:21 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'importKey')
    at browserImportKey (browser.js?81dd:21:31)
    at browserAesEncrypt (browser.js?81dd:25:1)
    at Module.aesCbcEncrypt (aes.js?e388:3:29)
    at Module.encrypt (index.js?f02f:30:30)
    at async WalletConnect._encrypt (index.js?8502:855:1)
    at async WalletConnect._sendRequest (index.js?8502:558:1)

FWIW, we're using https://www.npmjs.com/package/@perawallet/connect (which in turn relies on Wallet Connect).

[glitch-txs]

I’m closing this issue because it has been inactive for a few months.

Please reopen if you still encounter this issue with the latest version :)