Flutter项目中Dio请求返回Http 404错误排查求助

错误日志 #

I/flutter (28276): 在此处发现错误 DioError [DioErrorType.response]: Http状态错误 [404]

相关代码片段 #

主页面 #

@override
Widget build(BuildContext context) {
  return BlocProvider(create: (context)=> ShopCubit()..getHomeData(),
    child: BlocConsumer<ShopCubit,ShopStates>(
      listener: (context,state){},
      builder: (context,state){
        return MaterialApp(
          theme: lightTheme,
          darkTheme: darkTheme,
          themeMode: ThemeMode.light,
          home: stateWidget,
        );
      },
    ),);
}

Cubit页面 #

HomeModel homeModel;

void getHomeData() {
  emit(ShopLoadingDataState());
  DioHelper.getData(url: home, token: token).then((value) {
    homeModel = HomeModel.fromJson(value.data);
    print(homeModel.toString());
    print(homeModel.status);
    emit(ShopSuccessDataState());
  }).catchError((error) {
    print('Error found Here $error');
    emit(ShopErrorDataState());
  });
}

DioHelper工具类 #

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';

class DioHelper {
  static Dio dio;
  static init() {
    dio = Dio(BaseOptions(
      baseUrl: 'https://student.valuxapps.com/api/',
      receiveDataWhenStatusError: true,
    ));
  }
  
  static Future getData({
    @required String url,
    Map<String, dynamic> query,
    String lang = 'en',
    String token,
  }) async {
    dio.options.headers = {
      'Content-Type': 'application/json',
      'lang': lang,
      'Authorization': token,
    };
    return await dio.get(url, queryParameters: query);
  }

  static Future postData({
    @required String url,
    Map<String, dynamic> query,
    @required Map<String, dynamic> data,
    String lang = 'en',
    String token,
  }) async {
    dio.options.headers = {
      'Content-Type': 'application/json',
      'lang': lang,
      'Authorization': token,
    };
    return dio.post(
      url,
      data: data,
      queryParameters: query,
    );
  }
}

排查与解决方法 #

404表示请求的资源不存在，重点排查以下几点：

• 检查请求路径home变量的值：
  你在Cubit中使用url: home，但未展示home的具体内容。确认：

  • 路径是否与后端API文档一致（比如是否应为'home'或'home-data'）
  • 拼接后的完整URL是否正确：https://student.valuxapps.com/api/ + home，直接在浏览器/Postman中测试这个URL是否可访问

• 确认Dio是否初始化：
  检查DioHelper.init()是否在App启动时调用（比如main()方法中），未初始化会导致Dio配置无效，引发请求异常

• 验证Token的必要性与有效性：
  如果首页接口不需要Token，无效Token可能被后端伪装成404返回。先尝试去掉Token请求：

  DioHelper.getData(url: home).then(...)
  

  若请求成功，再排查Token的获取和传递逻辑

• 检查路径拼接的斜杠问题：
  确保baseUrl末尾斜杠与请求路径的斜杠不重复/缺失：

  • baseUrl末尾有斜杠时，请求路径不要以斜杠开头（如用'home'而非'/home'）
  • baseUrl末尾无斜杠时，请求路径需以斜杠开头，避免拼接出错误路径

• 直接测试完整请求URL：
  把拼接后的完整URL复制到Postman或浏览器测试，若仍返回404，联系后端确认接口是否存在；若正常，再排查Dio的请求配置细节

内容的提问来源于stack exchange，提问作者AHMED_ GOMAA