Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't send Blob object #1254

Open
1 task done
XhstormR opened this issue Mar 25, 2024 · 5 comments
Open
1 task done

Can't send Blob object #1254

XhstormR opened this issue Mar 25, 2024 · 5 comments
Labels
confirmed acknowledged as an issue documentation need update some info in doc

Comments

@XhstormR
Copy link

XhstormR commented Mar 25, 2024

Please, check for existing issues to avoid duplicates.

  • No similar issues found.

What happened?

According to the documentation, sending Blob objects is supported.
image
But when I send a object that containing the Blob, on the other side it becomes an ArrayBuffer.
image

Corresponding code:

let result = conn.send({
    strings: 'hi!',
    numbers: 150,
    arrays: [1, 2, 3],
    evenBinary: new Blob(['<q id="a"><span id="b">hey!</span></q>'], { type: 'text/html' }),
    andMore: { bool: true },
});

other side:

conn.on('data', data => {
    console.log('listenConn data', data);
});

How can we reproduce the issue?

No response

What do you expected to happen?

Able to successfully send Blob object.

Environment setup

  • OS: MacOs Darwin 23.4.0 x86_64 i386
  • Platform: Google Chrome
  • Browser: Google Chrome 123.0.6312.59

Is this a regression?

peerjs 1.5.2, angular 17.3.0, Google Chrome 123.0.6312.59

Anything else?

No response

@XhstormR XhstormR added bug unconfirmed not yet verified as an issue labels Mar 25, 2024
@catosaurusrex2003
Copy link

you are sending the blob correctly. you just have to convert it back to a blob while recieving.

conn.on('data', data => {
  console.log('listenConn data', data);
  if (data.evenBinary instanceof ArrayBuffer) {
    const blob = new Blob([data.evenBinary], { type: 'text/html' });
    // Now you have a Blob object
  }
});

check if this snippet works

@XhstormR
Copy link
Author

XhstormR commented Apr 1, 2024

@catosaurusrex2003 This means peerjs will only transfer the bytes of the blob, but will ignore the type field, I need to handle the type field myself, right?

Background:This Blob object is a local file selected by the user, so I cannot sure the type of this file.

@catosaurusrex2003
Copy link

my bad. i read your issue wrong. yes this is a bug i think.

@irgalamarr irgalamarr added the documentation need update some info in doc label Apr 1, 2024 — with Linear
@irgalamarr irgalamarr removed the bug label Apr 1, 2024
@irgalamarr irgalamarr added the confirmed acknowledged as an issue label Apr 1, 2024 — with Linear
@irgalamarr irgalamarr removed the unconfirmed not yet verified as an issue label Apr 1, 2024
@irgalamarr
Copy link
Member

Hi @XhstormR,
the behavior you noticed is actually expected, but we see how our documentation might have confused you. We're sorry for that mix-up and we're working on making our docs better.

For now, we suggest looking at this example about transferring files with PeerJS. It should clear things up and show you how to handle the file transfer process. If you have more questions, just let us know; we're here to help.

@XhstormR
Copy link
Author

XhstormR commented Apr 1, 2024

@irgalamarr Thanks. As shown in the example, I need to handle the type field myself.

https://github.com/chidokun/p2p-file-transfer/blob/main/src/App.tsx#L65

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
confirmed acknowledged as an issue documentation need update some info in doc
Projects
None yet
Development

No branches or pull requests

3 participants