如何在不使用 iframe 的情况下嵌入外部网页？答案

【问题标题】：How to embed an external webpage without using iframe?如何在不使用 iframe 的情况下嵌入外部网页？
【发布时间】：2016-08-27 19:20:48
【问题描述】：

我正在尝试在网页中嵌入亚马逊网站。类似于这里所做的事情： http://en-jo.amazon.shop.cashbasha.com/

我尝试使用 iframe，但亚马逊阻止它作为安全措施显示：

<iframe src="http://www.amazon.com/" width="100%" height="100%">
  <p>Your browser does not support iframes.</p>
</iframe>

我得到错误：

拒绝在框架中显示“http://www.amazon.com/”，因为它设置了 'X-Frame-Options' 到 'SAMEORIGIN'。

如果亚马逊不允许，那么上面的网站是如何实现的呢？

【问题讨论】：

【解决方案1】：

您所引用的网站似乎是通过在其网页中输入纯 javascript 代码和 html 来实现的。小心这个网站，因为它可能是一个网络钓鱼诈骗。

【讨论】：

【解决方案2】：

我认为这种方法不会对您产生太大影响。浏览器对 iframe 和混合安全级别越来越挑剔。从长远来看，试图在您的客户端上寻找破解方法来规避这一点肯定会失败，并使您的用户面临风险。

顺便说一句，我不会（也不会）点击格式与您发布的链接相同的链接。如果我在 URL 中看到 Amazon，我希望它是基本域。否则，我认为它旨在欺骗用户，因此即使找到了技术解决方案，我认为您也不应该在实践中部署它。

【讨论】：

我要做的就是在用户完成购物后从亚马逊导入购物车内容。因此，我引用的网站的做法是设置一个顶部栏，该栏有一个可供选择的结帐方式。这个想法是允许人们通过我们从亚马逊购买产品，这样他们就可以用现金支付。如果嵌入不是一个好主意，还有其他选择吗？
您可以利用 Amazon 的公共 API 以编程方式获取购物车内容，而不是从浏览器界面进行暴力破解。这将为用户提供更健壮（即错误更少）的体验。但是，我以前从未使用过此界面，因此您可以通过打开一个新问题来获得更好的反馈，询问“如何”来完成您正在寻找的内容，而不是您选择的特定机制的详细信息。这是一些亚马逊购物车方法的链接：docs.aws.amazon.com/AWSECommerceService/latest/DG/…

【解决方案3】：

您可以使用X-Frame-Bypass 自定义元素，它允许您绕过X-Frame-Options: deny/sameorigin。

【讨论】：