【Delphi】在Webview2中扩展javascript函数：携带参数和结果

        为了在 JavaScript 和 Delphi 之间传递参数和返回结果，您可以进一步扩展之前的 COM 对象，实现参数传递和结果返回。以下是具体的实现步骤和代码示例。

1. 扩展 COM 接口

首先，我们需要扩展 ICustomHelper 接口，使其能够接受参数并返回结果。

type
  ICustomHelper = interface(IDispatch)
    ['{8B41D0F7-36B4-4978-BDEF-69DB435E52D4}']
    procedure CloseProgram; safecall;
    function ShowMessage(const Msg: WideString): WideString; safecall;
  end;

  TCustomHelper = class(TInterfacedObject, ICustomHelper)
  public
    procedure CloseProgram; safecall;
    function ShowMessage(const Msg: WideString): WideString; safecall;
  end;

2. 实现接口方法

接着，实现 ShowMessage 方法，该方法将接受一个字符串参数，并返回一个字符串结果。

procedure TCustomHelper.CloseProgram;
begin
  Application.Terminate; // 关闭程序
end;

function TCustomHelper.ShowMessage(const Msg: WideString): WideString;
begin
  Result := 'Delphi received: ' + Msg;
  MessageDlg(Msg, mtInformation, [mbOK], 0);  // 弹出消息框显示信息
end;

3. 将对象添加到 WebView2

在表单的 FormCreate 事件中，将扩展后的 COM 对象添加到 WebView2 的脚本中。

procedure TForm1.FormCreate(Sender: TObject);
begin
  // 初始化 WebView2
  WebView21.CreateWebView2(nil);

  // 创建并注册自定义对象
  WebView21.CoreWebView2.AddHostObjectToScript('Helper', TCustomHelper.Create);
end;

4. 在 JavaScript 中调用方法并传递参数

现在可以在 JavaScript 中调用 ShowMessage 方法，并传递参数，同时接收返回值。

let result = window.Helper.ShowMessage("Hello from JavaScript!");
console.log(result); // 将打印 "Delphi received: Hello from JavaScript!"

5. 详细说明

• ShowMessage 方法：这个方法接受一个字符串参数，并在 Delphi 中显示该消息，同时返回一个带有附加文本的字符串。
• 参数传递和结果返回：JavaScript 调用 ShowMessage 时，可以传递一个参数给 Delphi，而 Delphi 处理后会返回结果给 JavaScript。

6. 使用 JSON 进行复杂数据传递

如果需要在 JavaScript 和 Delphi 之间传递更复杂的数据结构（例如对象或数组），可以考虑使用 JSON。以下是一个简单的例子：

Delphi 代码

uses
  System.JSON;

function TCustomHelper.ProcessData(const JsonData: WideString): WideString;
var
  JSONObject: TJSONObject;
  Response: TJSONObject;
begin
  JSONObject := TJSONObject.ParseJSONValue(JsonData) as TJSONObject;
  try
    // 处理传入的 JSON 数据
    Response := TJSONObject.Create;
    try
      Response.AddPair('status', 'success');
      Response.AddPair('received', JSONObject.GetValue('message').Value);
      Result := Response.ToString;
    finally
      Response.Free;
    end;
  finally
    JSONObject.Free;
  end;
end;

JavaScript 代码：

let data = JSON.stringify({ message: "Hello from JavaScript!" });
let response = JSON.parse(window.Helper.ProcessData(data));
console.log(response.status);  // 将打印 "success"
console.log(response.received); // 将打印 "Hello from JavaScript!"

总结

通过扩展 COM 接口，可以实现 Delphi 和 JavaScript 之间的双向数据传递。使用上述方法，您可以在 JavaScript 中调用 Delphi 方法，传递参数并接收返回结果，实现更复杂的交互。