Flutter如何POST JSON数组与对象？API调用报错求助

一、修复http库的调用问题，正确发送JSON数组 #

你当前用的是http.get方法，但GET请求通常不携带请求体，要发送JSON数据应该用http.post，同时需要正确序列化包含数组的JSON结构，还要设置正确的请求头。

核心修正点 #

1. 切换请求方法：改用http.post发送带请求体的请求
2. 添加必要请求头：指定Content-Type: application/json，告知服务器接收JSON格式数据
3. 修复JSON语法错误：你提供的原始JSON末尾"projectId":}存在语法问题，必须补全对应值（如"projectId": "your-project-id"）
4. 正确序列化数组：确保scenes、src、text_animation等数组结构完整，用Dart的List和Map对应JSON的数组和对象

完整代码示例 #

import 'package:http/http.dart' as http;
import 'dart:convert';

Future<void> sendApiRequest() async {
  final url = Uri.parse('你的API地址');
  // 构建符合要求的请求数据（包含数组结构）
  final requestData = {
    "audio": {},
    "output": {
      "width": 110,
      "height": 110,
      "format": "mp4",
      "name": "video",
      "title": "video",
      "description": ""
    },
    "scenes": [
      {
        "background": {
          "src": [
            {"url": "", "asset_id": "", "type": "video"}
          ],
          "bg_animation": {"animation": ""}
        },
        "time": 7.42,
        "keywords": [],
        "sub_scenes": [
          {
            "time": 0.88,
            "location": {
              "center_x": 360,
              "end_y": 1190.3999999999999,
              "start_y": 1131.625
            },
            "text_lines": [
              {
                "text_animation": [{"source": "templates", "type": "start"}],
                "text_bg_animation": [{"source": "templates", "type": "start"}],
                "text": "Six websites. To"
              }
            ],
            "subtitle": "",
            "font": {"name": "Helvetica.ttf", "size": "26"}
          }
        ],
        "sentences": [{"time": 0.88, "text": "Six websites. To"}],
        "music": false,
        "tts": false,
        "subtitle": true
      }
    ],
    "projectId": "你的项目ID" // 补全缺失的项目ID值
  };

  try {
    final response = await http.post(
      url,
      headers: {
        "Authorization": "access",
        "Content-Type": "application/json" // 必须添加该头
      },
      body: jsonEncode(requestData), // 将Dart对象序列化为JSON字符串
    );

    if (response.statusCode == 200) {
      print('请求成功: ${response.body}');
    } else {
      print('请求失败，状态码: ${response.statusCode}，响应: ${response.body}');
    }
  } catch (e) {
    print('请求异常: $e');
  }
}

二、更简便的API调用库推荐：dio #

dio是功能更强大的Dart HTTP客户端，支持自动JSON序列化/反序列化、拦截器、异常统一处理等，比原生http库更易用。

步骤1：添加依赖 #

在pubspec.yaml中添加：

dependencies:
  dio: ^5.4.0+1 # 使用最新版本

执行flutter pub get完成依赖安装。

步骤2：dio调用代码示例 #

import 'package:dio/dio.dart';

Future<void> sendRequestWithDio() async {
  final dio = Dio();
  final url = '你的API地址';

  final requestData = {
    // 结构与http示例中的requestData完全一致
    "audio": {},
    "output": {
      "width": 110,
      "height": 110,
      "format": "mp4",
      "name": "video",
      "title": "video",
      "description": ""
    },
    "scenes": [
      {
        "background": {
          "src": [
            {"url": "", "asset_id": "", "type": "video"}
          ],
          "bg_animation": {"animation": ""}
        },
        "time": 7.42,
        "keywords": [],
        "sub_scenes": [
          {
            "time": 0.88,
            "location": {
              "center_x": 360,
              "end_y": 1190.3999999999999,
              "start_y": 1131.625
            },
            "text_lines": [
              {
                "text_animation": [{"source": "templates", "type": "start"}],
                "text_bg_animation": [{"source": "templates", "type": "start"}],
                "text": "Six websites. To"
              }
            ],
            "subtitle": "",
            "font": {"name": "Helvetica.ttf", "size": "26"}
          }
        ],
        "sentences": [{"time": 0.88, "text": "Six websites. To"}],
        "music": false,
        "tts": false,
        "subtitle": true
      }
    ],
    "projectId": "你的项目ID"
  };

  try {
    final response = await dio.post(
      url,
      options: Options(
        headers: {"Authorization": "access"},
      ),
      data: requestData, // dio自动将Map序列化为JSON，无需手动编码
    );

    print('请求成功: ${response.data}');
  } on DioException catch (e) {
    // 统一处理dio异常，包含状态码、响应详情等
    print('请求失败: ${e.response?.statusCode}，信息: ${e.response?.data}');
    print('异常详情: $e');
  }
}

关键注意事项 #

• 确保JSON数据结构完全符合API要求，数组、对象的括号配对正确，键值对格式无误
• 必须设置Content-Type: application/json请求头，否则服务器无法正确解析请求体，这是"Invalid Argument"错误的常见原因
• 如果仍报错，建议打印序列化后的JSON字符串，对比API文档检查结构是否匹配

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