iframe发送post请求

昨天踩了个坑,本来一个简单的页面能够很快上线的,结果半天没搞好。

需求是使用iframe,然后发送一个post请求去获得响应页面。平时使用iframe时,设定的src属性是get请求方式。

一般有两种方式:

  1. ajax使用post请求返回页面,直接将返回的页面数据放入iframe标签中
  2. 结合form表单,利用form表单的post请求方式达到目的,我采用了这种方法

我参考html中iframe请求设定为post方式,采用了增加一个form表单的标签,method设置为post,target设置与iframe的name属性相同。

html代码

<form
        id="ttsForm" target="iframe" method="post" action="url" >
</form>
<iframe name="iframe" frameborder="0" class="layadmin-iframe"></iframe>

js代码

$('#ttsForm').attr('action', 'url');
$('#ttsForm').submit();

以上方式在第一次刷新页面时,的确是发送了post请求,获得了正确的响应。当在第二次点击到这个iframe页面的时候,却发现不发送post请求,只有手动重新刷一次页面才会发送请求。

在查找多种解决方案后, 参考了Stack Overflow上的一个回答,采用下面的方法终于解决了这个iframe的post请求问题,以下方法使得每次在切换到这个iframe中时都会发送post请求。

<form
        id="ttsForm" target="iframe" method="post" action="url" >
</form>
<iframe name="iframe" frameborder="0" class="layadmin-iframe"></iframe>

<script type="text/javascript">
    document.getElementById('ttsForm').submit();
</script>

本文参考:
[1] html中iframe请求设定为post方式
[2] Sending data through post method to an iframe

posted @ 2020-10-20 10:16  Sincere_Ye  阅读(8832)  评论(0编辑  收藏  举报