TXWebApplet.txt 11.1 KB
Newer Older
1
腾讯软件内嵌网页版:基于跨浏览器的原生小程序系统-PluginOK(牛插)中间件( https://github.com/wangzuohuai/WebRunLocal )单机高级版开发,可实现将腾讯微信、企业微信、腾讯会议、QQ等客户端软件内嵌到网页中运行。最低可用在Chrome 41、Firefox 50、Edge 80(Chromium内核)、360极速/安全、IE 8、Oprea 36、QQ、搜狗等浏览器,也兼容运行于这些浏览器的最新版本。
W
wangzuohuai 已提交
2 3 4 5 6 7 8

1、PluginOK(牛插)中间件的安装:
1)、如果是exe的安装程序,请直接运行安装;
2)、如果是绿色版的程序包,请解压到磁盘某个目录后,双击“InstallWrl.bat”进行安装;
3)、安装完成时会启动PluginOK中间件服务,在安装目录下的Data子目录有WrlService.txt日志文件输出运行情况。

2、腾讯软件内嵌网页版控制相关接口:
W
wangzuohuai 已提交
9
说明:以下功能请通过Web Socket连接PluginOK主服务(ws://localhost:80?sid=12345&flag=1)后可执行,如默认侦听端口不是80(关于如何配置侦听端口,请参考SDK包中的文档“PluginOK开发者手册.doc”),请在连接地址中指定端口号进行连接。
W
wangzuohuai 已提交
10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
HTTP网页在线测试:http://zorrosoft.com/txfull.html  HTTPS网页在线测试:https://zorrosoft.com/txframe.html
前端集成可参考以上测试网页进行,HTML网页中需要嵌入以下类似代码;
A、标记程序的显示位置和大小
.TXWebApplet {
            margin: 20px 0 0 20px;
            width: 480px;
            height: 320px;
            border: 1px solid blue;
        }
或者
.TXWebApplet {
            width: 480px;
            height: 320px;
            top: 20px;
            left: 20px;
            border: 1px solid blue;
        }
W
wangzuohuai 已提交
27 28 29 30
如果在网页Header区没有标记小程序初始显示位置和大小,请在启动小程序的JSON参数里,添加以下参数:
"Left":20,"Top":20,"Width":480,"Height":320

B、网页中嵌入元素
W
wangzuohuai 已提交
31 32 33 34 35 36 37 38 39 40
支持IFrame的:
<iframe name="TXWebApplet" id="TXWebApplet" src="TXApplet3.html" frameborder="0" align="left" width="550" height="540" scrolling="no">
或者直接用
<div id="TXWebApplet" class="TXWebApplet"</div>

另外需要嵌入用到的JS脚本,脚本程序是完全开源的。

1)、请求启动腾讯软件内嵌网页版实现网页中局部加载显示:
Type为浏览器类型,传0自动判断(前提是当前浏览器已启动并显示在最前端,Flag指定当前页加载时必须是0) 可强制指定浏览器类型Type(2代表Chrome 4代表Firefox 8代表Opera 16代表Edge(Chromium内核) 32代表360极速浏览器 33代表360安全浏览器 34代表360企业安全浏览器 50代表QQ浏览器 60代表搜狗浏览器)
Title:网页标题中的关键词
W
wangzuohuai 已提交
41
Flag掩码标记:1指定新标签加载(1和16都不指定时为当前页加载) 2小程序显示窗口边框 4不自动裁剪越界窗口 8自动适配网页高度和宽度显示
W
wangzuohuai 已提交
42
IframeX和IframeY分别为iframe嵌套的横竖偏移修正坐标
W
wangzuohuai 已提交
43
BarW和BarH分别是网页右侧和底部预留区域,ScrollTop为顶部滚动预留高度
W
wangzuohuai 已提交
44 45 46
小程序实际显示首先会基于网页中指定的坐标和大小,再根据IframeX、IframeY、BarW、BarH设定的值做修正
App 指定加载软件,0微信桌面版 1企业微信桌面版 2腾讯会议桌面版
Url:加载小程序所在的网页实际地址
47
注意:Url如果有特殊字符= & 双引号或中文等,需要用URL编码处理后传递
W
wangzuohuai 已提交
48 49 50

