Closed Bug 1670572 Opened 4 years ago Closed 4 years ago

Fetch request fails with "NetworkError when attempting to fetch resource." on beforeunload

Categories

(Core :: DOM: Networking, defect)

Firefox 83
defect

Tracking

()

RESOLVED DUPLICATE of bug 1342484

People

(Reporter: bezengi, Unassigned)

References

(Blocks 1 open bug)

Details

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.121 Safari/537.36

Steps to reproduce:

  1. Create a simple node.js handler (node version v12.18.0)
require('http').createServer((req, res) => {
  res.setHeader('Content-Type', 'text/html; charset=utf-8');
  res.end(`
    <script>
      addEventListener('beforeunload', async (e) => {
        console.log('unload: start');
        try {
          const response = await fetch('', {keepalive: true});
          console.log(await response.text());
        } catch(e) {
          console.error('error', e);
        }
        console.log('unload: end');
      })
    </script>
  `);
}).listen(3000);

save as server.js
2. Run a web server with node server.js, open http://localhost:3000/
3. Open dev tools, refresh the page

Actual results:

The console output is

unload: start
error TypeError: NetworkError when attempting to fetch resource.
Navigated to http://localhost:3000/
unload: end

Expected results:

The output should be something like

unload: start
    <script>
      addEventListener('beforeunload', async (e) => {
        console.log('unload: start');
        try {
          const response = await fetch('', {keepalive: true, method: 'POST', body: 'my data'});
          console.log(await response.text());
        } catch(e) {
          console.error('error', e);
        }
        console.log('unload: end');
      })
    </script>

unload: end
Navigated to http://localhost:3000/

(this is what I see in Chrome Version 85.0.4183.121)

Example with post request:

require('http').createServer((req, res) => {
  console.log(`Processing ${req.url}, method: ${req.method}`);
  if (req.method === 'POST') {
    let body = '';
    req.on('data', (data) => {
      body += data;
    })
    req.on('end', (data) => {
      console.log(`Request body: "${body}"`);
    });
  }
  res.setHeader('Content-Type', 'text/html; charset=utf-8');
  res.end(`
    <script>
      addEventListener('beforeunload', async (e) => {
        console.log('unload: start');
        try {
          const response = await fetch('', {keepalive: true, method: 'POST', body: 'my data'});
          console.log(await response.text());
        } catch(e) {
          console.error('error', e);
        }
        console.log('unload: end');
      })
    </script>
  `);
}).listen(3000);

Actual result:

Processing /, method: GET

is the only record logged in the node process output

Expected result:

Processing /, method: GET
Processing /, method: POST
Request body: "my data"

record is logged in the node process output

Setting a component for this issue in order to get the dev team involved.
If you feel it's an incorrect one please feel free to change it to a more appropriate one.

Component: Untriaged → Networking
Product: Firefox → Core

Thank you for the high quality report.

I don't think the keepalive: true option makes any difference.
It doesn't seem to be implemented in Firefox yet - see bug 1342484.

Anne, does the standard say anything about this?

Blocks: fetch
Component: Networking → DOM: Networking
Flags: needinfo?(annevk)
See Also: → fetchKeepAlive
Summary: Fetch request with "keepalive: true" fails with "NetworkError when attempting to fetch resource." on beforeunload → Fetch request fails with "NetworkError when attempting to fetch resource." on beforeunload

keepalive would allow for keeping the request alive beyond the lifetime of the document (modulo some constraints). I think that makes this a duplicate.

Flags: needinfo?(annevk)

(In reply to Anne (:annevk) from comment #4)

keepalive would allow for keeping the request alive beyond the lifetime of the document (modulo some constraints). I think that makes this a duplicate.

Ah, yes, that makes sense then. Thank you!

Status: UNCONFIRMED → RESOLVED
Closed: 4 years ago
Resolution: --- → DUPLICATE

Thank you for the reply. Somehow I was under impression that this should've worked in Firefox by now :)

You need to log in before you can comment on or make changes to this bug.