如何:在 DHTML 代码和客户端应用程序代码之间实现双向通信
可以使用 WebBrowser 控件向 Windows 窗体客户端应用程序添加现有的动态 HTML (DHTML) Web 应用程序代码。 在投入大量的开发时间创建基于 DHTML 的控件,并希望利用丰富的 Windows 窗体用户界面功能而无需重写现有的代码时,该控件十分有用。
使用 WebBrowser 控件,可以通过 ObjectForScripting 和 Document 属性在客户端应用程序代码和网页脚本代码之间实现双向通信。 此外,可以对 WebBrowser 控件进行配置,使 Web 控件可以与应用程序窗体上的其他控件进行无缝整合,从而隐藏其 DHTML 实现。 若要使控件无缝整合,请对所显示页的格式进行设置,使其背景颜色和视觉样式与窗体的其余部分匹配,然后使用 AllowWebBrowserDrop、IsWebBrowserContextMenuEnabled 和 WebBrowserShortcutsEnabled 属性禁用标准浏览器功能。
在 Windows 窗体应用程序中嵌入 DHTML
将 WebBrowser 控件的 AllowWebBrowserDrop 属性设置为 false,以防止 WebBrowser 控件打开拖放到其上的文件。
webBrowser1.AllowWebBrowserDrop = False
webBrowser1.AllowWebBrowserDrop = false;
将该控件的 IsWebBrowserContextMenuEnabled 属性设置为 false,以防止 WebBrowser 控件在用户右击它时显示其快捷菜单。
webBrowser1.IsWebBrowserContextMenuEnabled = False
webBrowser1.IsWebBrowserContextMenuEnabled = false;
将该控件的 WebBrowserShortcutsEnabled 属性设置为 false,以防止 WebBrowser 控件响应快捷键。
webBrowser1.WebBrowserShortcutsEnabled = False
webBrowser1.WebBrowserShortcutsEnabled = false;
在窗体的构造函数或 Load 事件处理程序中设置 ObjectForScripting 属性。
下面的代码将窗体类自身用于脚本对象。
提示
组件对象模型 (COM) 必须能够访问脚本对象。 若要使窗体对 COM 可见,请将 ComVisibleAttribute 特性添加到窗体类中。
webBrowser1.ObjectForScripting = Me
webBrowser1.ObjectForScripting = this;
在应用程序代码中实现脚本代码将使用的公共属性或方法。
例如,如果要使用脚本对象的窗体类,请向窗体类添加以下代码。
Public Sub Test(ByVal message As String) MessageBox.Show(message, "client code") End Sub
public void Test(String message) { MessageBox.Show(message, "client code"); }
使用脚本代码中的 window.external 对象访问指定对象的公共属性和方法。
下面的 HTML 代码演示如何通过单击按钮对脚本对象调用方法。 将此代码复制到 HTML 文档的 BODY 元素中,该文档使用控件的 Navigate 方法加载或被分配给控件的 DocumentText 属性。
<button onclick="window.external.Test('called from script code')"> call client code from script code </button>
在脚本代码中实现应用程序代码将使用的函数。
下面的 HTML SCRIPT 元素提供了一个示例函数。 将此代码复制到 HTML 文档的 HEAD 元素中,该文档使用控件的 Navigate 方法加载或被分配到控件的 DocumentText 属性。
<script> function test(message) { alert(message); } </script>
使用 Document 属性从客户端应用程序代码访问脚本代码。
例如,将下面的代码添加到按钮 Click 的事件处理程序中。
webBrowser1.Document.InvokeScript("test", _ New String() {"called from client code"})
webBrowser1.Document.InvokeScript("test", new String[] { "called from client code" });
调试完 DHTML 之后,将该控件的 ScriptErrorsSuppressed 属性设置为 true,以防止 WebBrowser 控件显示脚本代码问题的错误信息。
' Uncomment the following line when you are finished debugging. 'webBrowser1.ScriptErrorsSuppressed = True
// Uncomment the following line when you are finished debugging. //webBrowser1.ScriptErrorsSuppressed = true;
示例
下面的完整代码示例提供了一个演示应用程序,可用于理解此功能。 HTML 代码通过 DocumentText 属性加载到 WebBrowser 控件中,而不是从单独的 HTML 文件加载。
Imports System
Imports System.Windows.Forms
Imports System.Security.Permissions
<PermissionSet(SecurityAction.Demand, Name:="FullTrust")> _
<System.Runtime.InteropServices.ComVisibleAttribute(True)> _
Public Class Form1
Inherits Form
Private webBrowser1 As New WebBrowser()
Private WithEvents button1 As New Button()
<STAThread()> _
Public Shared Sub Main()
Application.EnableVisualStyles()
Application.Run(New Form1())
End Sub
Public Sub New()
button1.Text = "call script code from client code"
button1.Dock = DockStyle.Top
webBrowser1.Dock = DockStyle.Fill
Controls.Add(webBrowser1)
Controls.Add(button1)
End Sub
Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) _
Handles Me.Load
webBrowser1.AllowWebBrowserDrop = False
webBrowser1.IsWebBrowserContextMenuEnabled = False
webBrowser1.WebBrowserShortcutsEnabled = False
webBrowser1.ObjectForScripting = Me
' Uncomment the following line when you are finished debugging.
'webBrowser1.ScriptErrorsSuppressed = True
webBrowser1.DocumentText = _
"<html><head><script>" & _
"function test(message) { alert(message); }" & _
"</script></head><body><button " & _
"onclick=""window.external.Test('called from script code')"" > " & _
"call client code from script code</button>" & _
"</body></html>"
End Sub
Public Sub Test(ByVal message As String)
MessageBox.Show(message, "client code")
End Sub
Private Sub button1_Click(ByVal sender As Object, ByVal e As EventArgs) _
Handles button1.Click
webBrowser1.Document.InvokeScript("test", _
New String() {"called from client code"})
End Sub
End Class
using System;
using System.Windows.Forms;
using System.Security.Permissions;
[PermissionSet(SecurityAction.Demand, Name="FullTrust")]
[System.Runtime.InteropServices.ComVisibleAttribute(true)]
public class Form1 : Form
{
private WebBrowser webBrowser1 = new WebBrowser();
private Button button1 = new Button();
[STAThread]
public static void Main()
{
Application.EnableVisualStyles();
Application.Run(new Form1());
}
public Form1()
{
button1.Text = "call script code from client code";
button1.Dock = DockStyle.Top;
button1.Click += new EventHandler(button1_Click);
webBrowser1.Dock = DockStyle.Fill;
Controls.Add(webBrowser1);
Controls.Add(button1);
Load += new EventHandler(Form1_Load);
}
private void Form1_Load(object sender, EventArgs e)
{
webBrowser1.AllowWebBrowserDrop = false;
webBrowser1.IsWebBrowserContextMenuEnabled = false;
webBrowser1.WebBrowserShortcutsEnabled = false;
webBrowser1.ObjectForScripting = this;
// Uncomment the following line when you are finished debugging.
//webBrowser1.ScriptErrorsSuppressed = true;
webBrowser1.DocumentText =
"<html><head><script>" +
"function test(message) { alert(message); }" +
"</script></head><body><button " +
"onclick=\"window.external.Test('called from script code')\">" +
"call client code from script code</button>" +
"</body></html>";
}
public void Test(String message)
{
MessageBox.Show(message, "client code");
}
private void button1_Click(object sender, EventArgs e)
{
webBrowser1.Document.InvokeScript("test",
new String[] { "called from client code" });
}
}
编译代码
此代码需要:
- 对 System 和 System.Windows.Forms 程序集的引用。
有关从 Visual Basic 或 Visual C# 的命令行生成此示例的信息,请参见从命令行生成 (Visual Basic) 或在命令行上使用 csc.exe 生成。 也可以通过将代码粘贴到新项目,在 Visual Studio 中生成此示例。 有关更多信息,请参见 如何:使用 Visual Studio 编译和运行完整的 Windows 窗体代码示例 和 如何:使用 Visual Studio 编译和运行完整的 Windows 窗体代码示例 和 如何:使用 Visual Studio 编译和运行完整的 Windows 窗体代码示例 和 如何:使用 Visual Studio 编译和运行完整的 Windows 窗体代码示例 和 如何:使用 Visual Studio 编译和运行完整的 Windows 窗体代码示例.