举例:
自动识别当前浏览器指定位置和大小启动:
W
wangzuohuai 已提交
51
{"req":"Wrl_TXWebApplet","rid":1,"para":{"Type":"0","Title":"Tencent Web Applet","Flag":2,"App":"0"","IframeX":0,"IframeY":0,"BarW":0,"BarH":0,"ScrollTop":0,"Url": "http://zorrosoft.com/TXApplet.html"}}
W
wangzuohuai 已提交
52 53

自动识别当前浏览器指定位置自动适配网页大小启动:
W
wangzuohuai 已提交
54
{"req":"Wrl_TXWebApplet","rid":2,"para":{"Type":"0","Title":"Tencent Web Applet","Flag":10,"App":"0"","IframeX":0,"IframeY":0,"BarW":0,"BarH":0,"ScrollTop":0,"Url": "http://zorrosoft.com/TXApplet.html"}}
W
wangzuohuai 已提交
55 56 57 58

当前页指定位置自动适配网页加载测试
http://zorrosoft.com/txframe.html

W
wangzuohuai 已提交
59
启动后会先后收到三个JSON数据包
W
wangzuohuai 已提交
60
A、{"ret":0,"rid":1,"data":{"ID":3}}
W
wangzuohuai 已提交
61
代表小程序WS侦听服务就绪
W
wangzuohuai 已提交
62
B、{"event":"Wrl_Listen","aid":3,"data":{"SID":"123","PID":"TXWebApplet","port":955}}
W
wangzuohuai 已提交
63
返回的侦听端口,可再建立一个Web Socket连接后,调用小程序中的相关功能。
W
wangzuohuai 已提交
64
代表小程序创建成功,返回ID为当前小程序运行ID,通过此ID,可执行Wrl_AppletControl、Wrl_AppletScroll、Wrl_AppletResize等命令。
W
wangzuohuai 已提交
65
C、{"event":"Wrl_AppletOK","aid":3,"rid":1,"data":{"SID":"123","PID":"TXWebApplet","Port":955}}
W
wangzuohuai 已提交
66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102

2)、请求控制腾讯软件内嵌网页版:
当前端不再需要小程序时可指定关闭,或者显示/隐藏及全屏显示等
ID为启动小程序时返回JSON中的ID值,Code代表控制类型掩码:1关闭 2全屏显示 4自动隐藏 8还原显示 16自动适配网页高度和宽度显示模式切换 32强制隐藏。其中全屏显示2,可直接通过热键ESC或取消,4和32隐藏后可通过8恢复显示
{"req":"Wrl_AppletControl","rid":2,"para":{"ID":"1","Code":4}}

3)、请求滚动腾讯软件内嵌网页版:
当前端截取到网页滚动通知时,需要调用此接口实现小程序和网页的滚动联动
ID为启动小程序时返回JSON中的ID值
Code为滚动方向1是水平直,2是垂直,3是同时
Left为横向滚动条位置,Top为纵向滚动条位置
{"req":"Wrl_AppletScroll","rid":3,"para":{"ID":"1","Code":2,"Left":0,"Top":100}}

4)、请求改变腾讯软件内嵌网页版显示位置或大小:
当前端网页显示区域缩放时,可动态修改小程序的显示位置或大小
ID为启动小程序时返回JSON中的ID值,Width和Height分别为新的宽度和高度,X和Y分别为新的显示位置,不指定时保持不变,指定时原设置的IframeX和IframeY失效
{"req":"Wrl_AppletResize","rid":4,"para":{"ID":1,"Width":500,"Height":600}}
或同时设置小程序显示起始坐标
{"req":"Wrl_AppletResize","rid":5,"para":{"ID":1,"Width":500,"Height":600,"X":20,"Y":20}}

5)、请求设置网页预留右侧宽度和底部高度,滚动条信息、垂直滚动及水平滚动位置:
当小程序显示区域超过当前网页时,需去除滚动条的显示影响
ID为启动小程序时返回JSON中的ID值,BarW为预留右侧宽度 BarH为预留底部高度
Code 1代表有水平滚动条,2代表有垂直滚动条,3代表都有
ScrollTop垂直滚动条位置 ScrollTop水平滚动条位置
{"req":"Wrl_ScrollBar","rid":6,"para":{"ID":"1","Code":2,"BarW":0,"BarH":0,"ScrollTop":0,"ScrollLeft":0}}

6)、请求对小程序窗口做Alpha透明处理,便于前端临时显示覆盖到小程序窗口的菜单等:
ID为Wrl_TXWebApplet启动小程序时返回的ID值,Alpha为透明度百分比,1-100
{"req":"Wrl_AppletAlpha","rid":7,"para":{"ID":1,"Alpha":30}}

7)、请求对小程序窗口内容进行截图:
ID为启动小程序时返回JSON中的ID值,
File为指定截图文件保存路径或扩展名
Base64指定为1时代表返回BASE64编码的图像内容
{"req":"Wrl_AppletSnap","rid":10,"para":{"ID":1,"Base64":1,"File":".png"}}

W
wangzuohuai 已提交
103
8)、请求缩放内嵌网页小程序,用于浏览器网页按比例缩放,一般不需要处理:
W
wangzuohuai 已提交
104 105 106 107 108
ID为启动小程序时返回JSON中的ID值,Scall为缩放百分比
{"req":"Wrl_AppletScale","rid":11,"para":{"ID":1,"Scale":120}}

3、小程序安装、升级、卸载
1)、请求安装腾讯软件内嵌网页版
W
wangzuohuai 已提交
109
请在测试网页输入框中,输入如下请求,然后点击发送,完成安装:
W
wangzuohuai 已提交
110

