【问题标题】:How to return value from InAppBrowser to Ionic app如何将值从 InAppBrowser 返回到 Ionic 应用程序
【发布时间】:2021-11-30 18:14:20
【问题描述】:

我们正在从 ionic 应用程序的 inappbrowser 中加载给定的 URL,它将加载 HTML 表单以及一个隐藏的输入字段。

我正在尝试使用 inappbrowser 的 executeScript 方法点击提交按钮时获取该隐藏字段值,如下所示:

  browser.executeScript({
      code:
        "var result; document.getElementById('BtnSubmit').addEventListener('click', function(){" +
        "result = document.getElementById('myInput').value;});",
    });

在结果变量中,获取输入值,但需要将其从 executeScript 返回到 ionic 应用程序上下文中。

【问题讨论】:

    标签: javascript ionic-framework ionic4 inappbrowser ionic5


    【解决方案1】:

    您需要将您的响应附加到inappbrowser的消息事件中,然后在应用端接收。

    下面的脚本是发送邮件。它具有通过它的特定格式。需要创建 JSON 对象。

    browser.executeScript({
    code: "document.getElementById('customBackbtn').onclick = function() {\
    var message = 'close';\
    var messageObj = {message: message};\
    var stringifiedMessageObj = JSON.stringify(messageObj);\
    webkit.messageHandlers.cordova_iab.postMessage('stringifiedMessageObj');\
    }"});
    

    然后在您的应用中捕获来自 iab 的发布消息:

    browser.on('message').subscribe((val)=>{
    const postObject:any = val;
    
    //Do whatever you want to with postObject response from inappbrowser
    
    });
    

    【讨论】:

    • 是否有任何解决方法可以从浏览器中加载的 URL 中获取请求参数或标头?
    • 是的,一旦您打开了 inAppBrowser 实例,您就可以执行脚本来获取 url 并使用正则表达式操作从查询参数中获取参数。如果这就是你要找的。但我建议您使用上述答案从 inappbrowser 获取带有参数的 url 作为发布响应,然后您可以操作以角度接收的对象。这样处理会更容易..
    • 请求参数作为表单数据附加到 URL 中而不是查询参数。是否可以从 inappbrowser 获取?
    • @Muthuraja 是的,这是可能的。您需要捕获 window.location.href 的响应作为 executeScript 的一部分,并使用 post 消息将字符串拉到您的角度侧,以便对已获取数据的字符串执行任何您想要的操作。就表单数据而言,如果它作为服务响应的一部分出现,那么我不确定我们如何将这些数据提取到我们的应用程序中。
    • 好的@vishal。需要从服务响应中获取该值...这是我的要求
    猜你喜欢
    • 2018-02-02
    • 1970-01-01
    • 1970-01-01
    • 2020-09-23
    • 1970-01-01
    • 1970-01-01
    • 2021-07-14
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多