Styjun

What is a realistic time needed to get a properly trained army?

Why is Kirchoff's loop rule true in a DC circuit?

Can I disable a battery powered device by reversing half of its batteries?

Is low emotional intelligence associated with right-wing and prejudiced attitudes?

How do email clients "send later" without storing a password?

Gravity on an Orbital Ring

Do all humans have an identical nucleotide sequence for certain proteins, e.g haemoglobin?

I was promised a work PC but still awaiting approval 3 months later so using my own laptop - Is it fair to ask employer for laptop insurance?

Where does the expression "triple-A" come from?

Random point on a sphere

How are aircraft depainted?

Why does F + F' = 1?

Job offer without any details but asking me to withdraw other applications - is it normal?

Why is the Digital 0 not 0V in computer systems?

Why island and not light?

Can the UK veto its own extension request?

Resume: How to quantify my contributions as a software engineer?

Is there an inconsistency about Natasha Romanoff's middle name in the MCU?

What officially disallows US presidents from driving?

Why do sellers care about down payments?

Does an oscilloscope subtract voltages as phasors?

Sol Ⅲ = Earth: What is the origin of this planetary naming scheme?

Is a suit against a Univeristy Dorm for changing policies on a whim likely to succeed (USA)?

How do I determine what is "magic" and "bearing magic" for Detect Magic?

JavaScript XMLHttpRequest.responseType as “arraybuffer” — how to get current arraybuffer chunk

How do JavaScript closures work?How do I remove a property from a JavaScript object?How do you get a timestamp in JavaScript?How do I redirect to another webpage?How do I include a JavaScript file in another JavaScript file?Get the current URL with JavaScript?What does “use strict” do in JavaScript, and what is the reasoning behind it?How do I get the current date in JavaScript?How to check whether a string contains a substring in JavaScript?How do I remove a particular element from an array in JavaScript?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;

1

I'm trying to stream a from the client side to a server side, to later stream the video back to another client.

The point is:

How can I get chunks of a video from client-side JavaScript (that can be sent to a server)?

using this code, for example:

var x = new XMLHttpRequest();
 var url = location.href;
 x.onreadystatechange = function()
 if(x.readyState == 200) 
 console.log("done");
 else 
 console.log("chunk",x.response); //this is null until readyState is 200 anyway
 

 
 x.onprogress = e => 
 console.log("EE",e.target.response); //also null if resposneType is arraybuffer
 ;
 x.responseType="arraybuffer";
 x.open("GET","http://localhost:88/videoplayback.mp4",true);
 x.send("");

When I try to print the response before its finished loading (to get it by chunks) then its simply null; the arraybuffer only returns as the respnse when its finished loading.

If I take out the responsetype and just leave it as plain text, then indeed some unicode-characters get printed to the screen for each readystatechange even before its finished, only an arraybuffer doesn't.

So: is this the best way to stream a video from the client to server, and if so, how can I actually do it? and if not, what's a better way?

javascript

share|improve this question

edited Mar 28 at 13:22

bluejayke

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

add a comment
 | 

1

I'm trying to stream a from the client side to a server side, to later stream the video back to another client.

The point is:

How can I get chunks of a video from client-side JavaScript (that can be sent to a server)?

using this code, for example:

var x = new XMLHttpRequest();
 var url = location.href;
 x.onreadystatechange = function()
 if(x.readyState == 200) 
 console.log("done");
 else 
 console.log("chunk",x.response); //this is null until readyState is 200 anyway
 

 
 x.onprogress = e => 
 console.log("EE",e.target.response); //also null if resposneType is arraybuffer
 ;
 x.responseType="arraybuffer";
 x.open("GET","http://localhost:88/videoplayback.mp4",true);
 x.send("");

When I try to print the response before its finished loading (to get it by chunks) then its simply null; the arraybuffer only returns as the respnse when its finished loading.

If I take out the responsetype and just leave it as plain text, then indeed some unicode-characters get printed to the screen for each readystatechange even before its finished, only an arraybuffer doesn't.

So: is this the best way to stream a video from the client to server, and if so, how can I actually do it? and if not, what's a better way?

javascript

share|improve this question

edited Mar 28 at 13:22

bluejayke

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

add a comment
 | 

I'm trying to stream a from the client side to a server side, to later stream the video back to another client.

The point is:

How can I get chunks of a video from client-side JavaScript (that can be sent to a server)?

using this code, for example:

var x = new XMLHttpRequest();
 var url = location.href;
 x.onreadystatechange = function()
 if(x.readyState == 200) 
 console.log("done");
 else 
 console.log("chunk",x.response); //this is null until readyState is 200 anyway
 

 
 x.onprogress = e => 
 console.log("EE",e.target.response); //also null if resposneType is arraybuffer
 ;
 x.responseType="arraybuffer";
 x.open("GET","http://localhost:88/videoplayback.mp4",true);
 x.send("");

When I try to print the response before its finished loading (to get it by chunks) then its simply null; the arraybuffer only returns as the respnse when its finished loading.

