插件介绍
博主这里讲的是cordova-plugin-inappbrowser这个插件,它可以帮我们实现这样的一个功能,就是在我们的混合app里面,使用app内置浏览器打开一个页面,而不用内置浏览器去打开。
使用插件
下面我们开始讲解inappbrowser插件的使用。
安装插件
在我们的项目根目录执行下面的命令。
cordova plugin add cordova-plugin-inappbrowser
查看命令执行结果:
js修改
我们这里实现的是这样的一个功能,当cordova容器加载完毕的时候,就使用app内置浏览器打开一个网址。
var app = {
// Application Constructor
initialize: function() {
document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
},
onDeviceReady: function() {
this.receivedEvent('deviceready');
},
receivedEvent: function(id) {
var url = 'https://www.cnblogs.com/chenhaoblog/';
var target = '_blank';
var options = 'location=no';
//使用App内置浏览器
cordova.InAppBrowser.open(url, target, options);
}
};
app.initialize();
参数说明:
- url是我们需要打开的链接
- target的参数有三种, _blank:直接在App中将其地址打开。_system:则是用手机默认浏览器将新页面打开;_self:如果URL地址在WhiteList中,则用Cordova的WhiteList将其打开;
- location:设置为yes或no来打开或关闭插件的locationbar;
查看界面
修改js文件之后,需要重新进行app的打包与签名,并进行app的安装。
注意点
这里需要注意的是使用这种方式打开的页面,会具有比较强的缓存。我们将服务器上的文件进行删除了之后,打开我们的app还是能够正常访问。
博主微信公众号
