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

[video stream] video html tag is not created #321

Closed
vanilla38 opened this issue May 19, 2015 · 11 comments
Closed

[video stream] video html tag is not created #321

vanilla38 opened this issue May 19, 2015 · 11 comments

Comments

@vanilla38
Copy link

@vanilla38 vanilla38 commented May 19, 2015

First of all excuse me for writing in here but I dont really know where to find help in using webtorrent.

Here's my code:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script src="webtorrent.min.js"></script>
</head>
<script>
var client = new WebTorrent()
var magnetUri = 'magnet:?xt=urn:btih:b276fac02e3d2da254019ad9d13e41d6108aecab&dn=&tr=udp%3A%2F%2Ftracker.publicbt.com%3A80&tr=udp%3A%2F%2Ftracker.openbittorrent.com%3A80&tr=udp%3A%2F%2Ftracker.ccc.de%3A80&tr=udp%3A%2F%2Ftracker.istole.it%3A80'

client.add(magnetUri, function (torrent) {
  // Got torrent metadata!
  console.log('Torrent info hash:', torrent.infoHash)

  // Let's say the first file is a webm (vp8) or mp4 (h264) video...
  var file = torrent.files[0]

  // Create a video element
  var video = document.createElement('video')
  video.controls = true
  document.body.appendChild(video)

  // Stream the video into the video tag
  file.createReadStream().pipe(video)
})
</script>

I seeded the file in instant.io and I get the following output in console when executing the above code:

"webtorrent " "new webtorrent (peerId 2d5757303034312d366161363464316639396131, nodeId d488495b38918d054d8959b34ffe895ac4b196b8)" " +0ms" webtorrent.min.js:6:2835
"webtorrent " "add" " +2ms" webtorrent.min.js:6:2835
"webtorrent:torrent " "new torrent" " +1ms" webtorrent.min.js:6:2835
"bittorrent-swarm " "new swarm (i b276fac02e3d2da254019ad9d13e41d6108aecab p 2d5757303034312d366161363464316639396131)" " +0ms" webtorrent.min.js:2:25277
Successfully compiled asm.js code (total compilation time 0ms; not stored in cache (too small to benefit)) webtorrent.min.js
"torrent-discovery " "setTorrent b276fac02e3d2da254019ad9d13e41d6108aecab" " +0ms" webtorrent.min.js:2:25277
"bittorrent-tracker " "new client b276fac02e3d2da254019ad9d13e41d6108aecab" " +0ms" webtorrent.min.js:2:25277
"bittorrent-tracker " "send start" " +2ms" webtorrent.min.js:2:25277

No error but no video shown in the browser's window.

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 19, 2015

Are you using Firefox? Video streaming is only supported in browsers with MediaSource. Try Chrome.

@vanilla38

This comment has been minimized.

Copy link
Author

@vanilla38 vanilla38 commented May 19, 2015

It's the same on both FF and Chrome, thanks for quick reply, I also want to add that no Node.js and Browserify are used, it's only a simple html file with the code I posted.

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 19, 2015

Ah, try adding &tr=wss://tracker.webtorrent.io to the end of the magnet link you're using.

@vanilla38

This comment has been minimized.

Copy link
Author

@vanilla38 vanilla38 commented May 19, 2015

Nice, it works and the tag is created but I get a: Not allowed to load local resource: blob:null/29e820f6-80ea-44a7-86f3-039ed71f34e2

making the video unreadable

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 19, 2015

Looks like your browser is blocking blobs from letting you read local files from your disk. Try loading the site from a real server like localhost instead of from a file:/// url.

@vanilla38

This comment has been minimized.

Copy link
Author

@vanilla38 vanilla38 commented May 19, 2015

okay, trying

@vanilla38

This comment has been minimized.

Copy link
Author

@vanilla38 vanilla38 commented May 19, 2015

Last error I think ^^:

Uncaught InvalidStateError: Failed to execute 'endOfStream' on 'MediaSource': The MediaSource's readyState is not 'open'.webtorrent.min.js:1 (anonymous function)webtorrent.min.js:4 49.n.emitwebtorrent.min.js:5 kwebtorrent.min.js:5 Ewebtorrent.min.js:5 62.f.endwebtorrent.min.js:4 lwebtorrent.min.js:4 nwebtorrent.min.js:4 49.n.emitwebtorrent.min.js:4 (anonymous function)webtorrent.min.js:4 52.c.runwebtorrent.min.js:4 u

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 19, 2015

Did the video play at all before it printed this error?

@vanilla38

This comment has been minimized.

Copy link
Author

@vanilla38 vanilla38 commented May 19, 2015

No, it's only playing on instant.io, thanks you alot for your help

@vanilla38

This comment has been minimized.

Copy link
Author

@vanilla38 vanilla38 commented May 19, 2015

It was due to file, it's working with webM ones.

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 19, 2015

Great, glad you got it figured out!

@feross feross closed this May 19, 2015
@lock lock bot locked as resolved and limited conversation to collaborators May 6, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
You can’t perform that action at this time.