Flutter中Azure AD B2C自定义用户名密码登录遇404问题求助

一、修正请求URL与参数错误 #

404错误核心原因是请求端点识别失败或参数格式非法，先从代码层面修正：

1. 移除无效参数

ROPC流使用grant_type=password时，不需要response_type参数（该参数属于授权码/隐式流），添加后会导致端点无法识别请求格式，需从请求body中删除：

// 移除这行代码
'response_type': 'token id_token'

2. 验证端点URL正确性

确保Azure AD B2C ROPC令牌端点格式完全正确：

Uri.parse('https://$b2cTenantName.b2clogin.com/$b2cTenantName.onmicrosoft.com/$userFlowName/oauth2/v2.0/token')

需确认：

• b2cTenantName是租户的完整名称（复制自Azure门户，注意不要添加多余后缀）
• userFlowName是专门创建的ROPC类型用户流（普通登录注册流不支持ROPC，会导致端点不存在）

二、检查Azure AD B2C配置前提 #

确保后端配置满足ROPC流要求：

• 已创建并发布ROPC类型用户流（Azure门户中用户流需点击「发布」才会生效）
• 应用注册中已启用ROPC流：在应用的「身份验证」设置里，开启「允许使用旧版流」选项（ROPC属于旧版密码流范畴）
• 应用注册未配置重定向URL限制（ROPC流不需要重定向URL，若配置会导致请求被拦截）

三、修正后的核心请求代码 #

修改后的_login方法请求部分：

void _login() async {
  final String b2cTenantName = 'XXXXtest';
  final String userFlowName = 'B2C_1_ROPC_Auth';
  final String clientId = '14096713-1c23-XXXX-8284-XXf2b6a5e22e';
  final String scope = 'openid offline_access $clientId';
  final String username = _usernameController.text;
  final String password = _passwordController.text;

  try {
    var response = await http.post(
      Uri.parse('https://$b2cTenantName.b2clogin.com/$b2cTenantName.onmicrosoft.com/$userFlowName/oauth2/v2.0/token'),
      headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      body: {
        'client_id': clientId,
        'grant_type': 'password',
        'scope': scope,
        'username': username,
        'password': password,
      },
    );

    if (response.statusCode == 200) {
      var data = json.decode(response.body);
      print('response.statusCode  ${response.statusCode}');
      print('response.body  ${response.body}');
      _showDialog('Login Successful', 'Access Token: ${data['access_token']}');
    } else {
      print('response.statusCode  ${response.statusCode}');
      print('Error Body: ${response.body}'); // 新增：打印错误详情辅助排查
      _showDialog('Login Failed', 'Failed to log in. Status Code: ${response.statusCode}');
    }
  } catch (e) {
    print('response.e   ${e}');
    _showDialog('Login Error', 'An error occurred: $e');
  }
}

四、额外排查建议 #

• 先用Postman测试相同参数的请求，若仍返回404，说明问题出在Azure配置而非Flutter代码
• 移除MyHttpOverrides中的SSL禁用逻辑（生产环境绝对禁止，测试环境仅在自签名证书场景下使用）
• 检查scope参数是否包含有效权限，openid用于获取ID令牌，offline_access用于刷新令牌，客户端ID作为scope表示访问应用自身API

内容的提问来源于stack exchange，提问作者Dasun Dola