I am looking to set up the Alchemy JSON Provider in a Next.js application.
The Alchemy URL, along with the key, is stored inside env.local as follows:
ALCHEMY_URL=https://polygon-mumbai.g.alchemy.com/v2/myAlchemyKey
page: /nft
const alchemyUrl = process.env.ALCHEMY_URL
console.log("** ethersAlchemyProvider **")
const ethersAlchemyProvider = new
ethers.providers.JsonRpcProvider(alchemyUrl)
// console.log(ALCHEMY_URL)
//console.log(ethersAlchemyProvider)
If initializing the ethers provider in Next.js is not possible, could you please provide guidance on how to set it up server-side and pass it as a prop to the /nft page? Here is my attempted solution:
export async function getServerSideProps() {
var ethers = require('ethers')
// initialize alchemy provider here
const ethersAlchemyProvider = new ethers.providers.JsonRpcProvider(process.env.ALCHEMY_URL)
// Pass data to the page via props
return { props: { ethersAlchemyProvider } }
}
However, I encountered this error when trying to implement it:
https://i.sstatic.net/KDLR6.png
In essence, my goal is to set up the ethers provider using the Alchemy key from env.local.
I am utilizing "next": "12.0.10"