New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
"Could not detect network" error on Next.js 14 API endpoint with JsonRpcProvider
#4469
Comments
Just got the same issue on my side. Viem worked, but of course .. that isn't very assuring. Instead, I added v6 to my project using npm package aliasing which works. |
👋 Hello, I'm also encountering the same issue when upgrading from Next.js 13 to 14 with Ethers 5.7.2. I want to add my voice to highlight its impact. If there are any updates or workarounds, I'd greatly appreciate it. Thanks! |
Just got bitten by this in production via a silent failure by a dependency (itself using Ethers). Manifested as a promise that never resolved and resulted in a lot of user confusion until we arrived at the root cause! |
@dsimmons Are you using v5 or v6? In v6, you can detect this error using If connecting to a static network, specifying that network will also skip this problem. You will likely still get an error, but it will be something you can trap using try…catch on the calls. This isn’t generally trappable because it happens in the constructor, and we don’t have async constructors. :( |
I do encounter the same issue... I think no provider are working anymore with next 14 and to complete this thread, I will add that AlchemyProvider is also failing which i think is linked. The error is totally different ('Referrer "client" is not a valid URL') but I put the stacktrace here if it can help to find and solve the problem:
|
here's a simple example of a server method: export async function GET() {
const provider = new ethers.providers.JsonRpcProvider(`https://polygon-mumbai.infura.io/v3/${process.env.INFURA_API_KEY}`);
const price = await provider.getGasPrice();
return NextResponse.json({ message: 'we are live.' });
} throws an error
using ethers 5.7.2 |
@tazous Yoir error seems unrelated. The contract you are calling returned There can be other reasons you get this, but those are the most common. |
@freeslugs can you verify using I see this type of problem often, which is that the dotenv (or such) is not being configured in the environment correctly, which results in the URL becoming malformed. |
@ricmoo And to go further in that direction, after upgrading to ethers v6+ (with all the migration implied), my same code is finally working fine on nextjs 14... I think all this points to a compatibility issue between ethers 5.7 and nextjs 14 |
Yah it works. My solution was to switch to viem. API is relatively similar :) const provider = createPublicClient({
chain: polygonMumbai,
transport: http(`https://polygon-mumbai.infura.io/v3/${process.env.INFURA_API_KEY}`),
}); |
@tazous Thanks for the info! Glad to hear NextJS 14 works fine with v6. If you figure out any extra info on why v5 is affected, let me know as I am planning a small number of changes to port back to v5. :) |
I'm affected by this as well. next@14 leads to the no network error w/ ethers5 when called serverside in app/api/**/*.ts |
@mrbasado Can you provide any additional details? Can someone provide me a minimal NextJS 14 and ethers v5 reproduction steps? Like possibly a single page app? |
Try mine :) #4469 (comment) |
@ricmoo Thank you for looking. here is a quick demo: https://github.com/mrbasado/next14-ethers5 |
@ricmoo We are still impacted by this issue. let me know if you need any clarification on the example - hopefully the readme covers it! |
If you have a direct access to new JsonRpcProvider({
fetchOptions: {
referrer: "https://myapp.xyz",
},
url: 'rpcurl'
})
new JsonRpcProvider({
skipFetchSetup: true,
url: 'rpcurl'
}) The related code is here: https://github.com/ethers-io/ethers.js/blob/v5.7.2/packages/web/lib.esm/geturl.js#L22 |
Happened to me as well setting the referrer seems to be the solution. Thanks to @MichaelBorde |
This error only occurs using nextjs14 but not nextjs13 page route, despite ethers.js version. |
Ether v6 has more issues like [TypeError: Cannot read properties of undefined (reading 'JsonRpcProvider')](https://ethereum.stackexchange.com/questions/144451/typeerror-cannot-read-properties-of-undefined-reading-jsonrpcprovider) How do you manage that with nextjs 14? I tried to run it with nextjs13 with AppDir, still the same error. It only works in server side. |
Ethers Version
5.7.2
Search Terms
NETWORK_ERROR, next 14, JsonRpcProvider, next api endpoint
Describe the Problem
Issue:
I am encountering what I think is a compatibility issue between Next.js 14 and
ethers@5.7.2
. When attempting to instantiate aJsonRpcProvider
on an API endpoint, I consistently receive acould not detect network
error.Steps to Reproduce:
Expected Behavior:
The
JsonRpcProvider
should be successfully instantiated without any "could not detect network" errors.Actual Behavior:
Encountering a "could not detect network" error when attempting to instantiate a JSONRPCProvider.
Additional Information:
Environment:
Note:
Any guidance or workaround to make ethers.js version 5.7.2, specifically with JSONRPCProvider, compatible with Next.js 14 would be highly appreciated.
Code Snippet
Contract ABI
Errors
Environment
Other (please specify)
Environment (Other)
NextJS 14
The text was updated successfully, but these errors were encountered: