Cookie 标头不会与 Fetch GET 请求一起发送到 Cloudfront。为什么？

Question

我正在尝试从 Stimulus 控制器向 Cloudfront 发送 Fetch GET 请求以及一些签名的 cookie，用于验证我的请求并检索受保护的内容。

问题是，尽管 S3、Cloudfront、Rails 服务器和客户端理论上的设置都是正确的，但 cookie 并未一起发送。

环境

Cloudfront 网址：

https://netflix.tonyfromtokyo.online/mm57enm1nx2u91ztntbu2idxxror/HLS/mm57enm1nx2u91ztntbu2idxxror.m3u8

客户端网址：
```
http://tonyfromtokyo.online:3000/movies/298486374
```
。我在我的
```
/etc/hosts
```
文件中添加了以下行：
```
127.0.0.1 tonyfromtokyo.online
```
，以便我可以从此域而不是
```
localhost:3000
```
发送请求。
浏览器上没有发生 CORS 错误。我允许了来自
```
http://tonyfromtokyo.online:3000
```
的请求。

我将 Cloudfront 响应标头设置为这样。

Rails 像这样设置 cookie：

cookies[key] = {
  value: value,
  domain: :all
}

它们已按预期正确设置。

现在，客户端代码在我的 Stimulus 控制器中如下所示。

import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="video-player"
export default class extends Controller {
  static targets = [ "video" ]
  static values = { videoUrl: String }

  connect() {
    fetch(this.videoUrlValue, { credentials: 'include' }) // No cookies sent. Why?

    // https://spekiyoblog.com/how-to-set-cookie-to-hlsjs-request/
    const config =
      {
          xhrSetup: function (xhr, url)
          {
            xhr.withCredentials = true; // No cookies sent. Why?

          },
          fetchSetup: function (context, initParams)
          {
            console.log("fetchSetup");
              // Always send cookies, even for cross-origin calls.
              initParams.credentials = 'include';
              return new Request(context.url, initParams);
          },
      };

    if (Hls.isSupported()) {
      console.log("HLS supported");
      var hls = new Hls(config);

      hls.loadSource(this.videoUrlValue);
      hls.attachMedia(this.videoTarget);
      this.videoTarget.play();
    } else if (this.videoTarget.canPlayType('application/vnd.apple.mpegurl')) {
      this.videoTarget.src = this.videoUrlValue;
      this.videoTarget.addEventListener('canplay',function() {
        this.videoTarget.play();
      });
    }
  }
}

[ request details5