web
You’re offline. This is a read only version of the page.
close
Skip to main content
Community site session details

Community site session details

Session Id :
Dynamics 365 Community / Forums / Small and medium business | Business Central, N... / how to display image f...
Small and medium business | Business Central, N...
Suggested answer

how to display image from the call http:/picture/pictureContent into an img element

(1) ShareShare
ReportReport
Posted on by Prem A Nair 37
Hi,
I need to display the Item image on the screen. I am using the following call
 

https://api.businesscentral.dynamics.com/v2.0/<bla>/Production/api/v2.0/companies(bla)/items(bla)/picture/pictureContent 

 

I am getting back the image. But i am not sure of the image format (blob or b64 or binary etc). I need to display the image in an HTML img element.

 

New to BC. Pls help !

Thanks in advance

Prem

 

Categories:
Dynamics 365 Business Central
I have the same question (0)
  • Suggested answer
    YUN ZHU Profile Picture
    YUN ZHU 91,078 Super User 2025 Season 2 on at
    how to display image from the call http:/picture/pictureContent into an img element
    Hi, hope the following can give you some hints.
     
    Thanks.
    ZHU
  • Gerardo Rentería García Profile Picture
    Gerardo Rentería Ga... 23,269 Most Valuable Professional on at
    how to display image from the call http:/picture/pictureContent into an img element
  • PhillipsB Profile Picture
    PhillipsB 102 on at
    how to display image from the call http:/picture/pictureContent into an img element
    Hi, 
    To display the image in <img> tag, try using JavaScript to get the image data with fetch. Convert the response to a blob and set it directly as the src for the <img> element.
     
    For example
    fetch("https://api.businesscentral.dynamics.com/v2.0/.../picture/pictureContent")
      .then(response => response.blob())
      .then(blob => {
          const url = URL.createObjectURL(blob);
          document.getElementById("yourImgElementId").src = url;
      })
      .catch(error => console.error("Error loading image:", error));
     
    This could work for most binary images returned by the API. If it’s already in base64 format, set it directly as the src
    html
    <img id="yourImgElementId" src="data:image/jpeg;base64, yourBase64String" />
     
    Hope it helps 

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

News and Announcements

Join experts in person to explore low code and AI agents at the Power Platform Community Conference sponsored by Microsoft
Our Community Code of Conduct has been updated!

Quick Links

Responsible AI policies

As AI tools become more common, we’re introducing a Responsible AI Use…

Andrés Arias – Community Spotlight

We are honored to recognize Andrés Arias as our Community Spotlight honoree for…

Congratulations to the August Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Small and medium business | Business Central, NAV, RMS

#1
Sumit Singh Profile Picture

Sumit Singh 3,165

#2
Sohail Ahmed Profile Picture

Sohail Ahmed 2,682 Super User 2025 Season 2

#3
Nimsara Jayathilaka. Profile Picture

Nimsara Jayathilaka. 2,299

Last 30 days Overall leaderboard

Featured topics

Product updates

Dynamics 365 release plans