如何在 ionic 2 中使用 inAppBrowser 插件的“executeScript”方法？答案

【问题标题】：How to use "executeScript" method of inAppBrowser plugin in ionic 2?如何在 ionic 2 中使用 inAppBrowser 插件的“executeScript”方法？
【发布时间】：2017-07-10 18:59:33
【问题描述】：

我在点击事件中有这段代码

let browser = new InAppBrowser('http://example.com/test', '_self');
browser.executeScript({code: "(function() { alert(123); })()"});

当我单击按钮时，inAppBrowser 打开页面，但脚本没有运行。
我关闭了浏览器，然后再次单击该按钮，现在脚本确实运行了。

为什么第一次没有运行？

【问题讨论】：

标签： cordova ionic-framework ionic2 inappbrowser

【解决方案1】：

@RezaT1994 将“_self”更改为“_blank”为我解决了这个问题。

let browser = new InAppBrowser('http://example.com/test', '_blank');
browser.executeScript({code: "(function() { alert(123); })()"});

【讨论】：

【解决方案2】：

@Andrews 的回答非常适合我。这是我使用 @ionic-native/themeable-browser 的 Ionic 3 应用程序的完整代码：

let options: ThemeableBrowserOptions = {
        statusbar: { color: '#1976d2ff' },
        toolbar: { height: 44, color: '#1976d2ff' },
        closeButton: { align: 'right', event: 'closed', wwwImage: '/assets/images/icons/close-empty.png', wwwImagePressed: '/assets/images/icons/close-outline.png', wwwImageDensity: 3 },
        usewkwebview: 'yes',
        disallowoverscroll: 'yes',
        allowInlineMediaPlayback: 'yes',
        mediaPlaybackRequiresUserAction: 'no'
    },
    browser: ThemeableBrowserObject = self.iab.create(url, '_blank', options);
if (this.platform.is('ios')) {
    browser.on('loadstop').subscribe(() => {
        browser.executeScript({ code: 'document.body.classList.add("cordova-ios");' });
    });
}

这样我可以通过 body.cordova-ios 类继承在 Cordova 中明确设置 iOS 样式

【讨论】：

【解决方案3】：

尝试运行以下代码。这对我有用。

   var ref = cordova.InAppBrowser.open("https://www.test.com/", '_blank');
            ref.addEventListener('loadstart', function() {
                ref.executeScript({
                    code: '//put the script you want to run here'
                });
            })

请确保给出 _blank 而不是 _system。 _system 将打开本机浏览器（例如 chrome）

【讨论】：

亲爱的。团队，我们想将 cookie 解析到浏览器，我们正在开发基于 ionic 3 的应用程序。请帮助我们
我们试过 this.inAppBrowserInstance = this.inAppBrowser.create(URL, '_blank'); this.inAppBrowserInstance.on('beforeload') .subscribe(event => { this.inAppBrowserInstance.executeScript({ code: document.cookie = "JSESSIONID=cookievalue" }).then(). 但不工作

【解决方案4】：

它不再以这种方式工作了。试试吧！

browser.on('loadstop').subscribe(() => {
  browser.executeScript({code: 'your_code'})
});

这对我有用。

【讨论】：

【解决方案5】：

在 InAppBrowser.addEventListener (loadstart, loadstop, loaderror) 中添加 executeScript，然后它将在第一次运行。我使用的是 ionic 1，但我想它也适用于 ionic 2。我在下面添加了一个示例代码。（这就是它在 ionic 1 中的样子）。

  browser.addEventListener('loadstart', function(){
            browser.executeScript({code: "(function() { alert(123); })()"});
        })

【讨论】：

当我尝试 addEventListener 时，它告诉我“'InAppBrowser' 类型上不存在属性 'addEventListener'。这是怎么回事？
你安装了cordova-plugin-inappbrowser吗？
我做到了，并且该方法不是 Ionic 包装版本的一部分。我通过使用常规的 cordova 版本获得了访问权限。
@rashadb 使用 Ionic 包装器，使用 on 而不是 addEventListener。见stackoverflow.com/a/47560757/276648