W
wangzuohuai 已提交
111
{"req":"Plugin_Install","rid":1,"para":{"Name":"腾讯软件内嵌网页版","PID":"TXWebApplet","Date":"2021-05-06","Desc":"PluginOK之上跨浏览器的腾讯微信、企业微信、腾讯会议等桌面软件内嵌网页版,支持在Chrome、Edge、Firefox、IE、Oprea、360、QQ等浏览器网页中直接内嵌使用,和B/S信息化系统融为一体使用","DownAddr":"http://local.zorrosoft.com/Files/Plugin/TXWebApplet.pid","MD5":"E299F5549B9D476F8FB7ABF76E1A9847","Version":"1.3.3.2","Size":491520,"HideIns":0,"Type":8,"Cookie":"","Auth":"","TK":"7B634C54DF3BF5E9AA0F28B89E562DAA29D950A2BFE74DE8CC9586CC14AA927467F2D182694747C9D15B3141109A60DA27D6EECD18A52C4AA62A09CBB62DD7744535D05BBAB27A93A8D23C36B860456B59BF0D9B947F44BA20CD805D97FFF402DA13C19FFD333150F974F319F8F36469DCFE01E382DF93A67C6584465FFE34221EA505B327C885AEC49A9571C67C55BED991E5F2DD6DDEF989A0AC89A4986AFCD2B012773F9009207304F08A3273676B50870E9D1978FC3997B142CADFC0E6BA4DA2C6B478FBE762F93AC3D576993DEADFCD1097814C19C67B1446E2078F6AA211C81F6A8C113B73ACAB4851DFDA523FEB72F168C73857131BEE314ED7EE44F9"}}
W
wangzuohuai 已提交
112 113 114 115 116 117

启动安装后,会不断收到安装进度直到安装结束。
在发布时,也可以把此小程序目录文件和中间件一起打包后发布,不用单独分发。

2)、请求升级腾讯软件内嵌网页版:

W
wangzuohuai 已提交
118
{"req":"Plugin_Update","rid":1,"para":{"Name":"腾讯软件内嵌网页版","PID":"TXWebApplet","Date":"2021-05-06","Desc":"PluginOK之上跨浏览器的腾讯微信、企业微信、腾讯会议等桌面软件内嵌网页版,支持在Chrome、Edge、Firefox、IE、Oprea、360、QQ等浏览器网页中直接内嵌使用,和B/S信息化系统融为一体使用","DownAddr":"http://local.zorrosoft.com/Files/Plugin/TXWebApplet_Update.pid","MD5":"2208ECFC57E27E5BD9BC321F0A352C35","Version":"1.3.3.2","Size":491520,"HideIns":0,"Type":8,"Cookie":"","Auth":"","TK":"86D718D093FF6982854CE27A2D11999FA0BB5ECE973699623E854BF334695F97831E68A7D816E5A26826F5024E1FCE42938FA1A1299B7F55888B4A059B75701B234CFD1A7486A4FB848507418A68106E2635824E7F66791DA4B5F3197142FE49B274D377072C4A0FBC45957B1A40907963F44C65677F4E75A275CDAEFCF820D598C02F1688E00F8C7F4EF13A21238BF7A2E6FA08233A31268A5F77C4454219B5244C3EF00900969FAE7196DAEF6FC463A252DD33781044B468D588E934212165AC2F0507A1FC586C5D2228C8F06F19EBEB4E31C5ABB5C5A6339A974BA0D68C341DF5D6F3B11ED58240B17F70007054D68783AB859591294ED4A8D02ADC7546B7"}}
W
wangzuohuai 已提交
119 120 121 122

以上安装和升级的JSON请求包,可能因版本升级导致内容不同,如遇安装或升级时报错,请联系客服获取最新的请求包。 

3)、请求卸载腾讯软件内嵌网页版:
W
wangzuohuai 已提交
123
正式版需要添加TK校验,具体规则请参考SDK包中文档“PluginOK中间件安全解决方案.doc”,可在SDK包中的打包程序WrlPackage.exe的中间件维护生成带TK的请求。
W
wangzuohuai 已提交
124
{"req":"Plugin_Remove","rid":3,"para":{"PID":"TXWebApplet","Type":8}}
W
wangzuohuai 已提交
125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142

4、腾讯软件内嵌网页版转调用接口,先根据Wrl_TXWebApplet请求启动后返回的端口号,新建立一个WebSocket连接后可执行如下指令:

1) 请求退出小程序
请求:{"req":"TXApp_Exit","rid":50,"para":{}}

5、PluginOK支持的事件通知:

1) TXAPP_FullScreen 小程序是否响应了热键全屏
{"event":"TXAPP_FullScreen","data":{"FullScreen":0}} FullScreen为当前是否全屏标记

2) Wrl_AppletExit 小程序退出通知
{"event":"Wrl_AppletExit","data":{"ID":1}}

6、其它
请求参数的JSON数据包,请确保是UTF-8无签名的编码。
更多接口请求说明,请参考安装目录中的文档TestWrl.txt、SDK包中的“PluginOK开发者手册.doc”及“PluginOK中间件安全解决方案”。
如还有疑问请直接联系客服 加微信:ZorroSoft,或加QQ群:23126938