If I take out the responsetype and just leave it as plain text, then indeed some unicode-characters get printed to the screen for each readystatechange even before its finished, only an arraybuffer doesn't.

So: is this the best way to stream a video from the client to server, and if so, how can I actually do it? and if not, what's a better way?

javascript

share|improve this question

edited Mar 28 at 13:22

bluejayke

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

var x = new XMLHttpRequest();
 var url = location.href;
 x.onreadystatechange = function()
 if(x.readyState == 200) 
 console.log("done");
 else 
 console.log("chunk",x.response); //this is null until readyState is 200 anyway
 

 
 x.onprogress = e => 
 console.log("EE",e.target.response); //also null if resposneType is arraybuffer
 ;
 x.responseType="arraybuffer";
 x.open("GET","http://localhost:88/videoplayback.mp4",true);
 x.send("");

share|improve this question

edited Mar 28 at 13:22

bluejayke

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

share|improve this question

edited Mar 28 at 13:22

bluejayke

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

asked Mar 28 at 9:09

bluejaykebluejayke

64722 gold badges88 silver badges2222 bronze badges

1 Answer
1

active

oldest

votes

1

Indeed, arraybuffer or blob responseTypes do not allow access of chunk of data until the download is complete.

Now, there are ways... For instance in newest browsers, you could start a ReadableStream from the fetch API, or from Firefox you could set the responseType to "moz-chunked-buffer", but that's not what you need at all here.

What you are describing is exactly what WebRTC has been made for. So the best way is to run a STUN/TURN server, and to stream your media through it using the MediaStream API.

share|improve this answer

edited Mar 28 at 14:12

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Ooh interesting is WebRTC a built in browser interface thats supported by all?
  
  – bluejayke
  Mar 29 at 0:55
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  WebRTC is a set of standardized APIs, that ultimately all web-browsers following web-standards should support. Now, current browser support is not that bad, but we can't say all do support. A few versions away, Edge didn't had support, and IE won't ever have support. So that depends on your audience really, but most users should be able to use it.
  
  – Kaiido
  Mar 29 at 1:29
  

  
  
  
  

add a comment
 | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/4.0/"u003ecc by-sa 4.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55393775%2fjavascript-xmlhttprequest-responsetype-as-arraybuffer-how-to-get-current-ar%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

1

Indeed, arraybuffer or blob responseTypes do not allow access of chunk of data until the download is complete.

Now, there are ways... For instance in newest browsers, you could start a ReadableStream from the fetch API, or from Firefox you could set the responseType to "moz-chunked-buffer", but that's not what you need at all here.

What you are describing is exactly what WebRTC has been made for. So the best way is to run a STUN/TURN server, and to stream your media through it using the MediaStream API.

share|improve this answer

edited Mar 28 at 14:12

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Ooh interesting is WebRTC a built in browser interface thats supported by all?
  
  – bluejayke
  Mar 29 at 0:55
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  WebRTC is a set of standardized APIs, that ultimately all web-browsers following web-standards should support. Now, current browser support is not that bad, but we can't say all do support. A few versions away, Edge didn't had support, and IE won't ever have support. So that depends on your audience really, but most users should be able to use it.
  
  – Kaiido
  Mar 29 at 1:29
  

  
  
  
  

add a comment
 | 

1

Indeed, arraybuffer or blob responseTypes do not allow access of chunk of data until the download is complete.

Now, there are ways... For instance in newest browsers, you could start a ReadableStream from the fetch API, or from Firefox you could set the responseType to "moz-chunked-buffer", but that's not what you need at all here.

What you are describing is exactly what WebRTC has been made for. So the best way is to run a STUN/TURN server, and to stream your media through it using the MediaStream API.

share|improve this answer

edited Mar 28 at 14:12

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Ooh interesting is WebRTC a built in browser interface thats supported by all?
  
  – bluejayke
  Mar 29 at 0:55
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  WebRTC is a set of standardized APIs, that ultimately all web-browsers following web-standards should support. Now, current browser support is not that bad, but we can't say all do support. A few versions away, Edge didn't had support, and IE won't ever have support. So that depends on your audience really, but most users should be able to use it.
  
  – Kaiido
  Mar 29 at 1:29
  

  
  
  
  

add a comment
 | 

Indeed, arraybuffer or blob responseTypes do not allow access of chunk of data until the download is complete.

Now, there are ways... For instance in newest browsers, you could start a ReadableStream from the fetch API, or from Firefox you could set the responseType to "moz-chunked-buffer", but that's not what you need at all here.

What you are describing is exactly what WebRTC has been made for. So the best way is to run a STUN/TURN server, and to stream your media through it using the MediaStream API.

share|improve this answer

edited Mar 28 at 14:12

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges

share|improve this answer

edited Mar 28 at 14:12

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges

answered Mar 28 at 14:06

KaiidoKaiido

53.2k44 gold badges7878 silver badges122122 bronze badges