New video containers

[neronmoon]

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]

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]

@feross I just know that MediacenterJS supports

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

Or am I off-topic?

[rom1504]

@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]

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

[rom1504]

https://github.com/strukturag/libde265.js might be useful

[diimdeep]

this looks good https://github.com/RSATom/WebChimera.js

[rom1504]

"libvlc binding" no

[feross]

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

[feross]

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

[lesander]

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]

@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]

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]

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

[amilajack]

This could be done with WebChimera.js

[thangngoc89]

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 thread has been automatically locked because it has not had recent activity. To discuss futher, please open a new issue.