BugUnhandled Runtime Error Error: could not detect network (event="noNetwork", code=NETWORK_ERROR, version=providers/5.5.3) Report Title

[Rohan-Kar]

Ethers Version

5.0.0

Search Terms

No response

Describe the Problem

Code Snippet

// import Head from 'next/head'
// import Image from 'next/image'
import { ethers } from 'ethers'
import { useEffect , useState } from 'react'
import axios from 'axios'
import Web3Model from "web3modal"
import styles from '../styles/Home.module.css'
import 'tailwindcss/tailwind.css'
import { nftaddress, nftmarketaddress } from '../config'
import NFT from '../artifacts/contracts/NFT.sol/NFT.json'
import Market from '../artifacts/contracts/NFTMarket.sol/NFTMarket.json'
export default function Home(){
  const [nfts, setNfts] = useState([])
  const [loadingState, setLoadingState] = useState('not-loaded')
  useEffect(() =>{
    loadNFTs()
  } , [])

  async function loadNFTs(){
    const provider = new ethers.providers.StaticJsonRpcProvider()
    const tokenContract = new ethers.Contract(nftaddress, NFT.abi, provider)
    const marketContract = new ethers.Contract(nftmarketaddress, Market.abi, provider)
    const data = await marketContract.fetchMarketItems()

    
    const items = await Promise.all(data.map(async i => {
      const tokenUri = await tokenContract.tokenURI(i.tokenId)
      const meta = await axios.get(tokenUri)
      let price = ethers.utils.formatUnits(i.price.toString(), 'ether')
      let item = {
        price,
        tokenId: i.tokenId.toNumber(),
        seller : i.seller,
        owner  : i.owner,
        image  : meta.data.image,
        name   : meta.data.name,
        description : meta.data.description,
      }
      return item
    }))
    setNfts(items)
    setLoadingState('loaded')
  }

  async function buyNft(nft) {
    const web3modal = new web3modal()
    const connection = await web3modal.connect()
    const provider = new ethers.providers.Web3Provider(connection)
    const signer = provider.getSigner()
    const contract = new ethers.Contract(nftmarketaddress, Market.abi, signer)

    const price = ethers.utils.parseUnits(nft.price.toString(), 'ether')
    const transaction =await contract.createMarketSale(nftaddress, nft.tokenId,{
      value: price
    })
    await transaction.wait()
    loadNFTs()
  }

  if (loadingState === 'loaded' && !nfts.length) return (
    <h1 className="px-20 py-10 text-3xl">No items in the marrket place</h1>
  )

  return (
    <div className="flex justify-center">
      <div className="px-4" style={{ maxwidth: '1600px'}}>
      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 pt-4">
        {
          nfts.map((nft, i) => (
              <div key={i} className='border shadow rounded-xl overflow-hidden'>
              <img src={nft.image} />
              <div className="p-4">
                <p style={{ height: '64' }} className="text-2xl front-semibold">{nft.name}</p>
                <div style={{ height: '70px' , overflow: 'hidden'}}>
                  <p className="text-gray-400">{nft.description}</p>
                  </div>
              </div> 
              <div className="p-4 bg-black" >
                <p className="text-2xl mb4 front-bold text-white">{nft.price} Matic</p>
                <button className="w-full bg-pink-500 text-white font-bold py-2 px-12
                rounded" onClick={() => buyNft(nft)}>Buy</button>
              </div>
              </div>
          ))
        }
      </div>
      </div>
    </div>
  )
}

Contract ABI

No response

Errors

No response

Environment

No response

Environment (Other)

No response

[ricmoo]

Your issue is incomplete and you should make sure to include more information as a summary. You also haven’t specified what terms your searched for before opening the issue.

Have you followed all the react native instructions?

[Rohan-Kar]

#1430 I have try this method and change my JsonRpcProvider to staticJsonRpcProvider after that i am getting this error. and i am using infura services polygon Mumbai network .
`require("@nomiclabs/hardhat-waffle");

// This is a sample Hardhat task. To learn how to create your own go to
// https://hardhat.org/guides/create-task.html

// You need to export an object to set up your config
// Go to https://hardhat.org/config/ to learn more

/**

• @type import('hardhat/config').HardhatUserConfig
  */
  const fs = require("fs")
  const privateKey = fs.readFileSync(".secret").toString()
  const projectID = "f29b9880b0f24c88a5b94c9546d5fb79"

module.exports = {
networks: {
hardhat:{
chainId: 1337
},
mumbai: {
url: https://polygon-mumbai.infura.io/v3/${projectID},
accounts:[]
},
mainnet: {
url: https://polygon-mainnet.infura.io/v3/${projectID},
accounts:[]
}
},
solidity: "0.8.4",
};
`