Chrome、Edge、360及Firefox浏览器加载多个ActiveX插件的介绍

老K（郭云开）2024-09-12 7:08

allWebPlugin简介

allWebPlugin 中间件是一款为用户提供安全、可靠、便捷的浏览器插件服务的中间件产品 ， **致力于将浏览器插件重新应用到所有浏览器。**它将现有ActiveX控件直接嵌入浏览器，实现插件加载、界面显示、接口调用、事件回调等。支持Chrome、Firefox、Edge、360等浏览器，接口调用友好、集成方便。为用户提供"信息化系统 + allWebPlugin + 插件 + 浏览器"的解决方案。

allWebPluginV2.0.0.20版本做了很大的改造，支持了一个页面加载多个插件；解决了插件与浏览器抢焦点；同一页面加载多个插件时，插件与插件之间抢焦点的问题。实现了在Chrome、Firefox、Edge、360等浏览器上加载ActiveX插件，与IE浏览器几乎一样的功能及体验。下面将通过allWebOffice Tab多标签实例的代码向大家展示如何在同一个网页加载多个ActiveX插件。

下载地址

链接：百度网盘 请输入提取码

提取码：z3q0

如下图所示，下载allWebPlugin_x86_v2.0.0.20_alpha_演示包_20240908.zip安装包。
安装包截图

添加定位元素

首先，需要在正文及经办环节tab标签下，添加插件定位元素。如下图所示：

html 复制代码 
<!--正文-->
<div style="height:0px;overflow:hidden;" id="tab_zw">
	<div id="DivID" style="width:100%;height:900px;">
		<text>输入焦点测试: </text><input type="text" name="title1" id="title1" value=""/>
			<!--<canvas id="pluginUI" width="1000" height="800">
				<p class="error">Sorry, It looks as though your browser does not support the canvas tag.</p>
			</canvas>-->
			<canvas id="pluginUI_ZW" style="margin-top: 20px;width:50%;height:50%">
				<p class="error">Sorry, It looks as though your browser does not support the canvas tag.</p>
			</canvas>

	</div>
</div>
<!--正文end-->
<!--经办环节-->
<div style="height:0px;overflow:hidden;" id="tab_jbhj">
	<div id="bd_jbhj" style="width:100%;height:100%;">
		<text>输入焦点测试: </text><input type="text" name="title2" id="title2" value=""/>
		<table style="width:100%;height:100%;">
		<tr style="width:100%;height:100%;">
		<td >
		 <canvas id="pluginUI_JB" style="margin-top: 20px;width:500px;height:450px">
				<p class="error">Sorry, It looks as though your browser does not support the canvas tag.</p>
		</canvas>
		</td>
		
		<td >
		<canvas id="pluginUI_JB2" style="margin-top: 20px;width:500px;height:450px">
				<p class="error">Sorry, It looks as though your browser does not support the canvas tag.</p>
		</canvas>
		</td>
		</tr>
		</table>
	 </div>
</div>
<!--经办环节end-->

创建插件容器及插件

与传统IE浏览器不同，Chrome、Edge、360及火狐浏览器创建ActiveX插件，需要使用allWebPkugin中间件提供的服务。具体如下：

