next js image url retrival became a little tricky. can anyone suggest the retrieval process / url . i am new to strapi and nextjs.
Hello! The way to solve this issue is by including the URL of the Strapi Server to your img source.
Like this:
src={`http://localhost:1337${Pages.images.formats.thumbnail.url}`
Hope that helps
looks like i am with the CardMedia
component with MUI 5 but it should not be a show stopper for this but it did not work in my way. next-sanity had some url retrieval function what is wrong now in my case.
Is it only the image that is troubling you, other objects are returned successfully?
Check if the data returned from the Pages object is not empty, or returns null. You might find that the issue is not how you access the object values
JSON.stringify(Pages, null, 2)
This is a very weird behaviour
Perhaps its an MUI problem. Do check the docs to make sure you used the image component correctly: Image list React component - Material UI
you are recommending ImageList
while I am using CardMedia
which is widely used for video and images for carousel and video libraries etc. React Card component - Material UI
I just need to know the right method of syntax from the strapi for the url of images.
Hi, did you tackle this problem am facing the same??
I recommend to use ‘?’ because not always have the next information inside a object. In this case I would use Pages?.images?.formats?.thumbnail?.url, because the error indicate that inside formats not have nothing. Do you understand?