Ajaxでブラウザタイムアウトしそうな時間のかかる処理。iframe POSTのほうが便利だった件(@@)

業務アプリなどを製作するとき、DBやファイルのレコードデータに対して逐次に処理をすると、かなり時間がかかったりするときがあります。

処理の実行はajaxでやりたいとき、ブラウザのタイムアウト制限にかかって、処理が完了できないことがあります。
普通にポストして、flashすればブラウザのタイムアウトは回避できますが、

画面を書き換えたくない時 httpRequestdで進捗を取得するのは一筋縄ではいきません。

色々探してみても、これといった解決策がなかったんですが、

ふと、ajaxのときのファイルアップロドに iframe を使ってたのをおもいだしました。

それを参考に、簡単に画面遷移せずに処理の進捗を表示し、ブラウザのタイムアウトを回避する処理を作ってみました。

まずは

こちらを見ていただくのが早いとおもいます。

http://omni.ecopls.link/iframe/

やってることは非常にシンプルです。

dummyのiframeにポストして、そのiframeに親を更新するjavascriptを出力してるだけ

表面的には、ajaxのような挙動でシンプルに実現できました。

(サンプルは、SKYSEAやFortigateなどやプロキシ経由ではうまくいかないようだす。)

progress.php

<?php
  set_time_limit(0);
  ob_end_flush();
  echo str_pad(" ",4096)."<br /-->\n";
  for($i=1;$i&lt;=40;$i++){
    $echos= '<script type="text/javascript">';
    $echos.= 'parent.dialogprogress("処理中","'.$i.'/'.'40処理中'.'");';
    $echos.= '</script>';
    $echos.='*';
    echo $echos;
    flush();
    sleep(1);
  }
  $echos= '<script type="text/javascript">';
  $echos.= 'parent.dialogcomplate("完了","おはよう処理を実行しました");';
  $echos.= '</script>';
  
  echo $echos;

?>

index.php

<?php
echo'
<?xml version="1.0" encoding="UTF-8" >


<script type="text/javascript">

function exec(){
  document.mainform.target="dummy";
  document.mainform.action="progress.php";
  document.mainform.submit();

}
function dialogprogress(title,str){
  document.getElementById("dialog-header").innerHTML=title;
  document.getElementById("dialog-body").innerHTML=str;

}
function dialogcomplate(title,str){
  document.getElementById("dialog-header").innerHTML=title;
  document.getElementById("dialog-body").innerHTML=str;

}

</script></code></pre>
<form name="mainform">
<div class="container">
<div class="col-sm-4"></div>
<div class="col-sm-4">
<div id="dialog" class="panel panel-primary">
<div id="dialog-header" class="panel-heading">ダイアログ</div>
<div id="dialog-body" class="panel-body">内容です</div>
</div>
<p><input class="btn btn-primary " type="button" value="実行" /></div>
<div class="col-sm-4"></div>
</div>
</form>
';

?>