Automatically adding to metamask custom blockchain via HTTP instead of HTTPS RPCs?

[JavierFerrerGomez]

I have a hardhat node hosted in an external domain to test our daps. I really like the Rainbowkit feature that adds the blockchain to Metamask if the chain is not already configured. The problem I have is that it doesn't seem to work with my setup because we are serving via http instead of https.

export const devnet: Chain = {
    id: 12345,
    name: 'Dev Node',
    network: 'hardhat',
    nativeCurrency: {
        decimals: 18,
        name: 'Ethereum',
        symbol: 'ETH',
    },
    rpcUrls: {
        public: { http: ['http://mydomain:20666'], },
        default: { http: ['http://mydomain:20666'] },
    },
    testnet: true
}
const { chains, publicClient } = configureChains([devnet, polygon], [publicProvider()])

If I try to connect to Metamask with this code it will throw the error:

inpage.js:1 MetaMask - RPC Error: Expected an array with at least one valid string HTTPS url 'rpcUrls', Received: http://mydomain:20666

I understand the reason why this is default behavior, but there is a way to explicitly tell Rainbowkit (or viem) to allow an external http conection? If I configure Metamask manually everything works as expected.

RainbowKit version: 1.0.2
Viem version: 1.0.7
Wagmi: 1.4.7

Thanks in advance!

[magiziz]

@JavierFerrerGomez Are you able to add a network manually and then use the RainbowKit + Wagmi ? This seems to be something that's controlled by Viem and Wagmi for how they add chains into the wallet.

Feel free to follow metamask's docs here: https://docs.metamask.io/wallet/how-to/get-started-building/run-devnet/

Let me know if it doesn't work 👍

[JavierFerrerGomez]

Yes, as I mentioned in the OP, if I add the network manually in Metamask, RainbowKit/Wagmi will connect to it with the standard UI flow and use it without a problem. The error only happens when using RainbowKit UI to add it.

This is not a problem when I am testing by myself, but it becomes a greater problem when we give our app to an external QA group (we have to explain them how to do it, and also at that point they are not testing the real flow of the app :P)

As you mentioned that you are using Wagmi/Viem to add the config to the wallet, I will experiment with those to see if I find out why this is happening.

Thanks for you answer! :)

[magiziz]

I'll look into this and see why it's not working usually it might be the wagmi / viem switch functionality, but i'll take a look once again 🙏