delphi FMX.WebBrowser与H5交互JavaScript
作者:互联网
delphi FMX.WebBrowser与H5交互JavaScript
一、原理
1.1、前提条件(主要是针对MSWindows下对D10.4以下的TWebBrowser的支持,不过D10.4已解决了这个前提)
你所选用的JS库或JS代码本身是很好的兼容IE10及其以上
国内大厂和国外优质站点,一般在写Web代码时,都考虑了IE的兼容性问题。国内小厂,大多数的做得不好只考虑省事、少写了很多代码,引以为戒,你在发布自己的API时,一定要考虑浏览器内核的兼容性,不要学习国内这些小厂。
1.2、Delphi FMX.WebBrowser.pas
以下三种方式,一个目的,都是为了拿到接口ICustomBrowser :
1.2.1、直接放个TWebBrowser可视化控件来交互FMX界面
LWebBrowser :TWebBrowser;
1.2.2、动态产生客制化的TCustomWebBrowser非可视化控件来交互FMX界面
LWebBrowser :TCustomWebBrowser;
LWebBrowser.Create(AOwner: TComponent);
1.2.3、以FMX服务的方式IFMXWBService来交互FMX界面
1.2.3.1、这是FMX.WebBrowser.Android、FMX.WebBrowser.Cocoa及FMX.WebBrowser.Win分别为Android、IOS、MSWINDOWS下完美拿到TWebBrowser接口ICustomBrowser最好的方法
1.2.3.2、然后ICustomBrowser执行JS
ICustomBrowser. EvaluateJavaScript(const JavaScript: string); //:执行JS,但不回调执行的结果
1.2.3.4、ICustomBrowser执行JS并回调:
(1)、Android
在Android 4.4之后,WebView提供了一个新的2个执行JS的接口:
$(BDS)\source\rtl\android\
unit Androidapi.JNI.Webkit;
[JavaSignature('android/webkit/WebView')]
JWebView = interface(JAbsoluteLayout)
['{0001776D-86A0-43B3-A64C-C6FEA095AD91}']
procedure addJavascriptInterface(object_: JObject; name: JString); cdecl;
procedure evaluateJavascript(script: JString; resultCallback: JValueCallback); cdecl;
//...................以下为delphi FMX通过TAndroidWebBrowserService调用ICustomBrowser.EvaluateJavaScript(const JavaScript: string)的Android实现的内部方法:
//procedure loadUrl(url: JString; additionalHttpHeaders: JMap); cdecl; overload;
procedure loadUrl(url: JString); cdecl; overload;
//...................
《=========拿到JValueCallback :
$(BDS)\source\rtl\android\
unit Androidapi.JNI.Webkit;
JValueCallbackClass = interface(IJavaClass)
['{5CE4D0B0-6C4F-43BD-B57F-A06401A5FB2F}']
end;
[JavaSignature('android/webkit/ValueCallback')]
JValueCallback = interface(IJavaInstance)
['{3B24779A-3678-4AD8-B421-A8A9C6F3E742}']
procedure onReceiveValue(value: JObject); cdecl;
end;
TJValueCallback = class(TJavaGenericImport<JValueCallbackClass, JValueCallback>) end;
《=========拿到JWebView :
$(BDS)\source\rtl\android\
unit Androidapi.JNI.Webkit;
JWebViewClass = interface(JAbsoluteLayoutClass)
['{57C30F7F-F8C7-4C19-859E-073DC4DA4250}']
{class} function _GetRENDERER_PRIORITY_BOUND: Integer; cdecl;
{class} function _GetRENDERER_PRIORITY_IMPORTANT: Integer; cdecl;
{class} function _GetRENDERER_PRIORITY_WAIVED: Integer; cdecl;
{class} function _GetSCHEME_GEO: JString; cdecl;
{class} function _GetSCHEME_MAILTO: JString; cdecl;
{class} function _GetSCHEME_TEL: JString; cdecl;
{class} function init(context: JContext): JWebView; cdecl; overload;
//.............
$(BDS)\source\rtl\android\
unit Androidapi.JNI.Embarcadero;
JWebBrowserClass = interface(JWebViewClass)
['{C9D39057-C2B7-4264-8E58-52DE4CA5AE56}']
{class} function init(context: JContext): JWebBrowser; cdecl;
end;
[JavaSignature('com/embarcadero/firemonkey/webbrowser/WebBrowser')]
JWebBrowser = interface(JWebView)
['{21876269-EEA5-4130-BE15-F23BEB8ECA69}']
procedure SetWebViewListener(listener: JOnWebViewListener); cdecl;
end;
TJWebBrowser = class(TJavaGenericImport<JWebBrowserClass, JWebBrowser>) end;
JWebClientClass = interface(JWebViewClientClass)
['{424BCB34-24B0-4A4B-830B-D396C3667344}']
{class} function init: JWebClient; cdecl;
end;
最新的D10.4对应的Android SDK,Delphi为我们实现的API接口的基础知识:
delphi的类及其接口 和JAVA的类及其接口
delphi导入java类的方法:
方法一、原生方法导入:
//这是1个用于较易声明Java的泛型对象工厂的通用类。在这个模型中,我们划分为两个接口:类方法接口(第1个参数)和实例方法接口(第2个参数)。这个类将此2个接口融合到该工厂类中,可以产生Java的实例对象,或提供代表单线程实例的Java类的参照:
$(BDS)\source\rtl\android\
unit Androidapi.JNIBridge;
/// A generic class that we use to make the declaration of Java
/// object factories easier. In our model, we split the class methods
/// and instance methods into two interfaces. This class blends the
/// two interfaces into one factory that can produce instances of Java
/// objects, or provide a reference to a singleton instance representing
/// the Java class.
//这是1个用于较易声明Java的泛型对象工厂的通用类。在它的模型中,我们将参数划分为两个接口:类方法接口(第1个参数)和实例方法接口(第2个参数)。这个类将此2个接口融合到该工厂类中,可以产生Java的实例对象,或提供代表单线程实例的Java类的参照:
TJavaGenericImport<C: IJavaClass; T: IJavaInstance> = class
方法二、用EMB的代理接口导入DefaultProxyInterfaceName = 'com/embarcadero/rtl/ProxyInterface'; :
$(BDS)\source\rtl\android\
unit Androidapi.JNIBridge;
TJInterfacedObject = class(TInterfacedObject)
procedure AfterConstruction; override;
procedure BeforeDestruction; override;
end;
TJavaLocal = class abstract (TJInterfacedObject, ILocalObject, IJava)
const
DefaultProxyInterfaceName = 'com/embarcadero/rtl/ProxyInterface';
(1)、IOS
(3)、MSWindows
1.2.3.4、事件中处理页面的回调
在这些事件中处理页面的回调:
property OnDidStartLoad: TWebBrowserDidStartLoad read GetOnDidStartLoad write SetOnDidStartLoad;
property OnDidFinishLoad: TWebBrowserDidFinishLoad read GetOnDidFinishLoad write SetOnDidFinishLoad;
property OnShouldStartLoadWithRequest: TWebBrowserShouldStartLoadWithRequest read GetOnShouldStartLoadWithRequest
write SetOnShouldStartLoadWithRequest;
property OnDidFailLoadWithError: TWebBrowserDidFailLoadWithError read GetOnDidFailLoadWithError
write SetOnDidFailLoadWithError;
页面回调BaseUrl,拿到回调结果字符串Content:
接口ICustomBrowser :
procedure LoadFromStrings(const Content: string; const BaseUrl: string);
扩展的接口:
ICustomBrowserEx = interface(IInterface)
['{5F61E8E6-54B5-4305-88DD-C7F8086352FF}']
procedure LoadFromStrings(const Content: string; const ContentEncoding: TEncoding; const BaseUrl: string);
end;
1.2.3.5、D10.4对TEdgeBrowser的支持及其新增TWebBrowser通过SelectedEngine 来选择使用老的 IE 核心还是新的 Edge 核心,完美支持在MSWINDOWS下H5的各种性能
1.3、。。。。。写累了,明儿继续
二、应用
2.1、腾讯开源H5图形图形处理库AlloyImage
前端-纯前端实现人脸识别-提取-合成:https://cloud.tencent.com/developer/article/1408454
腾讯开源H5图形图形处理库:https://github.com/AlloyTeam/AlloyImage
Delphi FMX.WebBrowser.pas就能很好的跨平台交互js:
procedure EvaluateJavaScript(const JavaScript: string);
《图片处理不用愁,给你十个小帮手》https://cloud.tencent.com/developer/article/1649704
其中,有很多案例在线测试。
2.2、。。。。。写累了,明儿继续
标签:const,FMX,cdecl,delphi,JavaScript,接口,class,procedure 来源: https://blog.csdn.net/pulledup/article/details/112427041