Question

我正在与我的客户进行一个项目，我希望在浏览器的单页上打开多个网站，为此我使用iframe但是，我在openerp框架中被卡住了。在iframe我也设置了openerp屏幕，但问题是当我创建客户一旦到达创建时间，就不会打开向导。

有些代码在这里：

<iframe src="http://localhost:8069" name="mainFrame" >

我想知道<iframe>

的替代方案

Answer 1

出于安全原因，通过javascript在浏览器中访问多个网站的能力受到严重限制。我打算通过javascript和 iframe模仿者来表达这个显示其他网页的想法。对于这个应用程序，我会设置三类网站：

主机站点：在主机站点上，可以使用简单的ajax请求创建 iframe模仿器。这是孩子的东西。
第一方网站（主机除外）：在您有权访问服务器配置的任何网站上（或至少可以修改标头），您需要指定标头Access-Control-Allow-Origin: "host site name here"允许主机站点访问或Access-Control-Allow-Origin: *允许每个站点访问。
第三方网站：在第三方网站上，您必须希望网站的Access-Control-Allow-Origin标题设置为*，否则您需要说服该网站的管理员制作例外并允许您访问网站。

如果无法满足上述任何条件，那么您将受到用户浏览器安全性的支配。有些浏览器支持CORS（跨源资源共享），但它不可靠。通常，用户的浏览器会阻止对某些标头的访问（出于安全原因），但如果浏览器提供支持（或具有足够的安全性），则可以将标头设置为欺骗其他网站以授予您访问权限。请注意（如果允许）某些人可能会考虑这种边界黑客攻击，并且未经所有相关方许可，不得使用它。

$(document).ready(function() {
  var target_domain = "www.web-source.net";
  var protocol = "http://";
  var path = ""; //e.g. "/index.html"
  var target_host = protocol + target_domain;
  var target_URI = target_host + path;
  var method = "GET";
  $.ajax({
    url: target_URI,
    type: method,
    headers: {
      "X-Requested-With": "", //nullifies the default AJAX value of "XMLHttpRequest"
      "Origin": target_host, //lies to the target server
      "Referer": target_host, //lies to the target server
      "X-Http-Method-Override": method, //forces the specified method
    },
    crossDomain: "true" //applies cross domain settings
  });
});
$(document).ajaxSuccess(function() {
  $("#iframe_imitator").html(xhr.responseText);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="iframe_imitator"></div>

Answer 2

我在这篇文章中发现了这一点 - 可能值得a try

Alternative to iFrames with HTML5

<object data="http://www.web-source.net" width="600" height="400">
        <embed src="http://www.web-source.net" width="600" height="400"> </embed>
        Error: Embedded data could not be displayed.
    </object>

Answer 3

我认为您可以使用jQuery load：

<div id="divId"></div>
<script type='text/javascript'>
    $(document).ready(function (){
        $('#divId').load(URL of target);     
    });
</script>

Answer 4

您可以使用Ajax或jQuery替代iframe。我觉得jQuery会简单得多。您可以简单地实现它：

$('#SampleElement').load('YourURL');

这里，SampleElement是给定元素的ID。

关于iframe的替代选项？

4 个答案: