关于 iframe 的替代选项

regarding alternative option to iframe?

本文关键字：选项 iframe 关于      更新时间：2023-09-26

我正在和我的客户一起做一个项目，我想在浏览器上的单个页面上打开多个网站，为此目的我使用了iframe但是，我在打开erp框架中被卡住了。iframe我也设置了 openerp 屏幕，但问题是当我在创建时间后立即创建客户时，向导不会打开。

一些代码在这里：

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

我想知道<iframe>的替代方案

出于安全原因，通过javascript在浏览器中访问多个网站的能力受到严重限制。我将把这种通过javascript显示其他网页的想法称为iframe模仿器。对于此应用程序，我将设置三类站点：

    主机站点
  1. ：在主机站点上，可以使用简单的 ajax 请求创建 iframe 模仿器。这是孩子的东西。
  2. 第一方站点（主机除外）：在有权访问服务器配置（或至少可以修改标头）的任何站点上，您需要指定标头Access-Control-Allow-Origin: "host site name here"以允许主机站点的访问或Access-Control-Allow-Origin: *允许每个站点的访问。
  3. 第三方站点：在第三方站点上，您必须希望站点的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>

我在这篇文章中找到了这个 - 可能值得一试

使用 HTML5 替代 iFrame

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

我认为你可以使用jQuery load：

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

您可以使用 Ajax 或 jQuery 作为 iframe 的替代方案。我觉得jQuery会简单得多。您可以简单地将其实现为：

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

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

相关文章：