How to embed Delphi VCL form into HTML page using NPAPI?

Question

There are known ways of writing ActiveX plugins with Delphi, but the ActiveX itself poses a lot of limitations in browsers other than IE. So I was thinking - how to compile a plugin in NPAPI format, natively compatible with Chrome/Firefox?

Intent of the plugin is to allow to embed a VCL form into the HTML page and be able to bi-directionaly communicate with this form using JavaScript. E.g. clicking a button on a form would call JavaScript function on the page, and JavaScript functions on the page could send events to a VCL form. How this can be achieved?

Featherstone

And of course it is documented: developer.mozilla.org/en-US/Add-ons/Plugins – Plumber

@DavidHeffernan: Please take a look at the answer and tell me where linked documentation has that information including working wrapper code. – Featherstone

Perhaps I don't understand the question. You are asking for a library recommendation? That's off-topic as I'm sure you know. – Plumber

Let me try to explain: I was quested with writing a plugin for Chrome - there are two possible options, ActiveX (through 3rd party ActiveX plugin) and NPAPI plugin. ActiveX from Delphi is pretty straightforward, but NPAPI is not - I spent a good half a day Googling for solutions. Even SO had very little info on that matter. So I decided to share working solution I have found with others. Too bad it can't be expressed in simple instructions - it involves a 92kb of wrapping code. Please tell me, does that renders the question and answer off-topic? – Featherstone

I think so. You are asking for a library recommendation. According to the powers that be, that is off-topic. – Plumber

Similar question: #8863128 – Featherstone

There are many question on SO approaching and crossing this blurry line. I'm asking about how to do it, with a library or without. I will gladly accept any answer that will solve the case without a "library" - e.g. Delphi > File > New > DLL Projects > "New NPAPI Project". – Featherstone

You'd accept an answer that pointed you to the Add Ons SDK? – Plumber

Please be aware that both Firefox and Chrome will make most plugins click-to-play soon. Chrome has also already announced their intent to drop NPAPI. I can't recommend to start new projects based on NPAPI now. – Larisa

Answer 1

There's a list of existing NPAPI wrappers for Delphi at Mozilla bugtracker: https://www.mozdev.org/bugs/show_bug.cgi?id=8708

The latest entry (NPAPI plugin framework with scripting support + demo by Yury Sidorov) offers exactly what is needed.

With that VCL Form project can be compiled into a DLL compatible with NPAPI. Manifest.json also needs to be added. Afterwards the plugin can be installed into Chrome like usual.

Following HTML code embeds the VCL form that is stored in the plugin:

<EMBED id="embed1" TYPE="application/x-delphi-demo-plugin" ALIGN=CENTER WIDTH=400 HEIGHT=300>

<script>
var embed1 = document.getElementById('embed1');
</script>

<input type=button value="Show Value" onclick='alert("Value=" + embed1.value);'>

And that is how Form can change the HTML page around it:

with Plugin.GetBrowserWindowObject do
  GetObject('document')['bgColor'] := clRed;

P.S. The only fix that should be applied for modern Delphi versions - change string and PChar to AnsiString and PAnsiChar throughout the NPPlugin.pas. Or else communication with embedded form is broken.

Featherstone

Are you sure it should be AnsiString? That implies a limitation to ANSI characters. I would have expected Unicode support with UTF-8 encoding. In fact looking at the library that you have linked to it seems clear that UTF-8 is the lingua franca, but that the library fails to recognise that. It would need a deal of work to fix it. – Plumber

Indeed UTF-8 would be a proper solution, but for now AnsiString does the job by making the example code working (even with ANSI limitation). The big thing here is that VCL form communicating with JS in a browser. – Featherstone

@DelphiStudent: Maybe you should ask a separate question. As of now it is unclear. – Featherstone

i asked question about it here is the url #29062265 – Foamy

@Krom Stren have you figure any way to read html param tag using this frame work ? – Foamy