如何使用Flutter GetX实现全类型HTTP API请求（已完成Get请求）

GetX的HTTP请求核心依赖GetConnect类，你可以把请求逻辑封装在一个单独的服务类或GetX控制器里。下面是除Get请求外，各类HTTP请求的实现方式：

基础服务类初始化 #

先创建一个基础的API服务类，统一配置基础URL、超时、拦截器等：

class ApiService extends GetConnect {
  final String baseUrl = 'https://api.example.com';

  @override
  void onInit() {
    super.onInit();
    httpClient.baseUrl = baseUrl;
    httpClient.timeout = const Duration(seconds: 10);
    // 可选：统一处理响应拦截
    httpClient.addResponseModifier((request, response) {
      if (response.statusCode >= 400) {
        print('API错误: ${response.statusText}');
      }
      return response;
    });
  }
}

POST 请求（JSON 体） #

用于提交JSON格式的新资源：

// 在ApiService类中添加方法
Future<Response> postJsonData(Map<String, dynamic> payload) async {
  try {
    return await post('/users', payload);
  } catch (e) {
    return Response(statusCode: 500, statusText: e.toString());
  }
}

// 使用方式
final apiService = Get.put(ApiService());
apiService.postJsonData({'name': 'Alice', 'email': 'alice@example.com'}).then((res) {
  if (res.statusCode == 201) {
    print('创建成功: ${res.body}');
  } else {
    print('创建失败: ${res.statusText}');
  }
});

PUT 请求（完整更新资源） #

用于替换或更新整个资源：

// 在ApiService类中添加方法
Future<Response> putFullData(int userId, Map<String, dynamic> payload) async {
  try {
    return await put('/users/$userId', payload);
  } catch (e) {
    return Response(statusCode: 500, statusText: e.toString());
  }
}

// 使用
apiService.putFullData(1, {'name': 'Alice Updated', 'email': 'alice_new@example.com'}).then((res) {
  if (res.statusCode == 200) {
    print('更新完成');
  }
});

DELETE 请求（删除资源） #

用于移除指定资源：

// 在ApiService类中添加方法
Future<Response> deleteResource(int userId) async {
  try {
    return await delete('/users/$userId');
  } catch (e) {
    return Response(statusCode: 500, statusText: e.toString());
  }
}

// 使用
apiService.deleteResource(1).then((res) {
  if (res.statusCode == 204) {
    print('删除成功');
  }
});

PATCH 请求（部分更新资源） #

仅更新资源的部分字段：

// 在ApiService类中添加方法
Future<Response> patchPartialData(int userId, Map<String, dynamic> payload) async {
  try {
    return await patch('/users/$userId', payload);
  } catch (e) {
    return Response(statusCode: 500, statusText: e.toString());
  }
}

// 使用
apiService.patchPartialData(1, {'email': 'alice_updated@example.com'}).then((res) {
  print('部分更新完成');
});

Form Data 请求（表单编码） #

发送application/x-www-form-urlencoded格式的表单数据：

// 在ApiService类中添加方法
Future<Response> sendFormUrlEncoded(Map<String, String> formData) async {
  try {
    return await post(
      '/login',
      formData,
      contentType: Headers.formUrlEncodedContentType,
    );
  } catch (e) {
    return Response(statusCode: 500, statusText: e.toString());
  }
}

// 使用
apiService.sendFormUrlEncoded({'username': 'alice', 'password': '123456'}).then((res) {
  if (res.statusCode == 200) {
    print('登录成功');
  }
});

Multipart 请求（文件上传） #

用于上传文件（图片、文档等）：

// 在ApiService类中添加方法
Future<Response> uploadFile(File file, String description) async {
  try {
    final form = FormData({
      'avatar': MultipartFile(file, filename: file.path.split('/').last),
      'description': description,
    });
    return await post('/upload/avatar', form);
  } catch (e) {
    return Response(statusCode: 500, statusText: e.toString());
  }
}

// 使用（示例：从本地路径选择文件）
final selectedFile = File('/storage/emulated/0/Download/avatar.jpg');
apiService.uploadFile(selectedFile, '个人头像').then((res) {
  if (res.statusCode == 200) {
    print('上传成功');
  }
});

结合GetX状态管理更新UI #

可以把请求逻辑放到GetX控制器中，配合响应式变量自动更新UI：

class UserController extends GetxController {
  final ApiService apiService = ApiService();
  final RxList<Map<String, dynamic>> users = RxList([]);

  Future<void> fetchUsers() async {
    final res = await apiService.get('/users');
    if (res.statusCode == 200) {
      users.assignAll(List<Map<String, dynamic>>.from(res.body));
    }
  }
}

// 在UI中使用
final controller = Get.put(UserController());
Obx(() => ListView.builder(
  itemCount: controller.users.length,
  itemBuilder: (context, index) => ListTile(
    title: Text(controller.users[index]['name']),
  ),
));

内容的提问来源于stack exchange，提问作者Abhijeet Vishwakarma