Flutter集成Laravel API问题：首页接口无法验证登录状态

我有三个页面：注册页、登录页、首页。注册页收集用户信息，提交成功后跳转至登录页；登录页验证用户凭证，成功后跳转至首页。

后端Laravel的注册、登录接口运行正常，但首页的GET接口存在问题：该接口无需用户输入信息，本应通过验证用户登录状态返回用户详情，但调用后返回登录页面的HTML内容，而非预期数据。

我使用SharedPreferences prefs = await SharedPreferences.getInstance();存储Key和csrf，相关代码如下：

_getKey() async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  key = prefs.getString('key');
}

_getCSRF() async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  csrf = prefs.getString('csrf');
  print(csrf);
}
_setAuthHeaders() => {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
      'Authorization': 'Bearer $key'
    };
getData() async {
  await _getCSRF();
  await _getKey();
  print(_setAuthHeaders());
  String uri = "$baseUrlUser/user_bal";
  try {
    return await http.get(Uri.parse(uri), headers: _setAuthHeaders());
  } catch (e) {
    return e;
  }
}

接口返回内容：

<!DOCTYPE html>
I/flutter ( 3457): <html lang="en">
I/flutter ( 3457): <head>
I/flutter ( 3457): <meta charset="utf-8">
I/flutter ( 3457): <meta name="viewport" content="width=device-width, initial-scale=1">
I/flutter ( 3457): <meta name="csrf-token" content="6PjARs1hf0tx66pfM7WGh0ct7VNBxbhXDYElvu6u" />
I/flutter ( 3457): <title>Retailer Login | xxxxxx</title>
I/flutter ( 3457):
I/flutter ( 3457): <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
I/flutter ( 3457):
I/flutter ( 3457): <link rel="stylesheet" href="../plugins/fontawesome-free/css/all.min.css">
I/flutter ( 3457):
I/flutter ( 3457): <link rel="stylesheet" href="../plugins/icheck-bootstrap/icheck-bootstrap.min.css">
I/flutter ( 3457):
I/flutter ( 3457): <link rel="stylesheet" href="../dist/css/adminlte.min.css">

请求头已携带Authorization，但接口仍返回登录页HTML。

1. 验证Token有效性 #

直接用Postman调用/user_bal接口，手动携带存储的key作为Bearer Token，确认是否返回正确数据。若Postman也返回登录页，说明Token已过期或未正确生成，需排查Laravel的Token过期配置或登录逻辑。

2. 修正CSRF Token处理 #

如果/user_bal路由属于Laravel的web中间件组（而非api组），必须携带CSRF Token。当前代码仅获取了csrf但未加入请求头，修改_setAuthHeaders()方法：

_setAuthHeaders() => {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
      'Authorization': 'Bearer $key',
      'X-CSRF-TOKEN': csrf
    };

3. 确认路由中间件配置 #

检查Laravel路由，确保/user_bal使用auth:api中间件，而非web组的auth中间件（web中间件会重定向到登录页，api中间件返回JSON格式的未授权响应）：

Route::get('/user_bal', [UserController::class, 'getUserBal'])->middleware('auth:api');

4. 修复异步变量赋值问题 #

避免依赖全局变量存储key和csrf，直接在getData()方法内获取并构建请求头，防止变量赋值异常：

getData() async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  String? key = prefs.getString('key');
  String? csrf = prefs.getString('csrf');
  
  Map<String, String> headers = {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
    'Authorization': 'Bearer $key',
    'X-CSRF-TOKEN': csrf ?? ''
  };
  
  print(headers);
  String uri = "$baseUrlUser/user_bal";
  try {
    return await http.get(Uri.parse(uri), headers: headers);
  } catch (e) {
    return e;
  }
}

5. 校验实际请求头 #

用抓包工具确认请求实际发送的Accept、Authorization等头是否与代码配置一致，避免因框架或环境导致头信息丢失。

内容的提问来源于stack exchange，提问作者Sandeep Sharma