在 Cors 中发送原始 cookie 不适用于 VideoJS

Question

我有以下子域：

1. stream.example.com
2. sub.example.com

这两个域都有 SSL 证书并且有效。我正在使用videoJS 7.6.6它具有http_streaming库。

上sub.example.com，有一个视频标签将破折号清单设置为包含指向stream.example.com.VideoJS 的链接的源，sub.example.com在向stream.example.com链接发出请求时需要包含 Laravel cookie，但这并没有发生，当我HAR result从开发人员控制台下载时，我在要求。

我的 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>

mainifest 是有效的，它包含stream.example.com网址

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 当我在浏览器选项卡中查看视频链接时，有以下标题。

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

我下载了 HAR 请求以查看 videoJS 如何发出请求

  {
    "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
    },

编辑 1

我已经通过在 .env 中添加以下内容在 laravel 中共享 cookie

SESSION_DOMAIN = .example.com

Cookie域的sub.example.com表演.example.com，但没有cookie中stream.example.com

编辑 2

对 videojs 选项请求的响应stream.example.com如下所示

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

Answer 1

我假设您需要使 cookie对所有子域都有效，“共享”它们，如如何在子域和域之间共享 cookie所描述的：

如果您使用以下内容，它将在两个域上都可用：

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

尝试对“url”：“stream.example.com/s......”发出 OPTIONS 请求，看看您是否获得了如上所述的正确响应 cors 标头？您可以通过 Firefox Developer 工具编辑并重新发送请求。

其他看起来都不错。

• 为跨源请求设置cookie