[SalesForce] How to display images in lightning web component using relative path

Mine images are stored in Documents directory in my org… Now we are getting JSON where image path to display images in templates is:

../servlet/servlet.ImageServer?id=015B00009501oiDIWE&&docName=ZAEOADBEAb29b973fee074578a1b7ab35d1d3b4c6&&oid=00DB0000000TaziMAC

Now images path showing in browser with:

https://avnesh-dev-ed.lightning.force.com/lightning/servlet/servlet.ImageServer?id=015B00009501oiDIWE&&docName=ZAEOADBEAb29b973fee074578a1b7ab35d1d3b4c6&&oid=00DB0000000TaziMAC

<img 
    if:true={item.imgSrc}
    class="img-item"
    src={item.imgSrc}
    alt={item.value} 
    title={item.value} />

means appending url:

https://avnesh-dev-ed.lightning.force.com/lightning

which is current url path(in browser for lwc)

but not displaying as image at all.

But if I am not using lightning web component, then image path coming with:

https:///avnesh-dev-ed--ashakya-lwc.visualforce.com

where ashakya-lwc is namespace of my org. working fine. I can see images in browser.

So is there something i need to enable for lwc or is there a way to change url for lwc.

Please suggest for the same.

Best Answer

Finally got solution for this:

Lightning web component not expecting /lightning/ in url for image, so working url:

https://avnesh-dev-ed.lightning.force.com/servlet/servlet.ImageServer?id=015B00009501oiDIWE&&docName=ZAEOADBEAb29b973fee074578a1b7ab35d1d3b4c6&&oid=00DB0000000TaziMAC

I have changed my image text url from JSON(Removed '..') for lighting web component with

/servlet/servlet.ImageServer?id=015B00009501oiDIWE&&docName=ZAEOADBEAb29b973fee074578a1b7ab35d1d3b4c6&&oid=00DB0000000TaziMAC

Related Topic