如何在 Ionic 2 中使用 inAppBrowser 插件的 "executeScript" 方法？

Question

如何在 Ionic 2 中使用 inAppBrowser 插件的 "executeScript" 方法？

cordovaionic-frameworkionic2inappbrowser

5

我有一个点击事件的代码：

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

当我点击按钮时，inAppBrowser会打开页面，但是脚本不会运行。
我关闭了浏览器，然后再次点击按钮，现在脚本就可以运行了。为什么第一次不运行呢？

- RezaT1994

6个回答

2

现在这种方式已经不起作用了。试试看！

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

这对我有效。

- Andrews Duarte

0

@RezaT1994 把'_self'改成'_blank'，这个问题就解决了。

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

- Palindromek

0

最近的开发中，我注意到在最新的ionic项目中没有任何事件监听器起作用。然而，即使不添加任何事件监听器，你仍然可以通过直接调用InAppBrowser.executeScript()函数在你的InAppBrowser中添加JavaScript代码。

- Meshu Deb Nath

0

尝试运行以下代码。这对我来说是有效的。

   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）。

- Johnu James Marattil

亲爱的团队，我们想要将cookie解析到浏览器中，并且我们正在基于Ionic 3开发应用程序。请帮助我们。 - Developer KE

我们尝试了这个代码：this.inAppBrowserInstance = this.inAppBrowser.create(URL, '_blank');
然后我们监听了beforeload事件： this.inAppBrowserInstance.on('beforeload') .subscribe(event => { 但是我们执行了以下代码却没有生效： this.inAppBrowserInstance.executeScript({ code: document.cookie = "JSESSIONID=cookievalue" }).then()。 - Developer KE

0

@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 样式设置样式。

- TaeKwonJoe

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- coder · Accepted Answer

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

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