【问题标题】:Phonegap iOS Iframe accessPhonegap iOS iframe 访问
【发布时间】:2013-07-18 16:40:37
【问题描述】:

从 PhoneGap 访问 iOS 中的 iframe

我很难让 PhoneGap(2.9.0) 访问 iOS (6.0.1) 上的 iframe。

应用程序的 index.html 包含一个 iframe 和一个函数,用于检查我是否可以在框架加载后读取框架的内容。

应用程序 index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, 
     maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, 
     target-densitydpi=device-dpi" />
    <script type="text/javascript" charset="utf-8" src="./phonegap.js"></script>
    <title>Test</title>
  </head>
  <body style="background-color: #000;">
    <iframe name="framewrap" id="framewrap"
        style="border:0;position: absolute; top: 0; 
        left: 0;width: 100%; height:100%; background-color: #fff;"
        src="http://www.somedomain.de/somepath/index.html">
    </iframe>

    <script type="text/javascript">
      window.setTimeout(go, 2000);
      function go(){
      iframe = document.getElementById('framewrap');
      innerDoc = iframe.contentWindow;
      alert(innerDoc.document.getElementById('canvas'));
      }
    </script>
  </body>
</html>

iframe 内的文档:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <script type="text/javascript">
      alert('iframe loaded');
    </script>
    <title>test</title>
  </head>
  <body style="margin:0;">
  <canvas id="canvas" style="position: absolute; top:0; left:0;">
    <p>Your browser does not support the canvas element.</p>
  </canvas>
  </body>
</html>

会发生什么:

如果我构建应用程序并在 Android(4.2.2) 上运行它,框架已加载,一个警报告诉我 iframe loaded,另一个警报对话框弹出告诉我有一个 HTMLCanvasElement。 但是,如果我在 iPod Touch 上打开应用程序,我只会收到一个警告对话框,告诉我 "null"。 没有 iframe loaded 警报表明 iframe 根本没有加载。

我已经尝试了很多方法来使其正常工作,但都失败了,而且由于我没有 Mac,我无法正确调试。 -thx 苹果-

我的怀疑:

与应用程序捆绑的html文件作为文件执行并使用file协议。 iframe 使用httpprotocol。因此,同源策略生效,我无法访问 iframe。

为什么我不确定:

但这意味着跨平台的行为不一致,因为它适用于 Android。所以我并不完全相信我的怀疑是正确的。 此外,缺少iframe loaded 警报将暗示同源策略不是问题,因为至少框架应该像在桌面上那样加载,其中同源策略只会阻止画布警报显示。

因此:

  1. 我的怀疑正确吗?

  2. 有没有办法让它跨平台工作?

感谢您的任何建议,希望有人可以帮助我。

感谢您抽出宝贵时间阅读!

【问题讨论】:

    标签: ios html iframe cordova same-origin-policy


    【解决方案1】:

    我不是 iframe 方面的专家,但是我会给你一个提示.. 使用 jquery out 的 load 函数而不是 iframe (http://api.jquery.com/load/) 或 GET 可以返回 html 形状的返回数据并显示在一个 div ...

    也许它是您尝试安装的 iframe 的更简单替代方案...

    【讨论】:

    • 感谢您的回复。我尝试过通过 ajax 和其他方式获取数据。不幸的是,iOS 阻止了这些。
    • 不会出现在跨域webservice调用的错误?我不知道您使用什么语言来创建 web 服务,但在 php 中看起来像: header('Access-Control-Allow-Origin: *'); header('Content-Type: application/json');
    猜你喜欢
    • 1970-01-01
    • 2023-03-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-12-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多