前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >aardio中使用加载WEB的几种方式

aardio中使用加载WEB的几种方式

作者头像
码客说
发布2022-09-07 14:47:47
1.9K0
发布2022-09-07 14:47:47
举报
文章被收录于专栏:码客

前言

aardio构建界面有四种方式

  • winform
  • web.form
  • web.kit/web.blink
  • htmlayout

其中有三个是能加载网页的

  • web.form
  • web.kit
  • web.blink

web.blink(miniblink)使用新版chromium内核,并且精简了体积,兼容WKE( WebKit )组件的接口。 aardio中提供了基于WKE( WebKit )的web.kit 扩展库,也提供了基于miniblink的web.blink扩展库。 这两个扩展库基本的用法是一样的( 因为接口基本一样 )。

但是这两个库都是精简过的,都不支持视频的加载。 只考虑加载视频的话可以考虑用Flash组件 要是要实现WebRTC等的话就不要使用这个技术了,推荐使用Electron。

web.form是直接调用系统的IE,所以不存在精简的问题。

几种方式对比

web.form

代码语言:javascript
复制
import win.ui;
/*DSG{{*/
var winform = win.form(text="web.form";right=1123;bottom=570)
/*}}*/

import web.form;
var mb = web.form.ie11(winform);

//使用浏览器打开网页
mb.go("https://www.psvmc.cn")

//显示窗口
winform.show();

//启动界面线程消息循环
win.loopMessage();

web.blink

代码语言:javascript
复制
import win.ui;
/*DSG{{*/
var winform = win.form(text="web.blink";right=1123;bottom=570)
/*}}*/

//导入miniblink扩展库
import web.blink.form;  

//创建miniblink控件
var mb = web.blink.form(winform);

//使用浏览器打开网页
mb.go("https://www.psvmc.cn")

//打开网页调试工具( 在网页右键菜单里点击“检查”切换节点 )
mb.showDevTools()

//显示窗口
winform.show();

//启动界面线程消息循环
win.loopMessage();

相应的库也会大一点

web.kit

代码语言:javascript
复制
import win.ui;
/*DSG{{*/
var winform = win.form(text="web.kit";right=1123;bottom=570)
/*}}*/

import web.kit.form;  
var mb = web.kit.form(winform);

//使用浏览器打开网页
mb.go("https://www.psvmc.cn")

//显示窗口
winform.show();

//启动界面线程消息循环
win.loopMessage();

这个就不支持调试工具

AARDIO和JS互调

判断是否安装Flash

三个方式页面和代码之间的互相调用也是通用的

代码语言:javascript
复制
wb.waitDoc();

wb.external = {
    //可以通过javascript脚本访问external接口的所有成员
	 flashISInstall = function( arg ){
		 io.print("Flash是否可用:",arg);
		 if(!arg){
		 	var result = winform.msgboxTest("Flash未安装是否安装","Flash检测");
		 	if(result){
		 		process.execute_waitInput("https://www.flash.cn/cdm/latest/flashplayerax_install_cn.exe")
		 	}	
		 }
	 }
}

var js = /*
function hasUsableFlash(){
	try{
		var flashObj;
		if(typeof window.ActiveXObject != "undefined"){
    		flashObj= new  ActiveXObject("ShockwaveFlash.ShockwaveFlash");
		}else{
    		flashObj= navigator.plugins['Shockwave Flash'];
		}
		return flashObj? true : false;
	}
	catch(e){
		return false; 
	}	
}
external.flashISInstall(hasUsableFlash());
*/
    
wb.document.getScript().execScript(js);

注意要调用页面的方法,要等待页面加载完毕

代码语言:javascript
复制
wb.waitDoc();

获取Title

方式1

代码语言:javascript
复制
wb.waitDoc();
winform.text = wb.document.title;

方式2

代码语言:javascript
复制
wb.waitDoc();
// 获取title
var titleTags = wb.document.getElementsByTagName("title")
for i, title in com.each(titleTags) {
    if (i == 1) {
        winform.text = title.innerHTML;
        break;
    }
}

方式3

有这么一种情况 页面在加载后,并没有Title,Title是后来才更改的,这样我们通过上面的方式是获取不到的,所以这里使用定时任务获取。

代码语言:javascript
复制
wb.external = {
    titleCb = function(title){
        winform.text = title;
    }
}

var mJS = /*	
		window.myInter = setInterval(
				function(){
					if(document.title){
						external.titleCb(document.title);
						clearInterval(window.myInter);
					}	
				},
				200
			);
			*/;

wb.waitDoc();
wb.document.getScript().execScript(mJS);

修改原事件

代码语言:javascript
复制
mb.external = {	
	tologin = function(){
	 	mb.go(homepage);
	}
}


// 内部跳转
mb.NavigateComplete2 = function(pDisp, url){
	if(url != homepage){
		var js2 = /*
		function exitAction(){
			var info = document.querySelector(".info");
			if(info){
				var a_arr = info.querySelectorAll("a");
				if(a_arr.length>0){
					let exitDom = a_arr[a_arr.length-1];
					if(exitDom.innerHTML=="注销"){
							exitDom.onclick = function () {
        					external.tologin();
    					}
					}	
				}
			}
			
		}
		
		window.onload=function(){
    		exitAction();
		}
		*/
    		
		mb.document.getScript().execScript(js2);
	}
}

文件下载

有的前端是这样写的文件下载

代码语言:javascript
复制
var fileurl = "https://www.flash.cn/cdm/latest/flashplayerax_install_cn.exe";
var btn2 = document.querySelector(".btn2");
btn2.onclick = function () {
  try {
    window.open(fileurl, "_blank");
  } catch (error) {}
};

也就是说文件的下载是在新标签中打开的

这种情况浏览器会自动打开新标签 弹出下载框后自动关闭标签

我们该怎么实现呢

我们要在弹出的窗口中添加如下代码

aardio

代码语言:javascript
复制
wb.NavigateError=function(pDisp,url,target,statusCode,cancel){
  winform.close();
  return url,target,statusCode,false
}

但是我们关闭窗口如果window.open(fileurl, "_blank");不做异常捕获,会弹出一个JS报错,所以一定要做异常捕获。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-07-08,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
  • 几种方式对比
    • web.form
      • web.blink
        • web.kit
        • AARDIO和JS互调
          • 判断是否安装Flash
            • 获取Title
              • 方式1
              • 方式2
              • 方式3
            • 修改原事件
            • 文件下载
            领券
            问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档