Next.js - How to Get Data From Sanity Using SWR

I am trying to fetch data from Sanity through a dynamic route in Next.js using SWR.This is the error I get even though the

projectId

is present in my configs

what do you get if you

console.log(options)

on L9?

huh - yeah, hard to say what’s going on here without a bit more context. Do you have a reproducible case or a repo you could point me to?

Yes I do. Here is the PR I’m working on. The Homepage works fine. The issue comes when you navigate to dynamic pages with slugs.

Updated link

I suspect it tries to do a client-side fetch in the browser where it can’t access the env-variables. https://github.com/inezabonte/car-rental-site/blob/create-car-page/lib/sanity.js#L3-L8
Try using the

NEXT_PUBLIC_

naming convention to get them in bundled in and accessible on the client side. The

projectId

and

dataset

is considered public because they make up the endpoint URLs for your APIs anyways, https://nextjs.org/docs/basic-features/environment-variables#exposing-environment-variables-to-the-browser

No longer getting the projectId error but I get this CORS error when the request is made

yes, you need to add the domain to your CORS origins settings
should probably do it for the preview URLs. I don’t think you need to allow for authenticated requests in this case.

You can also set it up in sanity.io/manage

How comes it doesn’t block the homepage as well since it’s also getting data from Sanity

I’d guess it’s because the first render happens server side? Next.js can be a bit confusing because it switches between doing server and client-side requests on navigation

Adding the CORS setting fixed it. Thanks

I was able to add localhost to the cors. Adding the deployed one with wildcard seems to be an issue

Ok? What happens if you try?

I’m not able to add the URL it gives me this error. I’ve also tried the urls from the docs example they have the same issue when wildcard is added

It works now. Issue was coming from Firefox. I refreshed the browser and was able to add it