Question

我有这个图像调整工具，我从Bulk Resize Photos获得。我需要将其添加到名为“参与者中心”的CMS功能中。

由于某种原因，代码本身不会在参与者中心工作（它显示为空白），但它适用于参与者中心之外的HTML页面。所以我想也许iframe会起作用。

现在iframe的框架显示，但内容不显示。

HTML：

<div id="BulkResizePhotosEmbed"></div>
<script type="text/javascript" src="https://bulkresizephotos.com/js/integration.js">
</script>
<script>
bulkresizephotos.load({ "resize_type": "exact", "resize_value": "300", "secondary_resize_value": "400", "quality_level": "0.5", "extension": "jpg", "preserve_aspect_ratio": true, "transparent_background": true, "background_color": "ffffff" });
</script>

我将上述代码放在一个单独的html文档中，该文档与参与者中心位于同一服务器上。

HTML：

<iframe src="http://www.supportcbcf.com/site/PageNavigator/reus_image_resize.html"></iframe>

我也尝试将上述链接设为安全链接（https），但仍然无法加载。我试着用js小提琴，但它也没有在那里工作。现在我不认为参与者中心阻止任何javascript代码，因为它有一个温度计和筹款资金，动态更新。我查看了控制台日志，我没有收到任何错误。

任何帮助都会非常感激！

由于

Answer 1

为了使他们的网站更安全，并避免在其他网站中显示（这可能会恶化用户体验，甚至让用户认为内容来自其他网站），其中一些人拥有内容安全政策，定义了允许的frame-ancestors。

这允许他们通知浏览器他们只想嵌入某些网站。

如果您打开浏览器控制台，则会看到此错误：

拒绝显示＆＃39; https：//...'在一个框架中，因为祖先违反了以下内容安全政策指令：＆＃34;框架 - 祖先＆＃39; self＆＃39; * .facebook.com * .salesforce.com * .convio.net * .google.com * .force.com facebook.com salesforce.com convio.net google.com force.com＆＃34;。

如果您的网站的域名与该规则不符，您的浏览器将阻止该页面。

以下是此功能为何优秀的示例：

想象一下evilwebsite.com想要更多Facebook喜欢。他们可以在他们的网站上嵌入他们的Facebook页面的iframe，制作opacity: 0，并将其放在他们的内容前面，按钮位于隐形＆＃34; Like＆＃34;按钮。点击它的人实际上会点击＆＃34; Like＆＃34;按钮。免费喜欢！这就是为什么你不能在你的网站上嵌入常规Facebook页面的原因。

Answer 2

我认为该网站不允许使用JS，因此这个问题没有答案

页面不会通过iframe加载？

2 个答案: