Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #36906 > unrolled thread

fetch with blobs

Back to article view | Back to comp.lang.javascript

Contents

  fetch with blobs Andrew Poulos <ap_prog@hotmail.com> - 2019-06-14 13:14 +1000
    Re: fetch with blobs Andrew Poulos <ap_prog@hotmail.com> - 2019-06-14 15:29 +1000
      Re: fetch with blobs Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2019-06-14 13:06 +0200
      Re: fetch with blobs JJ <jj4public@vfemail.net> - 2019-06-14 18:56 +0700
        Re: fetch with blobs Julio Di Egidio <julio@diegidio.name> - 2019-06-14 05:54 -0700
          Re: fetch with blobs Andrew Poulos <ap_prog@hotmail.com> - 2019-06-15 16:40 +1000
            Re: fetch with blobs JJ <jj4public@vfemail.net> - 2019-06-15 14:16 +0700
              Re: fetch with blobs Andrew Poulos <ap_prog@hotmail.com> - 2019-06-15 19:02 +1000
                Re: fetch with blobs Andrew Poulos <ap_prog@hotmail.com> - 2019-06-15 19:31 +1000
                  Re: fetch with blobs JJ <jj4public@vfemail.net> - 2019-06-16 15:28 +0700
                    Re: fetch with blobs Julio Di Egidio <julio@diegidio.name> - 2019-06-16 03:46 -0700
            Re: fetch with blobs Julio Di Egidio <julio@diegidio.name> - 2019-06-15 03:51 -0700
              Re: fetch with blobs Andrew Poulos <ap_prog@hotmail.com> - 2019-06-16 08:21 +1000
          Re: fetch with blobs JJ <jj4public@vfemail.net> - 2019-06-15 14:14 +0700
            Re: fetch with blobs Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2019-06-15 12:55 +0200
              Re: fetch with blobs Julio Di Egidio <julio@diegidio.name> - 2019-06-15 04:02 -0700

#36906 — fetch with blobs

When successful, this

fetch(imageSrc, {
   headers: headesr,
})
.then(function(res) {
   return res.blob();
})
.then(function(blob) {
   console.log(blob); // gives blob [object Blob] in Edge
                      //       Blob {...} in Chrome
   upload(blob);
})
...

calls this

function upload(imgBlob) {
   console.log(imgBlob); // gives blob [object Object] in Edge
                         //       Blob {...} in Chrome
   ...
}

The full console output in Edge is

[object Object]: {msClose: function msClose() { [native code] }, size: 
87022, slice: function slice() { [native code] }, type: "image/jpeg"}

Why is it no longer a blob in Edge? That is, how can I get a blob 
returned by fetch sent as a blob to a function in Edge?

Andrew Poulos

[toc] | [next] | [standalone]

#36907

On 14/06/2019 1:14 pm, Andrew Poulos wrote:
> When successful, this
> 
> fetch(imageSrc, {
>    headers: headesr,
> })
> .then(function(res) {
>    return res.blob();
> })
> .then(function(blob) {
>    console.log(blob); // gives blob [object Blob] in Edge
>                       //       Blob {...} in Chrome

I changed it to this
   let b = blob;
   upload(b);

and Edge's console says it's now [object Blob] but interacting with the 
blob makes it seem like the blob is null/empty.

> })
> ...
> 
> calls this
> 
> function upload(imgBlob) {
>    console.log(imgBlob); // gives blob [object Object] in Edge
>                          //       Blob {...} in Chrome
>    ...
> }

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#36910

Andrew Poulos wrote:

> On 14/06/2019 1:14 pm, Andrew Poulos wrote:
>> When successful, this
>> 
>> fetch(imageSrc, {
>>  headers: headesr,
>> })
>> .then(function(res) {
>>  return res.blob();
>> })
>> .then(function(blob) {
>>  console.log(blob); // gives blob [object Blob] in Edge
>>  //       Blob {...} in Chrome
> 
> I changed it to this
>    let b = blob;
>    upload(b);
> 
> and Edge's console says it's now [object Blob] but interacting with the
> blob makes it seem like the blob is null/empty.

What is that supposed to mean?

RTFM.
 
-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#36911

On Fri, 14 Jun 2019 15:29:23 +1000, Andrew Poulos wrote:
> On 14/06/2019 1:14 pm, Andrew Poulos wrote:
>> When successful, this
>> 
>> fetch(imageSrc, {
>>    headers: headesr,
>> })
>> .then(function(res) {
>>    return res.blob();
>> })
>> .then(function(blob) {
>>    console.log(blob); // gives blob [object Blob] in Edge
>>                       //       Blob {...} in Chrome
> 
> I changed it to this
>    let b = blob;
>    upload(b);
> 
> and Edge's console says it's now [object Blob] but interacting with the 
> blob makes it seem like the blob is null/empty.
> 
>> })
>> ...
>> 
>> calls this
>> 
>> function upload(imgBlob) {
>>    console.log(imgBlob); // gives blob [object Object] in Edge
>>                          //       Blob {...} in Chrome
>>    ...
>> }
> 
> Andrew Poulos

It's likely a bug. Which Edge version is that?
The problem doesn't occur when I tested it on (Chr)Edge v76.0.151.0.

[toc] | [prev] | [next] | [standalone]

#36912

On Friday, 14 June 2019 13:57:00 UTC+2, JJ  wrote:
> On Fri, 14 Jun 2019 15:29:23 +1000, Andrew Poulos wrote:
> > On 14/06/2019 1:14 pm, Andrew Poulos wrote:
> >> When successful, this
> >> 
> >> fetch(imageSrc, {
> >>    headers: headesr,
> >> })
> >> .then(function(res) {
> >>    return res.blob();
> >> })
> >> .then(function(blob) {
> >>    console.log(blob); // gives blob [object Blob] in Edge
> >>                       //       Blob {...} in Chrome
> > 
> > I changed it to this
> >    let b = blob;
> >    upload(b);
> > 
> > and Edge's console says it's now [object Blob] but interacting with the 
> > blob makes it seem like the blob is null/empty.
> > 
> >> })
> >> ...
> >> 
> >> calls this
> >> 
> >> function upload(imgBlob) {
> >>    console.log(imgBlob); // gives blob [object Object] in Edge
> >>                          //       Blob {...} in Chrome
> >>    ...
> >> }
> 
> It's likely a bug. Which Edge version is that?
> The problem doesn't occur when I tested it on (Chr)Edge v76.0.151.0.

LOL, a bug should be the last of your guesses.

FYI, IE and now Edge have been returning just "object Object" since the dawn
of time.  Indeed, there is no standard about that, it's browser specific,
and people rather use stuff like JSON.stringify to print full object contents
(not applicable in all cases, anyway I am not getting into more details, just
the idea should be clear that proper logging requires some thought and plain
default browser methods may indeed not cut it).

HTH,

Julio

[toc] | [prev] | [next] | [standalone]

#36914

On 14/06/2019 10:54 pm, Julio Di Egidio wrote:
> On Friday, 14 June 2019 13:57:00 UTC+2, JJ  wrote:
>> On Fri, 14 Jun 2019 15:29:23 +1000, Andrew Poulos wrote:
>>> On 14/06/2019 1:14 pm, Andrew Poulos wrote:

>>>> function upload(imgBlob) {
>>>>     console.log(imgBlob); // gives blob [object Object] in Edge
>>>>                           //       Blob {...} in Chrome
>>>>     ...
>>>> }
>>
>> It's likely a bug. Which Edge version is that?
>> The problem doesn't occur when I tested it on (Chr)Edge v76.0.151.0.

I just updated to
Microsoft Edge 44.18362.1.0
Microsoft EdgeHTML 18.18362

> FYI, IE and now Edge have been returning just "object Object" since the dawn

Ah, I use Chrome and Firefox for development and only test on IE/Edge 
later in the process.

> of time.  Indeed, there is no standard about that, it's browser specific,
> and people rather use stuff like JSON.stringify to print full object contents
> (not applicable in all cases, anyway I am not getting into more details, just
> the idea should be clear that proper logging requires some thought and plain
> default browser methods may indeed not cut it).

Thanks, I used JSON.stringify and got the expected value of
   {"size":59834,"type":"image/jpeg","msClose":{},"slice":{}}
which means my problem is really, why is Edge not sending the input to a 
PHP script (yet Chrome does)?

Using this

let formData = new FormData();
formData.append('asset', blob, name);

fetch(url, {
   method: 'POST',
   body: formData
})
.then...

with Chrome, the PHP script correctly recognises the input. With Edge 
the PHP script returns '' for both $_FILES['asset']['error'] and 
file_get_contents('php://input'). Is there something missing from the 
fetch that it needs for PHP to see the input when sent from Edge?

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#36916

On Sat, 15 Jun 2019 16:40:47 +1000, Andrew Poulos wrote:
> 
> Using this
> 
> let formData = new FormData();
> formData.append('asset', blob, name);
> 
> fetch(url, {
>    method: 'POST',
>    body: formData
> })
> ..then...
> 
> with Chrome, the PHP script correctly recognises the input. With Edge 
> the PHP script returns '' for both $_FILES['asset']['error'] and 
> file_get_contents('php://input'). Is there something missing from the 
> fetch that it needs for PHP to see the input when sent from Edge?
> 
> Andrew Poulos

Edge probably requires you to manually specify the content type.

[toc] | [prev] | [next] | [standalone]

#36917

On 15/06/2019 5:16 pm, JJ wrote:
> On Sat, 15 Jun 2019 16:40:47 +1000, Andrew Poulos wrote:
>>
>> Using this
>>
>> let formData = new FormData();
>> formData.append('asset', blob, name);
>>
>> fetch(url, {
>>     method: 'POST',
>>     body: formData
>> })
>> ..then...
>>
>> with Chrome, the PHP script correctly recognises the input. With Edge
>> the PHP script returns '' for both $_FILES['asset']['error'] and
>> file_get_contents('php://input'). Is there something missing from the
>> fetch that it needs for PHP to see the input when sent from Edge?
>>
>> Andrew Poulos
> 
> Edge probably requires you to manually specify the content type.

I've tried application/octet-stream but to no avail.

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#36918

On 15/06/2019 7:02 pm, Andrew Poulos wrote:
> On 15/06/2019 5:16 pm, JJ wrote:
>> On Sat, 15 Jun 2019 16:40:47 +1000, Andrew Poulos wrote:
>>>
>>> Using this
>>>
>>> let formData = new FormData();
>>> formData.append('asset', blob, name);
>>>
>>> fetch(url, {
>>>     method: 'POST',
>>>     body: formData
>>> })
>>> ..then...
>>>
>>> with Chrome, the PHP script correctly recognises the input. With Edge
>>> the PHP script returns '' for both $_FILES['asset']['error'] and
>>> file_get_contents('php://input'). Is there something missing from the
>>> fetch that it needs for PHP to see the input when sent from Edge?
>>>
>>> Andrew Poulos
>>
>> Edge probably requires you to manually specify the content type.
> 
> I've tried application/octet-stream but to no avail.

With
   "Content-Type": "application/octet-stream"
or with
   "Content-Type": "application/octet-stream",
   "Content-Length": blob.size
I get

-----------------------------7e319dbf0280
Content-Disposition: form-data; name="asset"

[object Blob]
-----------------------------7e319dbf0280--

returned but the PHP script doesn't recognise the blob as an input named 
"asset".

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#36928

On Sat, 15 Jun 2019 19:31:33 +1000, Andrew Poulos wrote:
> 
> With
>    "Content-Type": "application/octet-stream"
> or with
>    "Content-Type": "application/octet-stream",
>    "Content-Length": blob.size
> I get
> 
> -----------------------------7e319dbf0280
> Content-Disposition: form-data; name="asset"
> 
> [object Blob]
> -----------------------------7e319dbf0280--
> 
> returned but the PHP script doesn't recognise the blob as an input named 
> "asset".
> 
> Andrew Poulos

No. I mean, Edge's might not automatically set the content type if the body
is a form data - which should be `multipart/form-data`.

Check the HTTP request headers and compare it with Chrome's.

[toc] | [prev] | [next] | [standalone]

#36929

On Sunday, 16 June 2019 10:29:00 UTC+2, JJ  wrote:
> On Sat, 15 Jun 2019 19:31:33 +1000, Andrew Poulos wrote:
> > 
> > With
> >    "Content-Type": "application/octet-stream"
> > or with
> >    "Content-Type": "application/octet-stream",
> >    "Content-Length": blob.size
> > I get
> > 
> > -----------------------------7e319dbf0280
> > Content-Disposition: form-data; name="asset"
> > 
> > [object Blob]
> > -----------------------------7e319dbf0280--
> > 
> > returned but the PHP script doesn't recognise the blob as an input named 
> > "asset".
> > 
> > Andrew Poulos
> 
> No. I mean, Edge's might not automatically set the content type if the body
> is a form data - which should be `multipart/form-data`.
> 
> Check the HTTP request headers and compare it with Chrome's.

Please kill file this other polluting piece of shit.

*Plonk*

Julio

[toc] | [prev] | [next] | [standalone]

#36920

On Saturday, 15 June 2019 08:40:59 UTC+2, Andrew Poulos  wrote:

> which means my problem is really, why is Edge not sending the input to a 
> PHP script (yet Chrome does)?

Your problem is that you approach things ass-backwards.

> Using this
> 
> let formData = new FormData();
> formData.append('asset', blob, name);
> 
> fetch(url, {
>    method: 'POST',
>    body: formData
> })
> .then...
> 
> with Chrome, the PHP script correctly recognises the input. With Edge 
> the PHP script returns '' for both $_FILES['asset']['error'] and 
> file_get_contents('php://input'). Is there something missing from the 
> fetch that it needs for PHP to see the input when sent from Edge?

And who said that you can use the Fetch API??

Couldn't you be bothered to look at the browser compatibility table?

<https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API>

RTFM!!

Julio

[toc] | [prev] | [next] | [standalone]

#36927

On 15/06/2019 8:51 pm, Julio Di Egidio wrote:
> On Saturday, 15 June 2019 08:40:59 UTC+2, Andrew Poulos  wrote:
> 
>> which means my problem is really, why is Edge not sending the input to a
>> PHP script (yet Chrome does)?
> 
> Your problem is that you approach things ass-backwards.
> 
>> Using this
>>
>> let formData = new FormData();
>> formData.append('asset', blob, name);
>>
>> fetch(url, {
>>     method: 'POST',
>>     body: formData
>> })
>> .then...
>>
>> with Chrome, the PHP script correctly recognises the input. With Edge
>> the PHP script returns '' for both $_FILES['asset']['error'] and
>> file_get_contents('php://input'). Is there something missing from the
>> fetch that it needs for PHP to see the input when sent from Edge?
> 
> And who said that you can use the Fetch API??
> 
> Couldn't you be bothered to look at the browser compatibility table?
> 
> <https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API>

What I used was <https://caniuse.com/#search=fetch> and it indicated no 
limitations :-(

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#36915

On Fri, 14 Jun 2019 05:54:21 -0700 (PDT), Julio Di Egidio wrote:
> 
> LOL, a bug should be the last of your guesses.
> 
> FYI, IE and now Edge have been returning just "object Object" since the dawn
> of time.  Indeed, there is no standard about that, it's browser specific,
> and people rather use stuff like JSON.stringify to print full object contents
> (not applicable in all cases, anyway I am not getting into more details, just
> the idea should be clear that proper logging requires some thought and plain
> default browser methods may indeed not cut it).
> 
> HTH,
> 
> Julio

I know that Microsoft simply outputs `[object Object]` in most cases, but
the fact that it actually outputs `[object Blob]` means that the output is
inconsistent. And inconsistency is a bug.

[toc] | [prev] | [next] | [standalone]

#36921

JJ wrote:

> On Fri, 14 Jun 2019 05:54:21 -0700 (PDT), Julio Di Egidio wrote:
>> LOL, a bug should be the last of your guesses.
>> 
>> FYI, IE and now Edge have been returning just "object Object" since the
>> dawn of time. 

That is plain NOT true.

>> Indeed, there is no standard about that, it's browser specific,
>> and people rather use stuff like JSON.stringify to print full object
>> contents (not applicable in all cases, anyway I am not getting into more
>> details, just the idea should be clear that proper logging requires some
>> thought and plain default browser methods may indeed not cut it).
> 
> I know that Microsoft simply outputs `[object Object]` in most cases, but
> the fact that it actually outputs `[object Blob]` means that the output is
> inconsistent.

No, it means that – again – the two of you have no clue what you are talking 
about.

The Edge DOM is not the IE/MSHTML 11 DOM, and the IE/MSHTML 11 DOM is not 
the IE/MSHTML 6 DOM.  The Edge implementation of ECMAScript is not JScript 
11.0, and JScript 11.0 is not JScript 5.6.  On top of that, with *host* 
objects, all bets are off.

Educate yourself:

<http://PointedEars.de/scripts/test/es-matrix/#jscript>
<http://www.ecma-international.org/ecma-262/9.0/index.html#sec-tostring>

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#36922

On Saturday, 15 June 2019 12:55:42 UTC+2, Thomas 'PointedEars' Lahn  wrote:
> JJ wrote:
> 
> > On Fri, 14 Jun 2019 05:54:21 -0700 (PDT), Julio Di Egidio wrote:
> >> LOL, a bug should be the last of your guesses.
> >> 
> >> FYI, IE and now Edge have been returning just "object Object" since the
> >> dawn of time. 
> 
> That is plain NOT true.

That is true, you other insane moron and resident idiot.

*Plonk*

Julio

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web