个人中心
gpt4 book ai didi

javascript - IFRAME 中的 PHP 脚本会阻止其他代码

转载 作者：搜寻专家 更新时间：2023-10-31 20:42:10 25 4
gpt4 key购买 nike

场景:

我有两个 PHP 脚本要同时调用:

  1. 第一个脚本将运行几分钟(基于 PHP 的文件下载)，具体取决于下载的文件大小。它被放入 <iframe>因此它可以单独运行并且不会阻塞浏览器。
  2. 应该定期调用第二个 PHP 脚本来监视第一个脚本的执行 - 文件下载进度。为了避免在脚本完成时打开新窗口，它通过 AJAX 调用。

问题:

我已将长时间运行的 PHP 脚本(下载脚本)放入 <iframe>因此该脚本可以与其他监控 PHP 脚本异步运行。但是，尽管主脚本在 <iframe> 中，当网页开始执行时，脚本启动并阻止执行剩余的 JavaScript 代码和通过 AJAX 多次调用的监控脚本。

让短期运行的监控 PHP 脚本与长时间运行的 PHP(下载)脚本同时调用很重要，这样短期运行的(监控)脚本可以向 JavaScript 提供反馈。

请您帮我分析一下我的代码示例好吗？我不知道，我的问题在哪里。我的代码非常简单，一切都应该运行良好。

  • PHP 版本 5.4.12
  • Apache/2.4.4 (Win64) PHP/5.4.12
  • Windows 7 x64
  • 8GB 内存
  • 谷歌浏览器版本 30.0.1599.101 m

代码示例:

调用两个 PHP 脚本的 JavaScript 代码:

<!DOCTYPE html>
<html>
<head>
    <title>Title of the document</title>
</head>

<body onload="callScripts();">


<script type="text/javascript">

    // 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 && xmlhttp.status==200)
            {
                console.log("Response Received: " + xmlhttp.responseText);
            }
        }
        xmlhttp.open("GET", "PHP/fileDownloadStatus.php", true);
        xmlhttp.send();
    }
</script>

<iframe src="PHP/fileDownload.php"></iframe>

</body>
</html>

PHP 监控脚本(fileDownloadStatus.php)

<?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";
?>

PHP 长时间运行脚本 (fileDownload.php)

<?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 < 60; $count++)
{
    sleep(1);

    print("fileDownload Script was called: ". $count);

    echo "Download script: " . $count;
    ob_flush();
    flush();
}
?>

截图:

PHP 脚本执行顺序 - 浏览器等待完成 <iframe> 中的脚本 Scripts execution order

最佳答案

你的问题和你想象的一样简单。你只是没有意识到它可能是因为缺乏 HTML 知识。所以你的代码没问题，一切都按你想要的方式工作，但应该同时运行的脚本却没有，问题是什么？

<body onload="callScripts();">

这是你的问题。 onload仅当所有内容都在 body 中时才会调用标签已完全加载。所以，作为你的 iframe在 body 里面html 解释器加载所有内容(包括 iframe 及其源代码)，然后调用您的 callScripts功能。

为了解决您的问题，我建议您创建自己的 iframe在你的脚本中。会是这样的:

<!DOCTYPE html>
<html>
<head>
    <title>Title of the document</title>

    <!-- You should always define your script in the head tag. best pratice
     defined in W3C -->

<script type="text/javascript">

    callScripts = function (){
         //write your Iframe Here
         document.getElementById("callDownload").innerHTML = '<iframe src="PHP/fileDownload.php"></iframe>'; 
         callScripts_refresh();
    }

    // call both PHP scripts(download and monitoring) in desired order
    callScripts_refresh = 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 && xmlhttp.status==200)
            {
                console.log("Response Received: " + xmlhttp.responseText);
            }
        }
        xmlhttp.open("GET", "PHP/fileDownloadStatus.php", true);
        xmlhttp.send();
    }
</script>

</head>

<body onload="callScripts();">

<div id="callDownload"></div>

</body>
</html>

如果成功了请告诉我

关于javascript - IFRAME 中的 PHP 脚本会阻止其他代码，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19692282/

25 4 0
文章推荐： php - Google Maps API 在有效请求中返回 "Invalid Request"
文章推荐： php - 如何获取 DOMText 的父节点？
文章推荐： javascript - 如何使 define php 也可以在 js 中使用
文章推荐： php - 2013 年的密码哈希
搜寻专家
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com