在ionic应用中打开外部网站(使用InAppBrowser插件)

在安卓上试了一下,如果直接window.open(url), 在app中点击外部链接没有任何反应。

安装https://github.com/apache/cordova-plugin-inappbrowser
执行命令:
ionic plugin add cordova-plugin-inappbrowser

简而言之,就是用window.cordova.InAppBrowser.open替换window.open

步骤:

1. 在应用程序启动的时候判断window.cordova是否存在如果是重写window.open方法

2. 用ng-click="openLink(story.url)" 替换先前的href

3. 在$scope中定义openLink方法。

4.  连上手机, 运行ionic run android测试

文件一: www/index.html

<div class="list">
      <a ng-click="openLink(story.url)" class="item item-thumbnail-left item-text-wrap"
         ng-repeat="story in stories track by story.id">
        <img ng-src="{{story.thumbnail}}" ng-if="story.thumbnail.startsWith(‘http‘)"/>

        <h2>{{story.title}}</h2>

        <p>
          <span am-time-ago="story.created_utc" am-preprocess="unix"></span> - {{story.domain}}
        </p>
      </a>
    </div>

文件二: www/js/app.js

(function () {
  var app = angular.module(‘myreddit‘, [‘ionic‘, ‘angularMoment‘]);
  app.controller(‘RedditCtrl‘, function ($http, $scope) {
    $scope.stories = [];

    function loadStories(params, callback) { 。。。
    }

    $scope.loadOlderStories = function () {。。。
    }

    $scope.loadNewerStories = function () {。。。
    }

    $scope.openLink = function (url) {
      window.open(url, ‘_blank‘);
    }

  });
  app.run(function ($ionicPlatform) {
    $ionicPlatform.ready(function () {
     。。。
      if (window.cordova && window.cordova.InAppBrowser) {
        window.open = window.cordova.InAppBrowser.open;
      }
。。。
    });
  })

})();
时间: 2024-10-31 21:56:59

在ionic应用中打开外部网站(使用InAppBrowser插件)的相关文章

ionic项目中手机状态栏显示使用$cordovaStatusbar插件

在项目中发现Android和iOS在手机状态栏样式不一样,然后就查到有一个cordova插件可以解决这个问题 1.下载插件$cordovaStatusbar命令: cordova plugin add https://github.com/apache/cordova-plugin-statusbar.git 2.在config.xml里面配置如下: <feature name="StatusBar"> <param name="ios-package&qu

Delphi中WebBrowser控件打开部分网站报&quot;Invalid floating point operation”解决

Delphi中WebBrowser控件打开部分网站报"Invalid floating point operation”解决 EmbeddedWBWebBrowserDelphi 最近用EmbeddedWB控件做浏览器相关应用的时候,发现有些网页只要一打开就一定会蹦出一个“Invalid floating point operation”异常(关掉异常对话框以后,浏览器无响应),而程序仅仅是一句 WebBrowser1.Navigate(Edit1.Text);貌似很多含有Silverlight

微信中打开链接,自动打开外部浏览器打开指定URL页面

在我们做营销活动或推广宣传的时候,容易遇到域名被封,无法跳转app下载等情况.这时需要微信跳转外部浏览器打开页面的功能,对于微信默认可以通过:点击右上角的三点,点击"在浏览器中打开".但是对于很多用户而言并不知道这样的实现,所以需要在代码中进行相关操作.目前ios只能通过遮罩层来提示用户,对于安卓可以直接跳转外面默认浏览器,下面就分别介绍下这2种方式的实现代码. 一.遮罩提示: 遮罩引导法,这种事最简单的方法. 代码: functionisWx(){//判断是否为微信   var ua

uni-app 中如何打开外部应用

我们在开发 App 应用中,经常会遇到打开第三方程序的场景,比如打开手机淘宝.通过第三方浏览器打开一个 url 等等. App不像网页可以使用http超链接互相跳转,但手机os设计了scheme机制,可以通过特殊的链接互相调起. 比如手机淘宝,其安装后会在手机os中会注册一个scheme协议,taobao://. 这种协议还支持参数,比如taobao://s.taobao.com/search?q=uni-app启动淘宝并打开搜索页面搜索uni-app. 在uni-app/5+App中,可以通过

微信/QQ打开网址弹出遮罩提示用户在外部浏览器中打开

使用微信打开网址时,无法在微信内打开app的下载链接.网上流传的各种微信打开下载链接,微信已更新基本失效,下面分享目前还可用的方案. 解决方案:弹出一个遮罩,提示用户在浏览器中打开进行下载或者是打开网页 在微信/QQ中打开链接,判断如果是在微信/QQ中打开的,直接弹出一个遮罩,提示用户在浏览器中打开,然后下载app应用.这样子再也不用管微信如何的更新,都可以实现微信中打开浏览器并下载app应用了. 需要微信遮罩,可加我的QQ: 1747006063 备注一下(微信遮罩) 文章转自熊猫源码:htt

微信/QQ打开网址弹出引导页引导在外部浏览器中打开

使用微信打开网址时,无法在微信内打开app的下载链接.网上流传的各种微信打开下载链接,微信已更新基本失效,下面分享目前还可用的方案. 解决方案:弹出一个遮罩,提示用户在浏览器中打开进行下载或者是打开网页 在微信/QQ中打开链接,判断如果是在微信/QQ中打开的,直接弹出一个遮罩,提示用户在浏览器中打开,然后下载app应用.这样子再也不用管微信如何的更新,都可以实现微信中打开浏览器并下载app应用了. 需要微信遮罩,可加我的QQ: 1747006063 备注一下(微信遮罩) 文章转自熊猫源码:htt

微信网页中打开网址弹出引导页引导在外部浏览器中打开

使用微信打开网址时,无法在微信内打开app的下载链接.网上流传的各种微信打开下载链接,微信已更新基本失效,下面分享目前还可用的方案. 解决方案:弹出一个遮罩,提示用户在浏览器中打开进行下载或者是打开网页 在微信/QQ中打开链接,判断如果是在微信/QQ中打开的,直接弹出一个遮罩,提示用户在浏览器中打开,然后下载app应用.这样子再也不用管微信如何的更新,都可以实现微信中打开浏览器并下载app应用了. 需要微信遮罩,可加我的QQ: 1747006063 备注一下(微信遮罩) 文章转自熊猫源码:htt

XP系统下Chrome浏览器打开某些网站闪退的解决办法

这个星期用Chrome浏览网站的过程中,突然出现没有什么提示的闪退现象.一开始没怎么注意,以为只是偶然现象,但当重启Chrome后点恢复按钮再次闪退,这就可以肯定是因为打开某些网站造成.于是再次重启Chrome浏览器并按下恢复按钮,在可能导致Chrome闪退那个网站打开之前关闭那个分页,这样Chrome就不闪退了.这个办法只能治标不能治本,下次再打开这个网站同样会出现闪退的现象. 为了彻底解决这个问题,于是就用搜索引擎找找看有没有解决办法.首先用"Chrome打开某些网站闪退"作为关键

向linux内核中添加外部中断驱动模块

本文主要介绍外部中断驱动模块的编写,包括:1.linux模块的框架及混杂设备的注册.卸载.操作函数集.2.中断的申请及释放.3.等待队列的使用.4.工作队列的使用.5.定时器的使用.6.向linux内核中添加外部中断驱动模块.7.完整驱动程序代码.linux的内核版本为linux2.6.32.2. 一.linux模块的框架以及混杂设备相关知识 1.内核模块的框架如下图所示,其中module_init()(图中有误,不是modules_init)只有在使用insmod命令手动加载模块时才会被调用,