1264990 - Video element having crossorigin="use-credentials" cannot be played for cross-origin video source

Status: RESOLVED DUPLICATE of bug 1532722

(Core :: Audio/Video: Playback, defect, P3)

Description

[mitar.alex]

Attachment: requests.png

User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36

Steps to reproduce:

OS: Windows 8/10
Firefox: 43.0.1

In our system we develop a solution that allows to watch 360 video (as Youtube does).
For this purpose we use WebGL canvas and render 360 video on it.
Video is loaded from our file storage.
File storage and site are located on the different domains.
File storage uses cookie-based authentication.

To use video element for video source from another domain as a source for GL texture we have to use crossorigin attribute.
We cannot set it to 'anonymous' value because we need to transfer authorization cookies to our file storage.
So we set crossorigin attribute to 'use-credentials' value.



Actual results:

When we try to load video video element displays that 'Video playback aborted due to the network error.'

On the network tab of Developer Tools I see two requests for the source url sent by video element.
The first one is successful and transfers all authentication cookies (status 206).
The second sends 403 error because it does not transfer cookies at all.



Expected results:

Video element should transfer authentication cookies correctly for each request.

FYI: Our solution works in Chrome browser.

Comment 1

[Boris Zbarsky [:bzbarsky]]

I assume that you're replying with the right CORS headers?  It's hard to tell what's going on here without either a link to a page showing the problem or more information about what exact network traffic you're seeing, including the complete request and response headers (excluding your auth tokens, obviously) for lal the requests involved.

Note that you may want to test in a current/supported version of Firefox also, just to make sure it's still an issue there.  In this case that would be Firefox 46.

Comment 2

[Boris Zbarsky [:bzbarsky]]

Also, what the actual video element looks like and how it's set up might be useful (the source if it's just a static element, the script that builds the DOM tree and puts it in the DOM if it's script-generated) if you can't provide a link to the page showing the problem.

Comment 3

[Anthony Jones (:ajones, :kentuckyfriedtakahe, :k17e)]

Jason - should this be in the networking component?

Comment 4

[Jason Duell]

Anthony--I'm not sure what's going on here, but my gut guess is that this is either XHR not adding the header, or the CORS code, or some sort of issue with our new principals.  I.e. I suspect it's above the level of the necko code, which pretty much does what it's told to do by upper layers. 

What we really need here is a reproducible test case.

Comment 5

[Anthony Jones (:ajones, :kentuckyfriedtakahe, :k17e)]

Reporter - can you please provide a URL that reproduces the issue?

Comment 6

[Anthony Jones (:ajones, :kentuckyfriedtakahe, :k17e)]

Mass change P2 -> P3

Comment 7

[dbonner]

Hi, sorry to dredge up an old bug, but I'm running into the same issue.  On a page with just a video tag, where the video is both crossorigin and requires credentials, firefox will make the initial request with those credentials, and all subsequent requests without them.

I've worked out a simplified repro case using an nginx docker container.  It serves up the webpage on one port, and the video on another, sending CORS headers and requiring http basic auth.

I'm attaching the following files to help reproduce this:
* index.html
* nginx.conf
* htpasswd (just contains the user "username", with password "password")
* run.sh (shell script that mounts things in the right places in an nginx container)

The shell script assumes you've got a video file large enough to require multiple GETs is in the local directory, named "video.mp4".  In my case, I just grabbed a 15 minute video from youtube with youtube-dl.

Comment 8

[dbonner]

Attachment: index.html

Comment 9

[dbonner]

Attachment: nginx.conf

Comment 10

[dbonner]

Attachment: htpasswd

Comment 11

[dbonner]

Attachment: run.sh

Comment 12

[naktinis]

I think I'm experiencing the same issue. Firefox does not send the "Cookie" header with some partial requests when "crossorigin=use-credentials" is set on the video element (Chromium does, see below).

I have a simple HTML page served at http://localhost that sets the cookie and serves a video from http://localhost:5001:

<!doctype html>
<html>
  <body>
    <video controls crossorigin="use-credentials" src="http://localhost:5001/video"></video>
  </body>
  <script>
    document.cookie = 'some=key; domain=localhost; expires=Thu, 01 Jan 2020 00:00:01 GMT; path=/'
  </script>
</html>

The server sets Access-Control-Allow-Origin: http://localhost and Access-Control-Allow-Credentials: true (see below for the full list of headers).

Request headers from Firefox (video requested from http://localhost):

Host: localhost:5001
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:64.0) Gecko/20100101 Firefox/64.0
Accept: video/webm,video/ogg,video/*;q=0.9,application/ogg;q=0.7,audio/*;q=0.6,*/*;q=0.5
Accept-Language: pt-PT,pt;q=0.8,en;q=0.5,en-US;q=0.3
Referer: http://localhost/
Range: bytes=7602176-
Origin: http://localhost
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

Request headers from Chromium (video requested from http://localhost):

Host: localhost:5001
Connection: keep-alive
Origin: http://localhost
Accept-Encoding: identity;q=1, *;q=0
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36
Accept: */*
Referer: http://localhost/
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
Cookie: some=key
Range: bytes=557056-

Response:

HTTP/1.0 206 PARTIAL CONTENT
Content-Type: video/mp4
Last-Modified: Fri, 25 Jan 2019 16:12:41 GMT
Cache-Control: public, max-age=43200
Expires: Sat, 26 Jan 2019 06:43:10 GMT
ETag: "1548432761.7094197-100137876-866127560"
Date: Fri, 25 Jan 2019 18:43:10 GMT
Accept-Ranges: bytes
Access-Control-Allow-Origin: http://localhost
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Cache-Control,X-Requested-With
Server: Werkzeug/0.14.1 Python/3.7.2
Content-Range: bytes 100106240-100137875/100137876
Content-Length: 31636

Comment 13

[naktinis]

Just wanted to confirm whether the status should still be "NeedInfo from mitar.alex". I think dbonner and myself have reproduced this behaviour independently, and dbonner has also attached the code that should reproduce this. I could share mine as well if that would help.

Comment 14

[naktinis]

This still behaves incorrectly on Firefox 71. A video with crossorigin="user-credentials" will only send the first request with credentials, but all subsequent requests (i.e. range requests as the video plays or is being seeked) without.

If no one is able to take this on, could someone at least point to the relevant source files? I've never contributed before, but would be willing to take a look.

Comment 15

[Daniel Veditz [:dveditz]]

This looks like bug 1532722 which is getting fixed. Dupe?

Comment 16

[Bryce Seager van Dyk [:bryce] (he/him) - Not reading bugmail]

(In reply to Daniel Veditz [:dveditz] from comment #15)

This looks like bug 1532722 which is getting fixed. Dupe?

Going ahead and marking this as a dupe since we're landing the patch against that bug.

Comment 17

[dbonner]

Sorry for the delay, but yup, that looks like the same one.