如何从 iframe 内部提交表单并将结果显示在外部

Posted 2023-02-22

【中文标题】如何从 iframe 内部提交表单并将结果显示在外部

【英文标题】：How to submit a form from inside an iframe and have result be outside

【发布时间】：2012-02-19 03:18:27

【问题描述】：

我一直在尝试在 iframe 内的静态页面中嵌入一个小型登录小部件，以允许某人登录我的网站。我遇到的问题是，当表单发布时，它最终出现在 iframe 中，而不是作为完整的浏览器页面。

我知道这样做是可能的，因为https://www.salliemae.com/ 在他们的主页上采用了相同的策略。他们在静态页面中嵌入了一个 iframe，为他们执行所有逻辑。我有非常相似的javascript，当有人点击时我调用form.submit()。唯一的区别是我使用 jQuery 来捕获点击事件而不是直接将 onclick 放在表单元素上。

我查看了他们的 Calm.js 中的代码，它似乎在执行一个简单的 form.submit() 操作，但是他们的页面完全在浏览器中加载而不是在 iframe 中。我环顾四周，没有看到类似的帖子，所以如果我错过了，请告诉我。

【问题讨论】：

如果请求跨域、端口或协议，浏览器会拒绝它。谷歌XSS了解更多信息。

就我而言（以及上面的 salliemae 示例），它们都在同一个域中。所以对于这个问题，假设两者都在同一个域上，我该怎么做？ Salliemae 只有较低级别的域共有，它们位于不同的子域（www. vs. login.）

【参考方案1】：

在 iframe 的 <form> 标记中查看 target="_top"。这告诉浏览器在父框架中加载响应。

【讨论】：

啊，我一直在努力想弄清楚三角洲是什么。谢谢！

【参考方案2】：

如果你不ajax内容，你只需在表单中添加target="_top"，否则你将不得不使用window.open(*serialisedurl*,"_top")