Question 40622 in PHP Question posted in
Official manual can be found here.

PHP Script called by fetch twice is blocking

I have 2 fetch functions calling the same PHP Script. The whole content of the PHP-Script is the following:

<?php

session_write_close();
sleep(10);

session_write_close(); is only there to make sure the Session is really closed. However the first Script finishes after ~10 Seconds and the second Script after ~20 Seconds:

Network Tab

Why is Script 1 blocking Script 2?

For the sake of completeness here is the JavaScript:

async function test() {
    fetch('api/v1/test')
    fetch('api/v1/test')
}
test();
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    For everyone else who faces the same problem: If you develop locally on the Built-In web server you need the following setting: PHP_CLI_SERVER_WORKERS

    Windows is currently not supported and PHP >=7.4 is needed.

    Link to the documentation: Documentation


  2. 0

    As per the comment above, I am unable to replicate the blocking behaviour you mention.

    Using essentially the same function and sending a minimal GET request to the PHP endpoint (in this case the same page ) that does essentially the same as the original the requests all return content almost together.

    <?php
    $t=10;

    if( $_SERVER['REQUEST_METHOD']=='GET' && isset( $_GET['task'], $_GET['seq'], $_GET['func'] ) && $_GET['task']=='test' ){
        session_write_close();
        sleep( $t );
        
        exit( 'ok: sequence: ' . $_GET['seq'] . ' func: ' . $_GET['func'] . ' date: ' . date( DATE_ATOM )  );
    }
    
?>
<!DOCTYPE html>
<html lang='en'>
    <head>
        <meta charset='utf-8' />
        <title>Blocking or not-blocking?</title>
    </head>
    <body>
        <div id='results'><div>
        
        <script>
        
            const callback=(r)=>{
                document.getElementById('results').innerHTML += `${r}<br />`;
            }
            
            const test=()=>{
                fetch('?task=test&seq=1&func=1')
                    .then(r=>r.text())
                    .then(callback);
                    
                fetch('?task=test&seq=2&func=1')
                    .then(r=>r.text())
                    .then(callback);
                    
            };
            async function test2() {
                fetch('?task=test&seq=1&func=2')
                    .then(r=>r.text())
                    .then(callback);
                    
                fetch('?task=test&seq=2&func=2')
                    .then(r=>r.text())
                    .then(callback);    
            }
            
            callback(`Begin Tests: ${new Date()}`);
            test();
            test2();
        </script>
    </body>
</html>

    This yields, for example:

    Begin Tests: Thu Feb 09 2023 12:18:59 GMT+0000 (Greenwich Mean Time)
ok: sequence: 1 func: 1 date: 2023-02-09T12:19:09+00:00
ok: sequence: 2 func: 1 date: 2023-02-09T12:19:09+00:00
ok: sequence: 1 func: 2 date: 2023-02-09T12:19:09+00:00
ok: sequence: 2 func: 2 date: 2023-02-09T12:19:09+00:00
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search