Sending origin cookies in Cors not working with VideoJS

Question

I have the following subdomains:

stream.example.com
sub.example.com

Both domains have SSL certificates and are valid. I am using videoJS 7.6.6 which has http_streaming library.

On sub.example.com , there is a video tag which sets a dash manifest as source containing links to stream.example.com.VideoJS needs to include laravel cookies from sub.example.com when making a request to stream.example.com links but this is not happening and when i download the HAR result from developer console i see empty cookies in the request.

My VideoJS HTML

<video-js id="player" class="video-js vjs-big-play-centered">
            <source src="data:application/dash+xml;charset=utf-8;base64,......." type="application/dash+xml" crossorigin="use-credentials">
        </video-js>

The mainifest is valid and it contains stream.example.com urls

VideoJS

player = window.player = videojs('player', {
            html5: {
                hls: {
                    withCredentials: true
                }
            },
            controls : true,
            fluid: true,
            controlBar: {
                children: ['playToggle', 'volumePanel', 'currentTimeDisplay', 'timeDivider', 'durationDisplay', 'progressControl', 'liveDisplay', 'seekToLive', 'remainingTimeDisplay', 'customControlSpacer', 'playbackRateMenuButton', 'chaptersButton', 'descriptionsButton', 'subsCapsButton', 'audioTrackButton', 'settingMenuButton', 'qualitySelector','fullscreenToggle']
            },
            preload : 'auto',
            poster : '',
        });
        player.hotkeys({
            volumeStep: 0.1,
            seekStep: 5,
            alwaysCaptureHotkeys: true
        });

        var myplugin = window.myplugin = player.myplugin();
    }(window, window.videojs));

stream.example.com has the following headers when i view a video link in a browser tab.

accept-ranges: bytes
access-control-allow-credentials: 1
access-control-allow-headers: Origin, X-Requested-With, Content-Type, Content-Length, Authorization,Range
access-control-allow-methods: GET, PUT, POST, DELETE, OPTIONS
access-control-allow-origin: https://sub.example.com
access-control-max-age: 86400
cache-control: private, max-age=18350
content-length: 69688791
content-range: bytes 0-69688790/69688791
content-type: video/mp4

I downloaded the HAR request to see how videoJS is making the request

  {
    "startedDateTime": "2020-03-15T07:53:57.647Z",
    "time": 1.1023430000004737,
    "request": {
      "method": "GET",
      "url": "https://stream.example.com/s/......",
      "httpVersion": "",
      "headers": [
        {
          "name": "Referer",
          "value": "https://sub.example.com/"
        },
        {
          "name": "Sec-Fetch-Dest",
          "value": "empty"
        },
        {
          "name": "User-Agent",
          "value": "Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36"
        },
        {
          "name": "DNT",
          "value": "1"
        },
        {
          "name": "Range",
          "value": "bytes=741-2044"
        }
      ],
      "queryString": [
        {
          "name": "u",
          "value": "....."
        }
      ],
      "cookies": [], // <-- The cookies are EMPTY
      "headersSize": -1,
      "bodySize": 0
    },

Edit 1

I am already sharing cookies in laravel by adding the following in .env

SESSION_DOMAIN = .example.com

The cookie domain for sub.example.com show .example.com but no cookie for stream.example.com

Edit 2

The response to videojs options request for stream.example.com are shown below

HTTP/2 204 No Content
server: nginx
cache-control: no-cache, private
date: Sat, 21 Mar 2020 06:19:26 GMT
access-control-allow-origin: https://sub.example.com
access-control-allow-methods: GET, POST, HEAD, OPTIONS
access-control-allow-headers: Origin, X-Requested-With, Content-Type, Content-Length, Authorization,Range
access-control-allow-credentials: 1
access-control-max-age: 86400
set-cookie: XSRF-TOKEN=eyJpdiI6ImM4czZNVFRRbWF1emFONXlVMjBGWkE9PSIsInZhbHVlIjoiazVDMUNIR2NqXC9QVUpJdjA3S2lHQ2pKdkJFeHpZdGVodHQ5XC9nZ3JHYVQyUk50V2cxdkQrZ1wvV3ZsOEpDVUhBSiIsIm1hYyI6IjUwYjk4ZjYyZDJmNjg1ZjU4YTg2MDE5ZGNkYmZlOTk5NWVmNTE5ZTRjY2Q1YzQ0ZDI3MzEyNWQ0YmExMzVjZGIifQ%3D%3D; expires=Sat, 21-Mar-2020 10:19:26 GMT; Max-Age=14400; path=/; domain=.example.com
set-cookie: laravel_session=eyJpdiI6IkZvZk9vK2J3YVVhQ2Q4VXpTZjZXN3c9PSIsInZhbHVlIjoiNHZId3orR3dQRDRiOXVFVitKR21NU21DbnVFXC9IcFMxaDFsUXRRUG9VQkFHZnNSdVpRSFBaaHJ5cXdGZDJObUgiLCJtYWMiOiI5ZjllY2IwZjFiNzkxYWMxNTI2ZTFiZWU5OTA4YjNjNzIxZWNkMTBiZjY0ZWQzNDBkMzg5MTEzYjM2MjQ4ODk1In0%3D; path=/; domain=.example.com
x-frame-options: SAMEORIGIN
x-xss-protection: 1; mode=block
x-content-type-options: nosniff
X-Firefox-Spdy: h2

Jannes Botis · Answer 1 · 2020-03-19T22:38:30.830

3

I assume you need to make the cookies valid for all subdomains, "share" them, as described how to share cookie between subdomain and domain:

if you use the following, it will be usable on both domains:

Set-Cookie: name=value; domain=example.com

Try an OPTIONS request to "url": "stream.example.com/s......" and see if you get the correct response cors headers as above? You can edit and resend the request through Firefox Developer tools.

All other look good.

Set cookies for cross origin requests

edited Mar 19 '20 at 22:38

answered Mar 17 '20 at 21:24

Jannes Botis

10,614
3
18
35

If i manually open the failed xhr in a new tab i see cookies with `.example.com` domain – user2650277 Mar 18 '20 at 15:51
@user2650277 it can be the options used html5: hls ... are for the previous version, try as here https://github.com/videojs/video.js/issues/5945 set withCredentials inside sources option. – Jannes Botis Mar 18 '20 at 16:18
Same here: https://github.com/videojs/http-streaming#withcredentials – Jannes Botis Mar 18 '20 at 17:00
i also already adding `withCredentials` as initialization option but its didn't work – user2650277 Mar 18 '20 at 17:05
I think you use the documentation of version 5, Version 7 says you should do: player.src({ withCredentials: true }); – Jannes Botis Mar 18 '20 at 17:07
Try an OPTIONS request to "url": "https://stream.example.com/s/......" and see if you get the correct response cors headers as above? You can edit and resend the request through Firefox Developer tools. – Jannes Botis Mar 19 '20 at 22:32
Can you add a screenshot of all the cookies settings from Developer tools? try to click on the cookie and copy its Data. – Jannes Botis Mar 21 '20 at 11:52
my main domain is `example.com` and on `sub.example.com` i see both request and response cookies.I see request cookies on `stream.example.com` if i view the url in a new tab.Via VideoJS (XHR) there is no cookies in the request for `stream.example.com`. The fact that i see cookies on `sub.example.com` show that cookies are correctly setup in laravel – user2650277 Mar 21 '20 at 12:11

Sending origin cookies in Cors not working with VideoJS

1 Answers1

Linked