I’m struggling understanding why my React App fails to load the profile data from WalletConnectModal.
On first click on the Button which calls WalletConnect open function, i get the following error:
Uncaught (in promise) DOMException: Blocked a frame with origin “https://auroncrow.lol” from accessing a cross-origin frame.
at n (https://auroncrow.lol/Oracle/static/js/main.4937e244.js:2:1193661)
On the second click, the WalletConnectModal actually opens and lets me connect but then, i get a second error which is:
FetchUtil.ts:18
GET https://rpc.walletconnect.com/v1/profile/reverse/0x48b71fEF46CA40DB205573E42F2b50738638d220?projectId=43de5b6… 404 (Not Found)
In the error itself, there is my wallet address which shows that the connection is actually working (i can even get out the address using const { isConnected, address } = useWeb3ModalAccount();
But after the connection, every time i click again on the button, it opens the modal to connect again and not the one with profile data.
I do have different apps running on the same domain and all the others are properly working.
I’m using a template for this one which is : https://themeforest.net/item/aenft-nft-minting-or-collection-landing-page-html-template/39869044
It mush be the template for sure but i’m not getting why, i’m not using Express or any kind of server and the CORS error is supposed to be mostly server side, but, it cannot be WalletConntect’s server as it works on different apps.
Here’s my package.json:
{
"name": "aenft-react",
"version": "0.1.0",
"homepage": ".",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@web3modal/ethers": "^4.2.1",
"bootstrap": "^5.2.2",
"ethers": "^6.12.1",
"html-react-parser": "^3.0.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-parallax": "^3.5.1",
"react-router-dom": "^6.4.3",
"react-scripts": "5.0.1",
"react-scroll": "^1.8.8",
"react-slick": "^0.29.0",
"sass": "^1.77.2",
"slick-carousel": "^1.8.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@iconify/react": "^4.0.0"
}
}
Have anyone faced a similar issue?
Shaiya Arcania is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.