javascript - How to detect a browser that will not support XHR2 Upload progress - Stack Overflow

admin管理员组

文章数量:1026298

Few android browsers including Samsung default browsers on older devices will not support

xhr.upload.onprogress

Event. So we cannot show realtime upload progress on that browsers.

How can I detect those browsers? So I can change my setup to show progress.

Few android browsers including Samsung default browsers on older devices will not support

xhr.upload.onprogress

Event. So we cannot show realtime upload progress on that browsers.

How can I detect those browsers? So I can change my setup to show progress.

• javascript
• xmlhttprequest

Share Improve this question Follow edited Jun 14, 2015 at 23:58 Bergi 667k161161 gold badges1k1k silver badges1.5k1.5k bronze badges asked Jun 14, 2015 at 22:43 VishnuVishnu 75111 gold badge77 silver badges2424 bronze badges 9

• 1 You could read the browsers headers. Although personally I think it would be better just doing if(typeof xhr.upload.onprogress === 'undefined') (or similar). This way you avoid checking against every browser. – Eric Martinez Commented Jun 14, 2015 at 22:51
• @EricMartinez getting "Object" on both level1 and level2 browsers. – Vishnu Commented Jun 14, 2015 at 23:09
• sorry, getting "null" on both level1 and level2 browsers. – Vishnu Commented Jun 14, 2015 at 23:15
• try XMLHttpRequestEventTarget.prototype.hasOwnProperty('onprogress') or weblogs.asp/jeffwids/… – befzz Commented Jun 14, 2015 at 23:22
• @befzz getting true on lavel 2 but not output on level 1 (try to alert) no debugging setup – Vishnu Commented Jun 14, 2015 at 23:32

 |  Show 4 more ments

3 Answers 3

Sorted by: Reset to default 3

Simply :

var xhr = new XMLHttpRequest();
if ( xhr && ('upload' in xhr) && ('onprogress' in xhr.upload) ) // attach event...

So if you want a function :

function supportAjaxUploadProgressEvents() {
  var xhr = new XMLHttpRequest();
  return !! (xhr && ('upload' in xhr) && ('onprogress' in xhr.upload));
}

hm. tested a very old Firefox's. 3.5.2.

first version that have (new XMLHttpRequest).upload property.

Current version Chrome:

send(1); //progress 1 of 1
send(40000000_chars); // 1,2 or more progress events.

Firefox 3.5.2:

send(1); //no progress events.
send(40000000_chars); // some progress events.

So if browser sending time is not big, there is no pregress events on old browsers.

But load event with .loaded == .total is fired normally.

---

Current conclusion: data was send too fast for old browsers.

The below was tested in FF 3.5.2 to return false, but for latest Chrome/FF/IE11 true

The exception is thrown on trying to read the onpgress after being set.

Hope that helps,

  function isSupported() {
      var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
      try {
          xhr.upload.onprogress = isSupported;
          var x = xhr.upload.onprogress;
          return true;
      } catch(e) {
          return false;
      }
  }

Few android browsers including Samsung default browsers on older devices will not support

xhr.upload.onprogress

Event. So we cannot show realtime upload progress on that browsers.

How can I detect those browsers? So I can change my setup to show progress.

Few android browsers including Samsung default browsers on older devices will not support

xhr.upload.onprogress

Event. So we cannot show realtime upload progress on that browsers.

How can I detect those browsers? So I can change my setup to show progress.

• javascript
• xmlhttprequest

Share Improve this question Follow edited Jun 14, 2015 at 23:58 Bergi 667k161161 gold badges1k1k silver badges1.5k1.5k bronze badges asked Jun 14, 2015 at 22:43 VishnuVishnu 75111 gold badge77 silver badges2424 bronze badges 9

• 1 You could read the browsers headers. Although personally I think it would be better just doing if(typeof xhr.upload.onprogress === 'undefined') (or similar). This way you avoid checking against every browser. – Eric Martinez Commented Jun 14, 2015 at 22:51
• @EricMartinez getting "Object" on both level1 and level2 browsers. – Vishnu Commented Jun 14, 2015 at 23:09
• sorry, getting "null" on both level1 and level2 browsers. – Vishnu Commented Jun 14, 2015 at 23:15
• try XMLHttpRequestEventTarget.prototype.hasOwnProperty('onprogress') or weblogs.asp/jeffwids/… – befzz Commented Jun 14, 2015 at 23:22
• @befzz getting true on lavel 2 but not output on level 1 (try to alert) no debugging setup – Vishnu Commented Jun 14, 2015 at 23:32

 |  Show 4 more ments

3 Answers 3

Sorted by: Reset to default 3

Simply :

var xhr = new XMLHttpRequest();
if ( xhr && ('upload' in xhr) && ('onprogress' in xhr.upload) ) // attach event...

So if you want a function :

function supportAjaxUploadProgressEvents() {
  var xhr = new XMLHttpRequest();
  return !! (xhr && ('upload' in xhr) && ('onprogress' in xhr.upload));
}

hm. tested a very old Firefox's. 3.5.2.

first version that have (new XMLHttpRequest).upload property.

Current version Chrome:

send(1); //progress 1 of 1
send(40000000_chars); // 1,2 or more progress events.

Firefox 3.5.2:

send(1); //no progress events.
send(40000000_chars); // some progress events.

So if browser sending time is not big, there is no pregress events on old browsers.

But load event with .loaded == .total is fired normally.

---

Current conclusion: data was send too fast for old browsers.

The below was tested in FF 3.5.2 to return false, but for latest Chrome/FF/IE11 true

The exception is thrown on trying to read the onpgress after being set.

Hope that helps,

  function isSupported() {
      var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
      try {
          xhr.upload.onprogress = isSupported;
          var x = xhr.upload.onprogress;
          return true;
      } catch(e) {
          return false;
      }
  }

本文标签： javascriptHow to detect a browser that will not support XHR2 Upload progressStack Overflow