如何在cordova inappbrowser中检测重定向的URL并关闭浏览器答案

【问题标题】：How to detect redirected URL in cordova inappbrowser and close browser如何在cordova inappbrowser中检测重定向的URL并关闭浏览器
【发布时间】：2019-07-07 07:09:21
【问题描述】：

我正在为我的 ionic 应用程序使用 cordova inappbrowser。我需要检测 url 何时重定向到 http://xx.success.html or http://xx.failure.html

我的代码：

public openWithCordovaBrowser(url: string) {
    //where are events triggered (_self,_blank,_window)?
    let target = "_self"; 

    let inAppBrowserObject = this.inAppBrowser.create(url, target, this.inAppBrowserOptions);

                //When the page is success, close inappbrowser
    if (inAppBrowserObject.on('loadstart').subscribe) {
      inAppBrowserObject.on('loadstart').subscribe((e: InAppBrowserEvent) => {
        if (e && e.url) {
          if (e.url.includes('success.html')) {
            inAppBrowserObject.close(); //not reached?
          }
        }
      });
    }

               //When the InAppBrowser is closed, check and use the last viewed URL
    if (inAppBrowserObject.on('exit').subscribe) {
      inAppBrowserObject.on('exit').subscribe((e: InAppBrowserEvent) => {
        if (url) {
        console.log('exit: ' + e); //this is reached
        }
      });
    }
  }

不起作用，inAppBrowserObject.close() 永远不会被调用。

chrome 开发控制台中的错误：

Error in Success callbackId: InAppBrowser780208391 : TypeError: Object(...) is not a function
cordova.js:310 TypeError: Object(...) is not a function
    at InAppBrowserObject.close (vendor.js:81063)
    at SafeSubscriber._next (main.js:411)
    at SafeSubscriber.__tryOrUnsub (vendor.js:20899)
    at SafeSubscriber.next (vendor.js:20846)
    at Subscriber._next (vendor.js:20786)
    at Subscriber.next (vendor.js:20750)
    at Channel.fire (cordova.js:843)
    at InAppBrowser._eventHandler (inappbrowser.js:48)
    at cb (inappbrowser.js:108)
    at Object.callbackFromNative (cordova.js:291)

但是关闭浏览器调用console.log('exit: ' + e);

我的 inAppBrowser 对象如下所示：

【问题讨论】：

你能发布 nAppBrowserObject.on('loadstart') 的输出吗？
添加了调试输出

标签： cordova ionic-framework phonegap-plugins hybrid-mobile-app

【解决方案1】：

似乎您在这里指的是两个不同的实例。尝试将目标设为“_blank”。 Cordova 文档说：

_self：如果 URL 在白名单中，则在 Cordova WebView 中打开，否则在 InAppBrowser 中打开。

_blank：在 InAppBrowser 中打开。

参考：https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/

【讨论】：

【解决方案2】：

这是一个 Cordova 插件问题。 Issue link

我删除了 cordova 和 npm 插件 5.x.x 并安装了 4.20.0。这样就解决了问题。

删除旧版本：

cordova plugin remove cordova-plugin-inappbrowser
npm uninstall @ionic-native/in-app-browser --save

安装 4.20.0 版本：

ionic cordova plugin add cordova-plugin-inappbrowser
npm install --save @ionic-native/in-app-browser@4.20.0

导入也改变自

import { InAppBrowser, InAppBrowserObject } from '@ionic-native/in-app-browser/ngx'

到

import { InAppBrowser, InAppBrowserObject } from '@ionic-native/in-app-browser'

【讨论】：

【解决方案3】：

我有这个解决方案与 cordova 8 和 ionic 3.20 配合得很好。你需要调用 .show 吗？似乎与屏幕从未处于 .show 状态有关 - 也许？如果您的浏览器默认隐藏。

  const iabrowser = this.inAppBrowser.create(this.signupUrl,'_self',iabOptions);

  this.loader.presentLoading();
    iabrowser.on('loadstart').subscribe(event =>{
    console.log(event);
    iabrowser.executeScript({code: "alert('loadstart! I am an alert box!!')"});
    if (event && event.url) {
        if (event.url.includes('/app/main/login')) {
            iabrowser.close();
        }
    }
    iabrowser.show();
  });
  iabrowser.on('loadstop').subscribe(event =>{
    console.log(event);
    this.loader.dismissLoading();
  });

【讨论】：