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

New video containers #405

Closed
neronmoon opened this issue Aug 18, 2015 · 16 comments
Closed

New video containers #405

neronmoon opened this issue Aug 18, 2015 · 16 comments

Comments

@neronmoon
Copy link

@neronmoon neronmoon commented Aug 18, 2015

Many torrents contains files with mkv and avi extension and coded by H.264 and other supported codec. Now I get error below, when trying to append video tag with source

Error: Unsupported file type ".avi": Cannot append to DOM
    at v (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:4:27909)
    at E.148.E.appendTo (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:5:8283)
    at http://bitwatch.app/scripts/watch.js:11:14
    at o (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:12:3444)
    at L.<anonymous> (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:12:3676)
    at L.168.n.emit (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:6:21552)
    at https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:5:23155
    at l.172.l.run (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:6:27539)
    at u (https://cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js:6:27213)

My code is

var WebTorrent = require('webtorrent')
    var client = new WebTorrent()
    client.add(window.torrentUrl, function (torrent) {
        var file = torrent.files[0]
        file.appendTo('#player',function(err, elem){
            console.log(err)
        })
    })

Can you add avi and mkv containers? Thanks!

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented Aug 18, 2015

I'd like to support all video containers and formats. But this is not trivial.

Right now, we use the videostream package to provide support for MP4. That would be the place to look at adding support, or you could write (or convince someone to write) a new package that we could use in WebTorrent.

@HLFH

This comment has been minimized.

Copy link

@HLFH HLFH commented Oct 31, 2015

@feross I just know that MediacenterJS supports

  • Video: AVI/MOV/WMV/MP4/MKV/MPEG
  • Audio: MP3/M4a

Or am I off-topic?

@rom1504

This comment has been minimized.

Copy link
Member

@rom1504 rom1504 commented Oct 31, 2015

@HLFH mediacenterjs seems to be using ffmpeg (see https://github.com/jansmolders86/mediacenterjs/blob/master/lib/transcoding/desktop.js#L54) so that won't do it in the browser.

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented Feb 12, 2016

Yeah, I'm holding out for the day that @jhiesey adds MKV support to videostream!

@rom1504

This comment has been minimized.

Copy link
Member

@rom1504 rom1504 commented Mar 24, 2016

@diimdeep

This comment has been minimized.

Copy link

@diimdeep diimdeep commented Apr 7, 2016

@rom1504

This comment has been minimized.

Copy link
Member

@rom1504 rom1504 commented Apr 7, 2016

"libvlc binding" no

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented Apr 23, 2016

We just need a package that can parse the MKV container format.

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 5, 2016

This is really an issue for videostream. WebTorrent will support whatever formats videostream supports. Here's an issue to track that going forward: jhiesey/videostream#29

@feross feross closed this May 5, 2016
@feross feross mentioned this issue May 12, 2016
@lesander

This comment has been minimized.

Copy link

@lesander lesander commented May 17, 2016

My workaround for being able to stream mkv, avi and basically any video format with WebTorrent is by setting up a local webserver with http and serving the video file.

Applied the answer of http://stackoverflow.com/a/24977085 to this case:

var WebTorrent = require("webtorrent");
var http = require("http");
var fs = require("fs");
var url = require("url");
var path = require("path");

// Normal torrent handling as before.
var magnet = "your-magnet-here";
var client = new WebTorrent();
client.add(magnet, function (torrent) {
    var file = torrent.files[number];

    // You can still do this for MP4 video's.
    //file.appendTo('#player',function(err, elem){
    //    console.log(err)
    //});

    // .. But for other formats we're using this.
    var server = http.createServer(function(req, res) {
      // The absolute path to the local video file.
      var localFile = torrent.path + "/" + file.path;
      // We only handle stream requests.
      if (req.url != "/stream.mkv" && req.url != "/stream.avi" && req.url != "/stream.mp4") {
        return res.writeHead(404, {"Content-Type": "text/plain"});
        res.end();
      }
      fs.stat(localFile, function (err, stats) {
        if (err) {
          if (err.code == "ENOENT") {
            return res.writeHead(404, {"Content-Type": "text/plain"});
          } else {
            // For some reason we can't stat the file.
            return res.writeHead(500, {"Content-Type": "text/plain"});
          }
          res.end(err);
        }
        var range = req.headers.range;
        if (!range) {
          // Invalid range requested by client. The HTML5 video player
          // should do this by itself.
          return res.writeHead(416, {"Content-Type": "text/plain"});
        }
        // Calculate position to stream.
        var positions = range.replace(/bytes=/, "").split("-");
        var start = parseInt(positions[0], 10);
        var total = stats.size;
        var end = positions[1] ? parseInt(positions[1], 10) : total - 1;
        var chunksize = (end - start) + 1;
        // Write headers for the stream.
        res.writeHead(206, {
          "Content-Range": "bytes " + start + "-" + end + "/" + total,
          "Accept-Ranges": "bytes",
          "Content-Length": chunksize,
          "Content-Type": "video/mp4"
        });
        // Start the stream.
        var stream = fs.createReadStream(localFile, { start: start, end: end })
        .on("open", function() {
          stream.pipe(res);
        }).on("error", function(err) {
          res.end(err);
        });
      })
    }).listen(8888);

    // Here goes the magic. Append this in your client.
    $("body").append('<video controls autoplay src="http://localhost:8888/stream.mp4"></video>');

});

I'm not sure if Chrome even cares if the video is delivered with Content-Type: video/mp4, while we're actually playing a different video format. The world of HTML5 video streaming is a little odd sometimes.

¯\_(ツ)_/¯

(This applies to #796 as well)

Cheers,
Sander

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented May 17, 2016

@lesander You can simplify your code a lot because WebTorrent already has a built-in local http server that you can use from Node. Here's an example:

var client = new WebTorrent()
var magnetURI = 'magnet: ...'

client.add(magnetURI, function (torrent) {
  // create HTTP server for this torrent
  var server = torrent.createServer()
  server.listen(port) // start the server listening to a port

  // visit http://localhost:<port>/ to see a list of files

  // access individual files at http://localhost:<port>/<index> where index is the index
  // in the torrent.files array

  // later, cleanup...
  server.close()
  client.destroy()
})

👍

@stoufa88

This comment has been minimized.

Copy link

@stoufa88 stoufa88 commented May 19, 2016

I see that webtorrent desktop asks to open avi files in an external player, because it is not a supported container.
@lesander were you able to play avi videos using webtorrent in the browser?

@lesander

This comment has been minimized.

Copy link

@lesander lesander commented May 19, 2016

@stoufa88 Yes. All file formats supported by Chrome's video player.

@amilajack

This comment has been minimized.

Copy link
Contributor

@amilajack amilajack commented Jul 18, 2016

This could be done with WebChimera.js

@thangngoc89

This comment has been minimized.

Copy link

@thangngoc89 thangngoc89 commented Jul 18, 2016

Seconded on WebChimera.js . Why do all the work when VLC did it and we have a good binding?

"libvlc binding" no

VLC isn't required. Just use WebChimera-prebuilt

@lock

This comment has been minimized.

Copy link

@lock lock bot commented May 4, 2018

This thread has been automatically locked because it has not had recent activity. To discuss futher, please open a new issue.

@lock lock bot locked as resolved and limited conversation to collaborators May 4, 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
9 participants
You can’t perform that action at this time.