title: PHP Script in IFRAME Blocks Other Code
body: <h2>Scenario:</h2>
  
  <p>I have two PHP scripts to be called simultaneously:</p>
  
  <ol>
  <li>The first script will run several minutes (PHP based file download), depending on downloaded file size. It is placed into <code>&lt;iframe&gt;</code> so it can run separately and does not block the browser.</li>
  <li>The second PHP script is supposed to be called in regular intervals to monitor execution of the first script - file progress download. To avoid opening new windows upon script completion, it is called via AJAX.</li>
  </ol>
  
  <h2>Problem:</h2>
  
  <p>I have placed the long-running PHP Script (download script) into <code>&lt;iframe&gt;</code> so this script can run asynchronously with other monitoring PHP script. However, despite the main script is in <code>&lt;iframe&gt;</code>, when the webpage starts execution, the script starts and blocks execution of the remaining JavaScript code and monitoring script called multiple times via AJAX. </p>
  
  <p>It is important to have the short-running monitoring PHP script called simultaneously with the long-running PHP (download) script, so the short-running (monitoring)script can provide feedback to JavaScript.</p>
  
  <p>Would you be so kind and analyze my code samples please? I have no idea, where is my problem. My code is so simple, that everything should be running well.</p>
  
  <ul>
  <li>PHP Version 5.4.12</li>
  <li>Apache/2.4.4 (Win64) PHP/5.4.12</li>
  <li>Windows 7 x64</li>
  <li>8GB RAM</li>
  <li>Google Chrome Version 30.0.1599.101 m</li>
  </ul>
  
  <h2>Code Samples:</h2>
  
  <p><em>JavaScript code calling both PHP scripts:</em></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Title of the document&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body onload="callScripts();"&gt;
  
  
  &lt;script type="text/javascript"&gt;
  
      // call both PHP scripts(download and monitoring) in desired order
      callScripts = function()
      {
          // call the monitoring PHP script multiple times in 2 second intervals
          window.setTimeout(function(){startDownloadMonitoring()}, 1000);
          window.setTimeout(function(){startDownloadMonitoring()}, 3000);
          window.setTimeout(function(){startDownloadMonitoring()}, 5000);
          window.setTimeout(function(){startDownloadMonitoring()}, 7000);
          window.setTimeout(function(){startDownloadMonitoring()}, 9000);
      };
  
  
      // call monitoring PHP script via AJAX
      function startDownloadMonitoring()
      {
          console.log("Calling startDownloadMonitoring()...");
  
          var xmlhttp;
  
          if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest();
          }
          else
          {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
  
          xmlhttp.onreadystatechange = function()
          {
              if (xmlhttp.readyState==4 &amp;&amp; xmlhttp.status==200)
              {
                  console.log("Response Received: " + xmlhttp.responseText);
              }
          }
          xmlhttp.open("GET", "PHP/fileDownloadStatus.php", true);
          xmlhttp.send();
      }
  &lt;/script&gt;
  
  &lt;iframe src="PHP/fileDownload.php"&gt;&lt;/iframe&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><em>PHP Monitoring Script(fileDownloadStatus.php)</em></p>
  
  <pre><code>&lt;?php
  
  include 'ChromePhp.php';
  
  // start session, update session variable, close session
  session_start();
  $_SESSION['DownloadProgress']++;
  ChromePhp::log('$_SESSION[\'DownloadProgress\'] = ' . $_SESSION['DownloadProgress']);
  session_write_close();    
  
  echo "success";
  ?&gt;
  </code></pre>
  
  <p><em>PHP long-running script (fileDownload.php)</em></p>
  
  <pre><code>&lt;?php
  include 'ChromePhp.php';
  
  // disable script expiry
  set_time_limit(0);    
  
  // start session if session is not already started
  session_start();
  
  // prepare session variables
  $_SESSION['DownloadProgress'] = 10;
  
  session_write_close();
  
  for( $count = 0; $count &lt; 60; $count++)
  {
      sleep(1);
  
      print("fileDownload Script was called: ". $count);
  
      echo "Download script: " . $count;
      ob_flush();
      flush();
  }
  ?&gt;
  </code></pre>
  
  <h2>Screenshot:</h2>
  
  <p><em>PHP Scripts Execution Order - browser waits to finish the script in <code>&lt;iframe&gt;</code></em>
  <img src="https://i.stack.imgur.com/ra05x.png" alt="Scripts execution order"></p>