javascript 复制代码 
function CreateContainer(){
	var canvas_zw = document.getElementById('pluginUI_ZW');//定位元素
	var canvas_jb = document.getElementById('pluginUI_JB');//定位元素
	var canvas_jb2 = document.getElementById('pluginUI_JB2');//定位元素
	var license = "9y4LEm/V6Su9+CP9ION3CqBZzsnSyJW2BIOmkgGdrKd6LsGVXCWlcRBxGfVF1XOPzC9WxlN0wrsQJJzy/Sb5YUhnxibuGY6cwTXP6MALEUEQFzXbytCCYZ8yuWbKwaSdWw5/nsk02HtT/EqxC9jsQEwXfCiLGpeyww5MszBO4EV6/Whk4dpno9z1IP+gYlZ5emPuZWPcA0xfdPfMd8CdZ7O2Y1kH4iqJRcUDZpZLQZzRaaxD4GC6rmYjAT+0hOxf741S1EV6EjTzdZdllR2Gc3/ho/O+lqeG77Lq/sI7eGuRrB92QT4P/dmWmDpM0Qg9AAAA8AEAAQMCpzvCVYrodJHnQlzcchghAVhG8HkPd/M3WbD7ikYNYSMNpadQHw22md/os+H8in1qcUBIUHlshxFEKT84jEPIP39iTN7E4IqEACvPF8duWkErP8vRvrSSxA67jQEesJV2RkXphVUw20qAYDXse5UBsLuIlpsfae59Q3VuDFyGZ9K7Rj3fGG7lMrQxhNPj0IkDKfsa/4S2vDl43A4JLdGE8PyHMOxOGWIBwAzTQvOIA2gT2bC8bUP2HnHz//04r8CZ848wnMgZ8ifdtBGgPIIvhvhNvdHNW3d7GDWIFz7migklvNukCsVNhNjck73Co8JMQppp5n4RY5Ck0DdBVe1iogABAYICCgGCMEGy6w+KRf1qX5NoDdyEKnrHfuE5hco4f/fwKsNo3Dwo1sUFB9hbxusOUSAAyYDfvQWc4CdxoSf7kM4ojInlHHvTw0ppKCFV7H17iDOXdJFKZmkjeFCeubn3VezepCvW1+Z9s84M2uILZgIGw7eIQ/je0Bz+qEWyiqWbA4QYiTHzUwQtZyntNcqYpS0PxXXmV9I21wh48DIV/9DTeZW5OZwRcHivVXFaqW2uxngqGdbw1xyJ9AMhrGdt9S2R2rd1jzNq7ddiKN09TCt806vlF1zGAxb5zq6WjwPxeG7aoE33cTRnEg5WvNM4puhmYOWYi61D8j8lzXheUCJGpsw39CoAAAEOAAAAAUFXUEY=";	
	var installPackageUrl = "http://127.0.0.1:6651/install/allwebPlugin_x86_v2.0.1.16_20240806.exe";
	var installPackageVersion = "2.0.0.16";
	g_allWebPlugin = new allWebPlugin();
	if(g_allWebPlugin.IsInstall() == false){
		//未安装，需要手动安装
		if(confirm("allWebPlugin中间件未安装或未启动,是否立即安装？")){
			window.open(installPackageUrl, '_blank');
		}
	}else{
		//已安装，检测是否需要版本更新
		if(g_allWebPlugin.IsNewVersion(installPackageVersion) == false)
		{
			hostCnt_zw = g_allWebPlugin.createContainer(canvas_zw,"PluginContainer",license,false);//创建插件容器
			if(hostCnt_zw)
			{	
				hostCnt_zw.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
				hostCnt_zw.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
				allWebOfficeAx_zw = CreatePlugin(hostCnt_zw);//创建插件
			}
			hostCnt_jb = g_allWebPlugin.createContainer(canvas_jb,"PluginContainer",license,false);
			if(hostCnt_jb)
			{	
				hostCnt_jb.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
				hostCnt_jb.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
				allWebOfficeAx_jb = CreatePlugin(hostCnt_jb);
			}
			hostCnt_jb2 = g_allWebPlugin.createContainer(canvas_jb2,"PluginContainer",license,false);
			if(hostCnt_jb2)
			{	
				hostCnt_jb2.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
				hostCnt_jb2.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
				allWebOfficeAx_jb2 = CreatePlugin(hostCnt_jb2);
			}
		}else{
			//需要升级
			alert("检测到升级包,立即升级。");
			g_allWebPlugin.UpdateVersion(installPackageUrl).then(function(data){
				if(data.code == 0)
				{	//检测是否安装成功
					var checkInstall = setInterval(function(){
						if(g_allWebPlugin.GetVersion() == installPackageVersion){
							window.location.reload();
							clearTimeout(checkInstall);
						}
					}, 1000);
					
				}
				else{
					window.open(installPackageUrl, '_blank');//直接下载包，手动安装
				}
			}).catch(function(strErr){
				window.open(installPackageUrl, '_blank');//直接下载包，手动安装
			});
		}
	}
}
javascript 复制代码 
function CreatePlugin(hostCnt){
	var officePlugin;
	if(hostCnt == null)
		return officePlugin;
	//{6888ECA8-57D0-6E0E-9B9B-F1FF9B2DBD86} allWebOffice
	//{C7F277DC-6C47-AB2C-FB6A-070DC8BE7533} suwellreader
	//{D89F482C-5045-4DB5-8C53-D2C9EE71D025} 老东家iWebOffice2015
	//{9BE31822-FDAD-461B-AD51-BE1D1C159921}  VLC
	//{082ECC40-38F1-4E8F-82D3-216009A96686}  RSignReader
	var officePlugin = hostCnt.createProxyPlugin("{6888ECA8-57D0-6E0E-9B9B-F1FF9B2DBD86}");
	if(officePlugin != null)
	{
		officePlugin.GetDisplayStyle().ShowOpenProgress = false;
	}
	return officePlugin;
}

