Winform 通过 WebBrowser 与 JS 交互

魏刘宏 2019.08.17

之前在使用 Cef （可在 Winform 或 WPF 程序中嵌入 Chrome 内核的网页浏览器的组件）时，使用过在 C# 代码中调用网页 JS 的功能，以为是 Cef 独有的，最近工作中得知，原来 Winform 自带的浏览器控件 WebBrowser 中也有这个功能，那么我们就来看看吧。

我们先建一个 Winform 窗体 FormBrowserJs：

其中左侧是一个 WebBrowser 控件，右边有一个 TextBox 接收网页发来（调用 C# 方法）的消息，另一个 TextBox 提供给我们输入内容，然后点击按钮向网页发送消息（调用网页的 JS 方法）。

后台代码比较少：

using System;

using System.IO;

using System.Runtime.InteropServices;

using System.Windows.Forms;

namespace WinFormPractice

{

    [ComVisible(true)]

    public partial class FormBrowserJs : Form

    {

        public FormBrowserJs()

        {

            InitializeComponent();

            webBrowser.Navigate(Path.Combine(Application.StartupPath, "HTMLBrowserJs.html"));

            webBrowser.ObjectForScripting = this;

        }

        public void ShowMsgForJs(string msg)

        {

            TBRecv.Text += $"{msg}\r\n";

        }

        private void BtnSend_Click(object sender, EventArgs e)

        {

            webBrowser.Document.InvokeScript("ShowMsgForCSharp", new []{ TBSend.Text });

        }

    }

}

我们用 Navigate 方法让 WebBrowser 导航到一个本地网页”HTMLBrowserJs.html” 去，并将其 ObjectForScripting 设置为当前类，意思就是网页可以调用这个类里的方法，同时还要设置这个类的特性 ——[ComVisible (true)]—— 以便将方法暴露出去。

ShowMsgForJs 方法就是供网页的 JS 方法调用的，里面就是把消息显示在接收框里。

发送按钮的方法里面使用了 webBrowser.Document.InvokeScript 方法来调用 JS 的方法，第一个参数是方法名，第二个参数是一个 Object 数组，这里其实使用的是一个 string 数组。

下面我们来看看那个网页：

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title></title>

    <script>

        //alert ("准备就绪");

        window.external.ShowMsgForJs("准备就绪");

        function ShowMsgForCSharp(str) {

            var msg = "收到消息：" + str;

            //1、调用 C# 方法；

            window.external.ShowMsgForJs(msg);

            //2、改变网页内容；

            document.getElementById("info").innerHTML += msg + "<br/>";

            //3、弹窗；

            alert(msg);

        }

    </script>

</head>

<body>

    <div> 通过 WebBrowser 让 JS 与 C# 代码交互 测试页 </div>

    <div id="info"></div>

</body>

</html>

在 script 脚本区，首先通过 window.external.ShowMsgForJs 调用了 Winform 窗体类中的 ShowMsgForJs 方法，提示” 准备就绪”。

然后是供 C# 使用的 ShowMsgForCSharp 方法，里面使用了三种方法来显示收到的消息。

最后来看看运行效果吧：

可以看到发送和接收都成功了。

最后奉上 Demo 地址：https://gitee.com/dlgcy/Practice/tree/master/WinFormPractice

