chrome 扩展 hello word_[JS环境]-02 注册 Javascript 扩展程序

注册 Javascript 扩展程序

Cef 的 Javascript 扩展程序是标准的，向 Javascript 环境注册对象的标准流程。在 NanUI 中，有很多内置的方法（比如控制浏览器承载窗口的最大化、最小化等）就是采用了这种方法来注册的。其核心使用的是 Cef 的CefV8Handler类，这个类主要功能就是负责处理 V8 引擎中的各种数据。

在 NanUI 中提供了便捷的ChromiumExtensionBase类来方便您注册扩展程序。

ChromiumExtensionBase 类

ChromiumExtensionBase类包含抽象属性DefinitionJavascriptCode和抽象方法OnExtensionExecute。您需要为DefinitionJavascriptCode属性提供 Javascript 的构造代码，抽象方法OnExtensionExecute是构造代码中的本地方法执行时触发的事件。

class ChromiumExtensionBase : CfrV8Value
{
    public abstract string DefinitionJavascriptCode { get; }
    public abstract CfrV8Value OnExtensionExecute(string nativeFunctionName, CfrV8Value[] arguments, CfrV8Value @this, ref string exception);
}

Javascript 构造代码

Javascript 构造代码是特别针对与本地交互的操作而特别设置的代码。请注意，您不能在这种交互代码中执行 DOM 操作，换句话来说，您的代码可以使用 Javascript 环境中的window对象，但不能访问window对象里的document或者body对象。

下面就是一段构造代码的例子。

var DotNet = DotNet || {};

(function(dotNet){

    // 定义属性
    dotNet.__defineGetter__("version", function() {
        native function GetVersion();
        return GetVersion();
    });

    // 定义方法
    dotNet.messagebox = function(text) {
        native function MessageBox();
        return MessageBox(text);
    }

})(DotNet);

请注意，任何与本地交互的属性或者方法，都需要指定特别的关键字native，以此来标注执行此方法时触发CefV8Handler的Execute方法，只是ChromiumExtensionBase为您简化了此过程。

处理器实现

在有了构造代码后，您就需要实现处理器的逻辑。

class DotNetExampleObject : ChromiumExtensionBase
{
    public override string DefinitionJavascriptCode => "<上述Javascript构造代码>";
    public override CfrV8Value OnExtensionExecute(string nativeFunctionName, CfrV8Value[] arguments, CfrV8Value @this, ref string exception)
    {
        CfrV8Value retval = null;
        if(nativeFunctionName == "GetVersion")
        {
            // 返回.Net环境的版本号
            retval = CfrV8Value.CreateString(Environment.Version.ToString());
        }

        if(nativeFunctionName == "MessageBox")
        {
            var text = arguments[0].StringValue;
            MessageBox.Show(text);
        }

        return retval;
    }
}

如此，您的扩展程序就设计完成了。这个扩展只实现了 2 个简单的功能：

• DotNet.version 获取当前.NET 的版本号
• messagebox(str) 通过.NET 环境显示一个内容为参数str的 MessageBox

注册扩展程序

设计完扩展程序，您还需要将他注册到 Cef 的 V8 环境中。在 NanUI 初始化时，使用RegisterChromiumExtension方法来注册您的扩展程序。

Bootstrap
    .Initialize()
    .RegisterChromiumExtension("DotNet/Extension", () => new DotNetExampleObject())
    .Run(() => new MainWindow());

使用扩展

打开 DevTools，在控制台中输入DotNet来查看是否将这个对象注册到了 Javascript 环境。

> DotNet
Object {}

执行DotNet.verson将打印当前.NET 框架的版本号。

> DotNet.version
[4.0.30319.42000]

使用DotNet.messagebox()来显示一个 MessageBox。

> DotNet.messagebox("Hello NanUI!");
undefined