https://api.web3modal.org/getAnalyticsConfig and https://api.web3modal.org/getWallets 403

[jianglijie]

I tested the functionality of the SDK on localhost and initially used it normally. However, after debugging for a while, I found that both interfaces returned 403 and clicking connect bution would no longer display any wallets. Is this because of something? What do I need to do to continue using it

[epsjunior]

You must change url value to "http://localhost:port"

[grimelion]

@epsjunior

Same error here. I tried setting directly localhost with port and with window.location.origin

Here's the code sample:

import React, { useEffect } from 'react';
import WebFont from 'webfontloader';
import { UserProvider } from './context/userContext';

import AppRoutes from './AppRoutes';
// import { WCprovider } from './context/wcContext';

import { createWeb3Modal } from '@web3modal/wagmi/react'
import { defaultWagmiConfig } from '@web3modal/wagmi/react/config'
import { arbitrum, bsc, mainnet, polygon } from 'viem/chains';
import { WagmiProvider } from 'wagmi';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'

const queryClient = new QueryClient()

const projectId = 'PROJECT_ID';
const metadata = {
  name: 'Platform',
  description: 'AppKit Example',
  url: window.location.origin,
  icons: ['https://avatars.githubusercontent.com/u/37784886']
}

const chains = [mainnet, arbitrum, polygon, bsc] as const
const config = defaultWagmiConfig({
  chains,
  projectId,
  metadata,
})

createWeb3Modal({
  metadata,
  wagmiConfig: config,
  projectId,
})


const App = () => {
  useEffect(() => {
    WebFont.load({
      google: {
        families: ['Work Sans:400,500,600,700', 'Chilanka'],
      },
    });
  }, []);

  return (
    <div className="App">
      <WagmiProvider config={config}>
        <QueryClientProvider client={queryClient}>
          <UserProvider>
            <AppRoutes />
          </UserProvider>
        </QueryClientProvider>
      </WagmiProvider>
    </div>
  );
};

export default App;

[epsjunior]

Do you need to use WalletConnect? I published a lottery website without using it and it's working really good.

http://github.com/epsjunior/lottery/
https://lottery-nine-iota.vercel.app/lottery

And if you want to know about the program:

https://medium.com/@edinaldo-jr/beyond-simple-tutorials-building-a-lottery-game-on-solana-blockchain-with-anchor-and-rust-7c3d5fe3963a

If you need to use WalletConnect I can help you in the next week, because I'm busy rn.

[grimelion]

My entire project is tailored for this, so unfortunately, using something third-party is not an option for me.

I believe that there is some stupid error with data mismatch, but I can't figure out where exactly.

[epsjunior]

Do you have a public GitHub repository for your project? I can help you on next week

Just to clarify, the lottery app I coded is built using the recommended wallet implementation from Solana’s official documentation, so it’s not third-party

[grimelion]

It turned out (I think) that WC has some kind of conflict with react-scripts. So I decided to rewrite the project in Vite to solve the problem