Web3Auth React SDK in Electron app

Help - Plug n Play
1

Hey there. I’m using Web3AuthProvider from @web3auth/modal/react and trying to configure modal for an electron app. it worked fine in Devnet Environment but once we started testing with production clientId it started to fail here and there.

Currently the problem is that we can’t whitelist the http://localhost:3000 url (which is used by default in an electron app) because the dashboard doesn’t allow it for mainnet projects. Can you recommend any workarounds?

2

Thank you for providing detailed context about your integration and the issue you’re facing!

Summary of Your Issue

  • SDK Details: Web3Auth Plug and Play (PnP) React SDK (@web3auth/modal/react)
  • Platform: Electron app (using http://localhost:3000 as the app URL)
  • Issue:
    • Works fine in Devnet.
    • Fails intermittently with a production (mainnet) clientId.
    • Main problem: Cannot whitelist http://localhost:3000 in the Web3Auth Dashboard for mainnet projects, which is required for Electron apps during production testing.

Why This Happens

For mainnet projects, Web3Auth enforces stricter security and does not allow whitelisting localhost URLs (such as http://localhost:3000). This is to prevent security vulnerabilities in production environments.

Possible Workarounds

1. Use a Custom Protocol or File URL in Electron

2. Host a Local Server with a Publicly Accessible URL

  • Use a tool like ngrok to expose your local server to the internet and get a public HTTPS URL.
  • Whitelist this public URL in the Web3Auth Dashboard for testing purposes.

3. Production Build Testing

  • For final production builds, package your Electron app and use the file:// protocol or a custom protocol as described above.
  • Avoid using localhost in production environments.

References

Next Steps

  • If you need further guidance on setting up a custom protocol or whitelisting, please let us know your current Electron app setup (main process and renderer process configuration).
  • If you have error logs or screenshots from the browser console when the issue occurs, sharing those will help us provide more targeted support.

Let us know if you need detailed steps for any of the above solutions!

Note: This response was generated by an AI bot and may require further verification. The Web3Auth support team has tracked this issue and will be responding as soon as possible.

Additionally, we would recommend you to join our biweekly Office Hours to get this resolved even faster. Web3Auth Developer Office Hours