MetaMask - RPC Error: Internal JSON-RPC error

[harendra-shakya]

I was implementing buying function in nft marketplaace. But when I am buying I am getting this metamask error

MetaMask - RPC Error: Internal JSON-RPC error. 
{code: -32603, message: 'Internal JSON-RPC error.', data: {…}}
code: -32603
data:
code: 3
data: "0x817ce9f100000000000000000000000038d71e104520a91c7b89b2e8cd9688af411dcb1600000000000000000000000000000000000000000000000000000000000000030000000000000000000000000000000000000000000000003782dace9d900000"
message: "execution reverted"
[[Prototype]]: Object
message: "Internal JSON-RPC error."
[[Prototype]]: Object

I am using Polygon mumbai testnet. NFT price is 4 MATIC. I have tried reseting my account, removing metamask and adding the extension again but it didn't worked. What am I missing?? Please lemme me know what I am doing wrong.

And here is my code

import { useState, useEffect } from "react";
import { useWeb3Contract, useMoralis } from "react-moralis";
import nftMarketplaceAbi from "../constants/NftMarketplace.json";
import nftAbi from "../constants/BasicNft.json";
import Image from "next/image";
import { Card, useNotification } from "web3uikit";
import { ethers } from "ethers";
import UpdateListingModal from "../components/UpdateListingModal";

const truncatString = (fullStr) => {
    if (fullStr.length <= 10) return fullStr;

    const firstStr = fullStr.slice(0, 6);
    const endStr = fullStr.slice(-7, -1);
    const str = `${firstStr}....${endStr}`;
    return str;
};

export default function NFTBox({ price, nftAddress, tokenId, marketplaceAddress, seller }) {
    const { isWeb3Enabled, account } = useMoralis();
    const [imageURI, setImageURI] = useState("");
    const [tokenName, setTokenName] = useState("");
    const [tokenDescription, setTokenDescription] = useState("");
    const [showModal, setShowModal] = useState(false);
    const hideModal = () => setShowModal(false);
    const dispatch = useNotification();

    const { runContractFunction: getTokenURI } = useWeb3Contract({
        abi: nftAbi,
        contractAddress: nftAddress,
        functionName: "tokenURI",
        params: {
            tokenId: tokenId,
        },
    });

    const { runContractFunction: buyItem } = useWeb3Contract({
        abi: nftMarketplaceAbi,
        contractAddress: marketplaceAddress,
        functionName: "buyItem",
        params: {
            nftAddress: nftAddress,
            tokenId: tokenId,
        },
    });

    async function updateUI() {
        const tokenURI = await getTokenURI();
        console.log(`Token URI is ${tokenURI}`);
        if (tokenURI) {
            const requestURL = tokenURI.replace("ipfs://", "https://ipfs.io/ipfs/");
            const tokenURIResponse = await (await fetch(requestURL)).json();
            const imageURI = tokenURIResponse.image;
            const imageURIURL = imageURI.replace("ipfs://", "https://ipfs.io/ipfs/");
            setImageURI(imageURIURL);
            setTokenName(tokenURIResponse.name);
            setTokenDescription(tokenURIResponse.description);
        }
    }

    // console.log("isWeb3Enabled", isWeb3Enabled);

    useEffect(() => {
        if (isWeb3Enabled) {
            console.log("updating UI");
            updateUI();
        }
    }, [isWeb3Enabled]);

    const isOwnedByUser = seller === account || seller === undefined;
    const formattedSellerAddress = isOwnedByUser ? "you" : truncatString(seller || "");

    function handleCardClick() {
        isOwnedByUser
            ? setShowModal(true)
            : buyItem({
                  onError: (err) => console.error(err),
                  onSuccess: handleBuyItemSuccess,
              });
    }

    const handleBuyItemSuccess = async (tx) => {
        await tx.wait(1);
        dispatch({
            title: "success",
            message: "Item bought!",
            title: "Item Bought",
            position: "topR",
        });
    };

    return (
        <div>
            <div>
                {imageURI ? (
                    <div className="p-4">
                        <UpdateListingModal
                            isVisible={showModal}
                            tokenId={tokenId}
                            marketplaceAddress={marketplaceAddress}
                            nftAddress={nftAddress}
                            onClose={hideModal}
                        />
                        <Card
                            title={tokenName}
                            description={tokenDescription}
                            onClick={handleCardClick}
                        >
                            <div className="p-2">
                                <div className="flex flex-col items-end gap-2">
                                    <div>#{tokenId}</div>
                                    <div className="italic text-sn">
                                        Owned by {formattedSellerAddress}
                                    </div>
                                    <Image
                                        loader={() => imageURI}
                                        src={imageURI}
                                        height="200"
                                        width="200"
                                    />
                                    <div className="font-bold">
                                        {ethers.utils.formatUnits(price, "ether")} MATIC
                                    </div>
                                </div>
                            </div>
                        </Card>
                    </div>
                ) : (
                    <div>Loading....</div>
                )}
            </div>
        </div>
    );
}

[mattjaf]

looks like an error when your interacting with the contract

[harendra-shakya]

I don't think, it's working when I'm running this script

const { ethers, network } = require("hardhat");
const { moveBlocks } = require("../utils/move-blocks");

const PRICE = ethers.utils.parseEther("0.1");

async function mintAndList() {
    const nftMarketplace = await ethers.getContract("NftMarketplace");
    const randomNumber = Math.floor(Math.random() * 2);
    let basicNft;
    if (randomNumber == 1000) {
        basicNft = await ethers.getContract("BasicNftTwo");
    } else {
        basicNft = await ethers.getContract("BasicNft");
    }
    console.log("Minting NFT...");
    const mintTx = await basicNft.mintNft();
    const mintTxReceipt = await mintTx.wait(1);
    const tokenId = mintTxReceipt.events[0].args.tokenId;
    console.log("Approving NFT...");
    const approvalTx = await basicNft.approve(nftMarketplace.address, tokenId);
    await approvalTx.wait(1);
    console.log("Listing NFT...");
    const tx = await nftMarketplace.listItem(basicNft.address, tokenId, PRICE);
    await tx.wait(1);
    console.log("NFT Listed!");
    if (network.config.chainId == 31337) {
        await moveBlocks(2, (sleepAmount = 1000));
    }
}

mintAndList()
    .then(() => process.exit(0))
    .catch(error => {
        console.error(error);
        process.exit(1);
    });

[harendra-shakya]

Bro idk what's happening. If I'm minting with poygon mumbai then I'm unable to buy with mumbai testnet but I can buy it from ropsten or any other network. WTF?? And also if I'm mint with ropsten then I'm unable to buy with ropsten testnet but I can but with other testnet. And also images only show when you login with network connected with cloud so people will have to login from other network and buy from another. What is happening?

[PatrickAlphaC]

Use a different polygon endpoint. The public ones are not good.

[harendra-shakya]

I'm using alchemy. Which one should I use then?

[PatrickAlphaC]

Oh weird.... Alchemy is usually very good. Could you try with Moralis or Infura?