TTMSFNCWebBrowser PDF Viewing Problem

FNC TMS FNC Core
1

Most of the time PDF's are displayed correctly in the FNCWebBrowser.
However not always.
I have an example PDF which shows the problem.
I tried to upload the PDF, but sadly it was too big (over 6MB).

So I've sent it by email.
Hopefully it did arrive.

2

Just wondering if the size of the PDF could be an issue.
Have tried with other test PDF's and 1.5MB seems to give troubles as well.
PDF 1.5MB.pdf (1.6 MB)

3

Hi,

Is this Windows? As I couldn't see an issue here

image
image962×766 108 KB

4

Yes.
That's how the PDF looks that I've sent per email. :+1:
Great.

Could it be my "WebView2Loader_x86.dll" is outdated?
This is the version I have at the moment:
image

5

And yes, I'm running/testing under Windows 10.

6

It could be possible that the DLLs are outdated.

EdgeDLLs.zip (125.4 KB)

Can you check with these ones?

7

Thx Pieter.
These DLL's are newer than mine.
What's the best way to keep these files up-to-date?

My application still doesn't show the PDF correctly.
But probably I'm doing something wrong there.
I have made a dedicated component which has the TTMSFNCWebBrowser as a sub-component.
I load the PDF following your guidelines from another ticket.

    html := '<body style="margin: 0px; padding: 0px;">' + '<iframe frameborder="0" scrolling="no" height="100%" width="100%" src="data:application/pdf;base64,' + ABase64 + '">' + '</iframe></body>';
    FViewer.LoadHTML(html);

If I try to load the PDF from file in a simple test-program it actually loads OK.

8

Hi,

TMS FNC Core deploys the updated DLLs xith each release, you can check those in the source folder/Edge Support

About the PDF, as the PDF is converted to base64 I suppose the string is too long to actually be meaningful and therefore the browser cannot load it, if you press F12 when the browser has focused you can check if there are errors. We’ll check here as well and see if there is a workaround for larger PDF files in memory.

9

Hi,

We have further investigated this here. There seems to be a limit on the amount of data the browser can handle via base64 encoding, so we have researched this and came up with a different solution. The sample loads a PDF from a file in memory, so this part can be replaced with your stream coming from another source

unit USample;

interface

uses
  System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,
  FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs,
  FMX.TMSFNCTypes, FMX.TMSFNCUtils, FMX.TMSFNCGraphics, FMX.TMSFNCGraphicsTypes,
  FMX.TMSFNCCustomControl, FMX.TMSFNCWebBrowser, FMX.Controls.Presentation,
  FMX.StdCtrls;

type
  TForm29 = class(TForm)
    TMSFNCWebBrowser1: TTMSFNCWebBrowser;
    Button1: TButton;
    procedure Button1Click(Sender: TObject);
    procedure FormCreate(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
  end;

var
  Form29: TForm29;

implementation

{$R *.fmx}

const
  LB = #13#10;

procedure TForm29.Button1Click(Sender: TObject);
var
  p: string;
  ms: TMemoryStream;
  s: string;
begin
  ms := TMemoryStream.Create;
  try
    s := 'setPDFData("%s");';
    ms.LoadFromFile('//PATH TO PDF');
    p := TTMSFNCUtils.SaveStreamToBase64(ms);
    TMSFNCWebBrowser1.ExecuteJavaScript(Format(s, [p]));
  finally
    ms.Free;
  end;
end;

procedure TForm29.FormCreate(Sender: TObject);
var
  h: string;
begin
  h := '<script>' + LB +
         'function base64ToBlob(base64, type = "application/octet-stream") {' + LB +
         '   const binStr = atob(base64);' + LB +
         '   const len = binStr.length;' + LB +
         '   const arr = new Uint8Array(len);' + LB +
         '   for (let i = 0; i < len; i++) {' + LB +
         '     arr[i] = binStr.charCodeAt(i);' + LB +
         '   }' + LB +
         '   return new Blob([arr], { type: type });' + LB +
         '}' + LB +

         'function setPDFData(data){' + LB +
         '  const blob = base64ToBlob(data, ''application/pdf'');' + LB +
         '  const url = URL.createObjectURL(blob);' + LB +
         '  var p = document.getElementById("myPDF");' + LB +
         '  p.src = url;' + LB +
         '}' + LB +
         '</script>' + LB;

  h := h + '<iframe id="myPDF" width="100%" height="100%"/>';
  TMSFNCWebBrowser1.LoadHTML(h);
end;

end.
10

This is amazing Pieter.
Thx again for the lightning fast reponse and solution.
I will definitely give this a try next week.

1 Like