ActiveX插件接口调用

最后，调用插件对象接口，注意：调用插件读属性与传统调用存在差异，需要在属性后面加上"()"方可获取属性值（仅适合createProxyPlugin方法创建的插件对象）。

javascript 复制代码 
/*
*打开远程大文档
*/
function openOnWebFile(){
	if(!g_allWebPlugin.ActivateContainer) return;
	var pluginUtilityObj = g_allWebPlugin.ActivateContainer.getPluginUtility();
	var httpclientObj = g_allWebPlugin.ActivateContainer.getHttpClient();
	httpclientObj.Clear();
	if (httpclientObj.Open(0, "http://127.0.0.1:6651/test2.docx", false)) {
		httpclientObj.Send().then(function(data){
			if (httpclientObj.GetStatus() == 200) {
				var varTempPath = pluginUtilityObj.GetTempPath();
				var varFile = pluginUtilityObj.GetTempFileName(varTempPath,"zso") + ".docx";
				httpclientObj.ResponseSaveToFile(varFile);
				g_allWebPlugin.ActivateContainer.ObjectAx.Open(varFile);
				g_allWebPlugin.ActivateContainer.ObjectAx.DeleteAfterClose = true;
			}
			else{
				alert("LoadFile test2.docx Status:" + httpclientObj.GetStatus() + ",请确保安装目录下web目录存在test2.docx");
			}
			httpclientObj.Close();
		});	
	 }
}

显示效果

下面展示了allWebOffice Tab标签示例效果，实现了在谷歌、火狐、360及Edge等浏览器同一页面加载多个插件的效果。
正文tab标签页加载电子表格文档

经办环节tab标签页，同时加载两个插件，打开Word文档

相关推荐
爪哇抓挖_Java6 小时前
M系列芯片切换镜像源并安装 openJDK17
前端·chrome·python
FL162386312916 小时前
python版本的Selenium的下载及chrome环境搭建和简单使用
chrome·python·selenium
gqkmiss1 天前
Chrome 浏览器插件获取网页 iframe 中的 window 对象
前端·chrome·iframe·postmessage·chrome 插件
浏览器爱好者1 天前
谷歌浏览器的网络安全检测工具介绍
chrome·安全
益达是我1 天前
【Chrome】浏览器提示警告Chrome is moving towards a new experience
前端·chrome
catmes1 天前
设置浏览器声音或视频的自动播放策略
chrome·音视频·edge浏览器
feifeiyechuan1 天前
【Chrome Extension】二、导航栏快速查询
前端·chrome·chromeextension
代码的乐趣1 天前
支持selenium的chrome driver更新到131.0.6778.204
chrome·python·selenium
路人甲ing..2 天前
jupyter切换内核方法配置问题总结
chrome·python·jupyter
搬码后生仔2 天前
asp.net core webapi项目中 在生产环境中 进不去swagger
chrome·后端·asp.net
热门推荐
01大模型国产化适配7-华为昇腾LLM落地可选解决方案（MindFormers、ModelLink、MindIE）02ARM学习（31）编译器对overlay方式的支持03玄机平台应急响应—webshell查杀04电赛2024年H题智能小车基于MSPM0G3507主控MCU（利用8路灰度加上MPU6050的解决方式）具体项目报告05【一文读懂】NTN（非地面网络）技术介绍06(欧拉)openEuler系统添加网卡文件配置流程、(欧拉)openEuler系统手动配置ipv6地址流程、(欧拉)openEuler系统网络管理说明07Ubuntu 20.04使用Livox mid 360 测试 FAST_LIO08组基轨迹建模 GBTM的介绍与实现（Stata 或 R）09Docker 夺命连环 15 问10STM32 无法烧录