JavaScript通过WebBrowser与C#交互

1. WebForm后台js调用客户端程序C#方法

         以下示例实现Winform中向一个Web页面发起请求,有Web页面从数据库查询部门数据,并加载到Winfrom程序的TreeView控件中。

1.1 Helper类:提供方法调用实现具体业务

Helper类是对COM可见的:[ComVisibleAttribute(true)],这样该类的所有公开成员(属性和方法)都可被JavaScript脚本访问。

[ComVisibleAttribute(true)]

    public class Helper

    {

        public Helper()

        {

        }

        //初始化Treeview数据方法

        public void InitTreeView (TreeNodeCollection InitNodes, string strData)

        {

                            //TODO

        }

        //加载指定节点的子节点方法

        public void AddSubTreeNode(TreeNode node, string strResult)

        {

                            //TODO

        }

}

说明:为类声明[ComVisibleAttribute(true)],指示该托管类型对 COM 是可见的。

1.2  TvwDept控件:与Javascript交互完成数据展示

    /// <summary>

    /// 加载部门数据的树形控件

    /// </summary>

    [ComVisibleAttribute(true)]

    public partial class TvwDept: UserControl

    {

       

        public TvwDept ()

        {

            InitializeComponent();

       Application.EnableVisualStyles();//可以理解为启用XP风格。如果不启用,则显示的是经典风格(类似于windows2000)

            wbHelper.ObjectForScripting = this; //为浏览器指定window.external对象

        }

        //树控件对象

        public TreeNodeCollection TreeNodes

        {

            get

            {

        return treView.Nodes;

            }

        }

        

        //成员 Helper类的实例

        public Helper HelperInstance

        {

            get { return new Helper(); }

        }

      

        //初始化时加载树节点

        private void BookCtrTree_Load(object sender, EventArgs e)

        {

            try

            {    

      wbHelper.Navigate("http://localhost/DeptWeb/InitDept.aspx");

            }

            catch

            {

            }

        }

}

 

partial class TvwDept

{

    //……

    private void InitializeComponent()

    {

        this.components = new System.ComponentModel.Container();

        System.ComponentModel.ComponentResourceManager resources = new System.ComponentModel.ComponentResourceManager(typeof(BookCtrTree));

        this.wbHelper = new System.Windows.Forms.WebBrowser();

    this.treView = new MyTreeView();//用户控件中的TreeView

        this.SuspendLayout();

  }

       //……

}

说明:Navigate方法用来指示WebBrowser控件显示的网页路径。

ObjectForScripting属性:指示一个对象,该对象赋值给在WebBrowser控件中的网页的window.external对象。

1.3 InitDept.aspx页面:为TvwDept加载数据

在InitDept.aspx页面中,访问TvwDept对象的成员HelperInstance,可调用其方法InitTreeView初始化控件的数据,可调用其方法AddSubTreeNode为指定的部门节点添加子节点数据。

protected void Page_Load(object sender, EventArgs e)

 {

         string strResult=GetDeptData();//从数据库查询部门数据(顶级)

        Response.Write("<Script>window.external. HelperInstance. InitTreeView (window.external.TreeNodes,\"" + strResult + "\")</Script>"); //注意未转义的引号是为了对变量拼接字符串;而转义之后引号就只是文本了,只表示引号本身(Script中字符串类型参数的需要引号)。

说明:JavaScript通过window.external访问C#公开的成员。即由ObjectForScripting属性指定的实例中所包含的公共方法。

 

2. Html前端页面js调用C#方法实例

     以下示例实现Winfrom程序加载时,向web页面发起请求,由web页面调用Winfrom程序的方法,根据页面内容为文本框赋值。

2.1 创建测试窗体Form1

namespace WindowsForms

{

    public partial class Form1 : Form

    {

        public Form1()

        {

            InitializeComponent();

            Demo demo = new Demo();

            this.Controls.Add(demo);

        }

    }

}

2.2 创建用户控件Demo

1)并添加一个webBrowser控件:

声明[ComVisibleAttribute(true)],指示该托管类型对 COM 是可见的。

2)添加一个textBox控件,用来显示结果。

3)写一个public的方法SetText,用来设置textBox控件的值。

代码清单如下:

[ComVisibleAttribute(true)]

    public partial class Demo : UserControl

    {

        public Demo()

        {

            InitializeComponent();

            webBrowserTest.Navigate(new Uri("http://localhost/Test.htm", UriKind.RelativeOrAbsolute));

            webBrowserTest.ObjectForScripting = this;

            webBrowserTest.Visible = false;

        }       

        public void SetText(string value)

        {

            this.txtTest.Text = value;

        }

}

2.3 发布在IIS上的htm页面

<HTML>

<head>

<script type="text/javascript">

window.onload=function()

{

         var strValue=document.getElementById(' divTest ').innerText;

         window.external.SetText(strValue); //调用Demo类的SetText方法

}

</script>

</head>

<Body>

         <Form>

                   <div id="divTest" >321567</div>

         </Form>

</Body>

</HTML>

2.4 Form1窗体加载效果

posted @ 2013-05-02 16:36  kinglong1984  阅读(484)  评论(0编辑  收藏  举报