Winform 通过 WebBrowser 与 JS 交互的更多相关文章

  1. WinForm程序执行JS代码的多种方法以及使用WebBrowser与JS交互

    方法一 使用微软官方组件Interop.MSScriptControl 1.msscript.ocx下载的地址   http://www.microsoft.com/downloads/details ...

  2. webbrowser和js交互小结

    一.实现WebBrowser内部跳转,阻止默认打开IE 1.引用封装好的WebBrowserLinkSelf.dll实现 public partial class MainWindow : Windo ...

  3. winform+CefSharp 实现和js交互

    1:窗体加载的时候添加 webBrowser.RegisterJsObject("getuserName", new _Event()); 2:注册C#方法为js方法 /// // ...

  4. C#中webbrowser与javascript(js)交互的方法

    今天在做一个项目的时候需要用c#搞一个webbrowser,然后有些地方还需要与js交互.所以就查了一下资料,发现很多博客提到了但是却没有说下具体的操作.所以我就写一下. 开发环境是Visual St ...

  5. C#和JS交互 WebBrowser实例

    本文实现了WebBrowser的简单例子 1.引用System.Windows.Froms.dll 2.引用WindowsFormsIntegration.dll 代码如下: public parti ...

  6. 浏览器自动化的一些体会5 webBrowser控件之winform和webBrowser的交互

    从winform访问webBrowser,大致就是利用webBrowser提供的解析dom的方法以及用InvokeScript方法执行javascript.这个相对比较简单. 从webBrowser访 ...

  7. C# winform调用WebBrowser经典怪问题总结

    原文:C# winform调用WebBrowser经典怪问题总结 最近一直研究网页数据采集,单单采集数据,其实HtmlAgilityPack就足够了. 对HtmlAgilityPack感兴趣的可以到这 ...

  8. WPF内嵌CEF控件，与JS交互

    1)安装cefsharp.winform包 打开VS2017,打开nuget,找到cefsharp.winform,安装 问:为什么wpf程序不使用cefsharp.wpf? 答:因为cefwpf 4 ...

  9. WinForm中WebBrowser的使用

    最近由于工作需要,研究了下Winform的WebBrowser控件,在这里给大家分享下. 1.WebBrowser导航 WebBrowser在进行导航的时候需要用到Navigate(string ur ...

随机推荐

  1. Java生鲜电商平台-生鲜供应链(采购管理)

    Java生鲜电商平台-生鲜供应链(采购管理) 在生鲜供应链系统中采购中心这一模块,它是电商公司管理采购的模块,包含供应商管理,采购订单管理,采购商品管理,在该模块中采购订单是采购中心的核心模块.在其他 ...

  2. centos 安装gitlab

    1.开始安装依赖软件:yum -y install policycoreutils openssh-server openssh-clients postfix 2.设置postfix开机自启动,po ...

  3. C++ this指针的理解和作用

    01 C++ 程序到 C 程序的翻译 要想理解 C++ 的 this 指针,我们先把下面的 C++ 代码转换成 C 的代码 class Car { public: int m_price; // 成员 ...

  4. Javase之集合体系（4）之Map集合

    集合体系之Map集合 ##Map<K,V>( 接口 ) 特点:将键映射到值对象,一个映射不能包含重复的键:每个键只能映射一个值 Map集合与Collection集合的区别 ​ Map集合存 ...

  5. 远程连接docker

    vim /usr/lib/systemd/system/docker.service ExecStart=/usr/bin/dockerd -H tcp://0.0.0.0:2375 -H unix: ...

  6. C# 结构与类

    结构是一种可以包含数据成员和方法成员的值类型数据结构.为结构分配数据时不需要从托管堆中分配内存,结构类型的变量直接包含了该结构的数据.结构中可以包含构造函数,常量,字段方法,属性,运算符,事件和嵌套类 ...

  7. HTML常用标签二

    图像标签和路径 目录文件夹:普通的文件夹,里面存放了我们做页面需要的相关素材,比如html文件,图片等 根目录:打开目录文件夹的第一层就是根目录 路径 相对路径 以引用文件所在位置为参考基础,而建立出 ...

  8. 解决mac睡眠唤醒/插拔之后，外接显示器无法点亮/无信号问题

    问题现象 mac盖上盖子唤醒或者里临时拔出数据线,再重新连接之后,经常出现下面问题: [系统偏好设置]-[显示器]仍可以识别外接显示器: 外接显示器会提示无信号输入 解决方法 方法一 通过[系统偏好设 ...

  9. [前端] js中call方法的理解和思考

    最近接手前端的工作,对当前项目中自制的js框架下,js的使用产生了非常多的困惑.尤其是js的类,对象,函数,this等等相互之间的关系和转换,以前学过也忘得差不多了,现在基本相当于重新看. js中的函 ...

  10. PHP转Go系列：数组与切片

    数组的定义 用过PHP的同学应该很清楚,无论多么复杂的数据格式都可以用数组来表达,什么类型的数据都可以往里塞,它是工作必备的一部分,使用很简单,易用程度简直变态. $array = [1, 'name ...