17

I want to use the quite new beacon api. I searched the web but I couldn't find data what is the size limit of the sent data. In the reference it's written it's meant for small amount of data but I have to know how little...

Zbun
  • 4,875
  • 4
  • 19
  • 28

2 Answers2

14

The maximum size, if set, will be up to the user agent (browser, or whatever).

See http://www.w3.org/TR/beacon/#sec-sendBeacon-method

You could easily create a test for the data size limit in your web page by creating strings of variable length N (starting with an arbitrarily high value for N, and using binary search), and check the return value of sendBeacon (per the spec, sendBeacon returns false when the user agent data limit is exceeded).

For example, I used this method to confirm that in Chrome 40 on Windows 7 the limit is 65536 (2^16).

Example code (without the binary search for n):

var url = 'http://jsfiddle.net?sendbeacon';
var n = 65536; // sendBeacon limit for Chrome v40 on Windows (2^16)

// this method courtesy of http://stackoverflow.com/questions/14343844/create-a-string-of-variable-length-filled-with-a-repeated-character
var data = new Array(n+1).join('X'); // generate string of length n

if(!navigator.sendBeacon(url, data))
{
   alert('data limit reached');
}
nothingisnecessary
  • 6,099
  • 36
  • 60
  • I did a test similar to what you wrote. I saw that I can send a long message (lets say 32000 bytes), but then I can't do it twice. the second time I get false. I retried it and again - once I send a big message - the next one must be smaller. any idea? – Zbun Mar 11 '15 at 15:19
  • 1
    I don't know why... but I see it also. With Chrome at least (all I have tried) there does seem to be some mechanism that perhaps is intended to prevent using this method to DOS the server? If I run this in a tight loop it stops at a low value for n (like `33`), but if I wait a few seconds between tests I can get a maximum of 65536 in Chrome. – nothingisnecessary Mar 11 '15 at 15:24
  • 2
    65536 limit is still true for Chrome 91 on Windows 10 in 2021 – Pierre Jun 16 '21 at 21:18
9

Answering to Zbun's question in comment:

In short, both the total byte size of sendBeacon() request queues as well as payload size of a single sendBeacon() request both have limits.

As was mentioned in nothingisnecessary's answer, the W3C spec says:

The user agent MUST initiate a fetch with keepalive flag set, which restricts the amount of data that can be queued by such requests to ensure that beacon requests are able to complete quickly and in a timely manner.

This still leaves the actual byte size limit up to each implementation, which is typically 64KB for most browsers at the moment.

Also in a related GitHub issue, Enforce payload limits via Fetch API #39, it is mentioned that the byte size of the payload in transmission is counted and has similar restriction. You can take a look at Chromium's test file to see that 64KB is the limit for Chromium and the exact same behavior as you pointed out (subsequent requests after exceeding the limit) is appropriate.

https://chromium.googlesource.com/chromium/src/+/c1a211aa583ade023aca652e9493c01603623aa3/third_party/WebKit/LayoutTests/http/tests/sendbeacon/beacon-allowance-limit.html

Bastien Caudan
  • 4,482
  • 1
  • 17
  • 29
edwardkenfox
  • 128
  • 2
  • 7
  • I see that you mention fetch with keepalive=true, does sendBeacon implementation eventually call fetch? is there any difference between sendBeacon and fetch? – Michal Tsadok Oct 24 '19 at 09:40
  • 2
    @MichalTsadok `sendBeacon` is defined in the [Beacon API](https://w3c.github.io/beacon/#sendbeacon-method) spec, which is built on top of the [fetch standard](https://fetch.spec.whatwg.org/). `navigator.sendBeacon()` and `window.fetch()` are totally different APIs, yet, as far as my understanding, they both internally use the same `fetch` mechanism. – edwardkenfox Oct 25 '19 at 11:35