时间戳

首页 > 解决方案 > 如何从标题中获取 Flutter Web 中的 cookie？

flutter - 如何从标题中获取 Flutter Web 中的 cookie？

问题描述

Flutter Web 应用程序发送 HTTP REST API POST 请求并返回 JSON 响应和 Set-Cookie 标头中的 cookie，如下所示。

（Flutter（频道测试版，1.22.0，在 Microsoft Windows 上）

设置 Cookie 标头

提取 cookie 时，响应似乎找不到标头值。调用和提取代码为：

var response = await http.post(url, headers: {"Content-Type": "application/json"}, body: jsonEncode(data));

if (response.statusCode == 200) {
  var cookie = response.headers['set-cookie'];
  print('cookie: $cookie');
}

控制台结果是：

cookie: null

服务器端在 Docker 容器中的 ASPNet.Core 3.1 上运行，但这不应该成为问题，因为 cookie 位于标头中。那么，如何在 Flutter Web 中提取它呢？

实际上，我的最终目标是将 cookie 与其他所有请求一起发回。但它似乎不会在浏览器中自动发生。因此，如果有人能指出处理这种情况的正确方法，这也是一个很好的解决方案。

任何帮助都将不胜感激。谢谢。

标签： fluttercookiesflutter-web

解决方案

这个问题是一个月前提出的，但我的回答可能对其他人有帮助。Flutter Web 中的 Cookie 由浏览器管理 - 如果 cookie 之前由 Set-Cookie 设置，它们会自动添加到请求（到 Cookie 标头）中 - 更准确地说，当您发布 build时它会正常工作。就我而言，它在开发构建期间不起作用。我的解决方案：

在服务器集标头上：

Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: http://localhost:61656

// 端口号可能不同

在颤动中：类成员：

final http.Client _client = http.Client();

// 例子

Future<String> getTestString() async {
    if (_client is BrowserClient)
      (_client as BrowserClient).withCredentials = true;
    await _client.get('https://localhost/api/login');
    await _client.get('https://localhost/api/login');
    return 'blah';
  }

http.Client() 如果 dart:io 可用则创建一个 IOClient，如果 dart:html 可用则创建一个 BrowserClient - 在 Flutter Web 中 dart:html 可用。将 withCredentials 设置为 true 会使 cookie 工作。

运行您的应用程序：

flutter run -d chrome --web-port=61656

// 与服务器上相同的端口号

请记住，在 Flutter Web 中，网络请求是使用浏览器 XMLHttpRequest 发出的。

推荐阅读