palantir-foundryfoundry-slate

How can I add an image into a Slate code sandbox?


I am not able to reference a URL pointing to an image stored within Foundry within the code sandbox. While the following works in the HTML widget, it does not work in the code sandbox:

<img src="https://<stack-name>.com/blobster/api/salt/<resource-id>" 
    alt="" width="200" height="200">

Picture of Issue


Solution

  • To use the tag within the code sandbox you will have to encode your image using base64. The resulting data URL can be decoded by the code sandbox and the image will be displayed. You can read more on data URLs and base64 here. To encode your image into base64 you can use any tool in the internet that lets you upload an image and returns a valid data url.

    Example data url: Picture in code sandbox