skip to Main Content

I’m working on a movie recommendations web app, but I’m having trouble getting images from the backend to display on the frontend. When I directly use the image path, like this:

<img src={http://localhost:8000/images/Jailer.jpg} alt={item.movieName} />
I can see the image of "Jailer" from the backend. But when I comment that line out and instead use item.movieImage, like this:

<img src={http://localhost:8000/images/${item.movieImage}} alt={item.movieName} />
the image doesn’t render. In the tag, I’m seeing "Jailer.jpeg", so I know the image path is correct. I’ve tried to debug this, but I can’t figure out why it’s not working. Could you please help me out?

I don’t know to do can anyone help me guys?

2

Answers


  1. It may be due to the difference in the extension of your photo in the url
    One is jpg, the other is jpeg

    Login or Signup to reply.
  2. The problem lies here , if you are checking locally then give the image path in your directory something like <img src= {"C:UsersShaankDesktopError_ImagesExcel File JS.png"}>. Note the filepath should be rendered dynamically since it is provided by backend. In this example we are just statically defining path.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search