How to load a image with absolute path in react.js

Question

In my react-app I want to load images with an absolute path. I get the path as a string from an api response. So its not possible to put image folder in the src oder public folder. I read several stackoverflow-question but nothing helped so far. The path I'm getting looks like this

"\\SRMS508\Dokumente\1\Artikel\Art.Nr 100085\100085_CIMG7224.JPG"

And neither this:

<img src="\\SRMS508\\Dokumente\1\Artikel\Art.Nr 100085\100085_CIMG7224.JPG"/>

not this:

<img src={require("\\SRMS508\\Dokumente\1\Artikel\Art.Nr 100085\100085_CIMG7224.JPG").default} />

is working.

And I would be very happy if anyone could help me with this.

you need to set path relative from where you are rendering

user15786743
– user15786743

2022-02-03 10:22:58 +00:00
Commented Feb 3, 2022 at 10:22 — user15786743
– user15786743, Commented Feb 3, 2022 at 10:22

Varun Sukheja · Accepted Answer · 2022-02-03 10:24:03Z

2

If you keep your images in the public folder where we keep all static assets like images then we can access them as:

Folder: public/images/

<img src="/images/logo.png" />

answered Feb 3, 2022 at 10:24

Varun Sukheja

6,6748 gold badges67 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

pratibimbam Over a year ago

Thats the problem. I can't keep the images in the public folder.

Varun Sukheja Over a year ago

then If you use svg you can import as component where relate path can work but it won't work for jpg

Collectives™ on Stack Overflow

How to load a image with absolute path in react.js

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related