WebTorrent Issues in Firefox, Safari etc. #1606

Alexdrr · 2019-03-30T17:14:04Z

Hello! Please help me deal with the problem WebTorrent.

On the webtorrent.io website, the video is played in Chrome 73.0.38,73.0.36, Opera 58.0.31, Safari 12.1, 12.0.3, Firefox 66.02, 67.0b6 Android, IOS browsers (only after full video download).

We installed WebTorrent Desktop on a separate server and start seeding few videos. Installed uWT tracker on another server (for now without ssl - only ws: //). WebTorrent connects to the tracker.

We used several player examples, for example:

<!DOCTYPE html>
<html>

<head>
  <title>Dplayer</title>
  <meta charset="UTF-8">
  <!-- Player Style -->
  <link rel=stylesheet type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/dplayer/1.25.0/DPlayer.min.css"></link>
  <!-- WebTorrent  -->
  <script src="//cdn.jsdelivr.net/webtorrent/latest/webtorrent.min.js"></script>
  <!-- Player -->
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/dplayer/1.25.0/DPlayer.min.js"></script>
</head>

<body>
  <div id="dplayer"></div>
  <script>
  var torrentId = 'magnet:?xt=urn:btih:FFECB9R120022E63CC6395638434467416687B82&dn=720p.mp4&tr=ws%3A%2F%2Fdomain.com%3A8000';

  const dp = new DPlayer({
    container: document.getElementById('dplayer'),
    screenshot:true,
    video: {
        url: `${torrentId}`,
        type: 'customWebTorrent',
        customType: {
            'customWebTorrent': function (video, player) {
                player.container.classList.add('dplayer-loading');
                const client = new WebTorrent();
                const torrentId = video.src;
                client.add(torrentId, (torrent) => {
                    const file = torrent.files.find((file) => file.name.endsWith('.mp4'));
                    file.renderTo(video, {
                        autoplay: player.options.autoplay
                    }, () => {
                        player.container.classList.remove('dplayer-loading');
                    });
                });
            }
        }
    }
});
  </script>
</body>
</html>

also tried claprr, videojs, plyr players, and html5 player - the result is the same -

chrome - instantly play and works fine.

firefox - not work, playing starts only if the same video is open in the chrome browser.

The request from an outside source is blocked: The policy of one source prohibits reading a remote resource on a magnet:?xt=urn:btih:FFECB9R120022E63CC6395638434467416687B82&dn=720p.mp4&tr=ws%3A%2F%2Fdomain.com%3A8000. (Reason: CORS request is not made by http).
ICE failed, add a TURN server and see about:webrtc for more details
Successfully compiled asm.js code (total compilation time 1ms) webtorrent.min.js

safari - does not work, an error in the browser console

[Error] Failed to load resource: URL not supported (magnet:?xt=urn:btih:FFECB9R120022E63CC6395638434467416687B82&dn=720p.mp4&tr=ws%3A%2F%2Fdomain.com%3A8000, line 0)
[Error] Unhandled Promise Rejection: TypeError: Argument 1 ('options') to RTCPeerConnection.createOffer must be a dictionary (x10)
[Error] Unhandled Promise Rejection: TypeError: Argument 1 ('options') to RTCPeerConnection.createOffer must be a dictionary
rejectPromise
reject
_createOffer (webtorrent.min.js:7:14960)
onnegotiationneeded (webtorrent.min.js:7:10602)

We tried to connect the webtorrent.min.js library of different versions - 0.3 and 0.98 - the result is the same.

Please tell me, the webtorrent.io website works and loads quickly, and works only in Chrome on its server with its torrent

froduit · 2019-04-01T15:31:56Z

You need to check the CORS settings of the seeding sever (with WebTorrent Desktop).
Make sure that you allow Range header and OPTIONS method. AllowCredentials must be set to true and recommended MaxAge = 600.

Hope that helps. I managed to make it work with WebTorrent Desktop seeding from Windows server .

Alexdrr · 2019-04-01T15:35:20Z

CORS settin

thanks! i'll try do it.

your torrents work in Firefox and Safari? With only WebTorrent Desktop seeding server and without other peers?

Alexdrr · 2019-04-01T17:25:13Z

You need to check the CORS settings of the seeding sever (with WebTorrent Desktop).
Make sure that you allow Range header and OPTIONS method. AllowCredentials must be set to true and recommended MaxAge = 600.

Hope that helps. I managed to make it work with WebTorrent Desktop seeding from Windows server .

sorry, tell me pls, if i use WebTorrent Desktop on Windows or Linux server and not have any services, where i need setting up CORS? I need install nginx or..?
Also i not have domain on this server, CORS work only with server with domain name ? thanks

froduit · 2019-04-04T13:32:19Z

sorry, tell me pls, if i use WebTorrent Desktop on Windows or Linux server and not have any services, where i need setting up CORS? I need install nginx or..?
Also i not have domain on this server, CORS work only with server with domain name ? thanks

Yes I am using WebTorrent Desktop on Windows to create the torrents and seed them. On the same machine I then use an IIS server as a webseed (to serve the .mp4 files). It works great on Safari, Edge, Chrome and Firefox.

You should include webtorrent from the CDN :
<script src="https://cdn.jsdelivr.net/npm/webtorrent@latest/webtorrent.min.js"></script>

and make sure to allow your origin (the site from which the videos will be played) in your CORS settings. The user-agent header should also be allowed.

These CORS settings must be set on the server which is serving the webseed (ws=http...) files (in my case the IIS server).

Alexdrr · 2019-04-05T12:11:07Z

sorry, tell me pls, if i use WebTorrent Desktop on Windows or Linux server and not have any services, where i need setting up CORS? I need install nginx or..?
Also i not have domain on this server, CORS work only with server with domain name ? thanks

Yes I am using WebTorrent Desktop on Windows to create the torrents and seed them. On the same machine I then use an IIS server as a webseed (to serve the .mp4 files). It works great on Safari, Edge, Chrome and Firefox.

You should include webtorrent from the CDN :
<script src="https://cdn.jsdelivr.net/npm/webtorrent@latest/webtorrent.min.js"></script>

and make sure to allow your origin (the site from which the videos will be played) in your CORS settings. The user-agent header should also be allowed.

These CORS settings must be set on the server which is serving the webseed (ws=http...) files (in my case the IIS server).

Thanks! Can yoy please show me your player code working on Firefox and Chrome? I use samples from github but receive error that "not can load from url magnet:"

stale · 2019-07-04T13:02:26Z

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.

stale bot added the stale label Jul 4, 2019

stale bot closed this Jul 11, 2019

webtorrent / webtorrent

WebTorrent Issues in Firefox, Safari etc. #1606

WebTorrent Issues in Firefox, Safari etc. #1606

Alexdrr commented Mar 30, 2019

This comment has been minimized.

froduit commented Apr 1, 2019

This comment has been minimized.

Alexdrr commented Apr 1, 2019

This comment has been minimized.

Alexdrr commented Apr 1, 2019 •

edited

This comment has been minimized.

froduit commented Apr 4, 2019 •

edited

This comment has been minimized.

Alexdrr commented Apr 5, 2019

This comment has been minimized.

stale bot commented Jul 4, 2019

webtorrent / webtorrent

Sponsor webtorrent/webtorrent

Join GitHub today

WebTorrent Issues in Firefox, Safari etc. #1606

WebTorrent Issues in Firefox, Safari etc. #1606

Comments

Alexdrr commented Mar 30, 2019

This comment has been minimized.

froduit commented Apr 1, 2019

This comment has been minimized.

Alexdrr commented Apr 1, 2019

This comment has been minimized.

Alexdrr commented Apr 1, 2019 • edited

This comment has been minimized.

froduit commented Apr 4, 2019 • edited

This comment has been minimized.

Alexdrr commented Apr 5, 2019

This comment has been minimized.

stale bot commented Jul 4, 2019

Alexdrr commented Apr 1, 2019 •

edited

froduit commented Apr 4, 2019 •

edited