How-To view images inside BC without downloading them

Take a look at our github repository to see how this is solved.

https://github.com/byndit/BeyondAL

What do we want to achieve?

We would like to enter any specific url related to a picture or gif-file and see it directly in our page.

Let's build a small page and use it as an editor to enter the url:

page 50002 "BYD Editor"
{
    UsageCategory = None;
    Caption = 'Editor';
    PageType = Card;

    layout
    {
        area(content)
        {
            grid(Editor)
            {
                ShowCaption = false;
                field(EditorText; EditorText)
                {
                    ApplicationArea = All;
                    MultiLine = true;
                    ShowCaption = false;
                }
            }
        }
    }

    procedure GetText(): Text
    begin
        exit(EditorText);
    end;

    var
        EditorText: Text;
}

A small javascript control addin will help us to create an img element inside our html document.

function LoadFile(url) {
	var fileObject = document.getElementById("fileObject");
	if (fileObject) {
		placeholder.removeChild(fileObject);
	}

	fileObject = document.createElement("img");
	fileObject.id = "fileObject";
	fileObject.style.height = "auto";
	fileObject.style.width = "100%";
	fileObject.setAttribute("src", url);

	placeholder.appendChild(fileObject);
}

After this we will throw an inlined image (png), encoded in base64.

Give it a try and paste it into your browser:

data:image/png;base64,UklGRjoIAABXRUJQVlA4WAoAAAAYAAAAPAAAPAAAVlA4TFoHAAAvPAAPENXYtm3bdRNL///LVR7rQUdyuOl1kINNzrBhVjC+LsEiZ5lDhARItk27umdfxLbzbdu2bdu2bSO2bdu2bdvJfdgT4P+aAHQXbLXItiH2bB+kHq7dHuhxqIdMYT9vcCaKNDJJIRQ3NsoyIu5z1X... (abgekürzt)

It's pretty simple, isn't it?

So let's:

1. Paste the url into our new editor,
2. throw a request,
3. convert the response into base64,
4. and generate an inlined image encoded in base64.
5. Our control addin will show it in a separate page.

procedure ViewImagefromURL()
var
    Base64Convert: Codeunit "Base64 Convert";
    BYDViewer: Page "BYD Viewer";
    BYDEditor: Page "BYD Editor";
    Instr: InStream;
    Base64: Text;
    Url: Text;
begin
    Clear(BYDEditor);
    BYDEditor.LookupMode := true;
    if BYDEditor.RunModal() <> Action::LookupOK then
        exit;
    Url := BYDEditor.GetText();
    BYDWebRequestMgt.ResponseAsInStr(Instr, BYDWebRequestMgt.PerformWebRequest(Url, Enum::"BYD Web Request Method"::GET));
    Base64 := Base64Convert.ToBase64(Instr);

    Clear(BYDViewer);
    BYDViewer.SetVariables(url, Base64);
    BYDViewer.Run();
end;

Have fun!