javascript - 跨站点嵌入 Web 控件 - 使用 IFrame/Javascript

Question

我只是在寻求对此的澄清。

假设我有一个小型 Web 表单，如果您愿意的话，它是一个“小部件”，它获取数据，对其进行一些客户端验证或其他 AJAX-y 废话，然后单击一个按钮将定向到另一个页面。

如果我希望它成为一个“可嵌入”的组件，以便其他人可以将其粘贴到他们的网站上，我是否仅限于将它基本上封装在一个 iframe 中？

我在那个 iframe 中能做什么和不能做什么有什么限制吗？

例如，将您带到另一个页面的按钮 - 这会加载 iframe 中的内容？所以它需要与 iframe 一起存在吗？

最后，如果用户点击的按钮会将他们带到 https 页面以验证信用卡详细信息，是否有任何特定的安全禁忌可以阻止这种情况发生？

编辑:举个我正在讨论的例子，考虑在页面上嵌入 googlemaps 或 multimap。

编辑编辑:好的，我想我明白了。

有两种方法。

一个 - 嵌入到 IFrame 中，但这是有限的。

二 - 创建一个 Javascript API，并要求消费者链接到它。但这对消费者和创作者来说要复杂得多。

我做对了吗？

谢谢邓肯

Answer 1

这两种方法各有优点。我个人不会在我的页面上使用其他人的 Javascript，除非我绝对确定我可以信任来源。制作一个提交页面上所有输入框的值的恶意脚本并不难。如果您不需要访问页面内容，那么使用 iframe 将是最佳选择。

可以使用 target 属性“告知”按钮和链接在顶部或父框架中导航，如下所示:

<a href="http://some.url/with/a/page" target="_top">This is a link</a>
<form action="http://some.url/with/a/page" target="_parent"><button type="submit">This is a button</button></form>

在这种情况下，由于您正在离开托管页面，因此同源策略将不适用。

在类似情况下，小部件通常是放置在您页面上的 iframe。 iGoogle 和 Windows Live 小工具(据我所知)托管在 iframe 中，这是出于非常充分的理由 - 安全性。