Flutter调用XAMPP中PHP接口时触发FormatException错误求助

我在用Flutter调用XAMPP本地服务器上的PHP接口插入用户数据时，触发了FormatException错误，控制台显示错误来自返回内容中的<br />字符。

控制台输出 #

正在执行热重启...
正在将文件同步到Android SDK built for x86设备...
应用已重启，耗时3,459ms。
D/InputConnectionAdaptor( 3257): 输入法已开启光标监控
D/InputConnectionAdaptor( 3257): 输入法已开启光标监控
I/flutter ( 3257): 捕获到错误！
I/flutter ( 3257): FormatException: 意外字符（位于第1个字符）
I/flutter ( 3257):

I/flutter ( 3257): ^
I/flutter ( 3257): 存在异常问题

我的Flutter代码 #

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

void main() {
  runApp( const MyApp());
}

class MyApp extends StatelessWidget{
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Trying Xammp First Time',
      home: const Xampp(),
      theme: ThemeData(
        colorScheme: const ColorScheme.highContrastDark()
      ),
    );
  }
}

class Xampp extends StatefulWidget {
  const Xampp({Key? key}) : super(key: key);

  @override
  State<Xampp> createState() => _XamppState();
}

class _XamppState extends State<Xampp> {
  TextEditingController namecontroller = TextEditingController();
  TextEditingController passwordcontroller = TextEditingController();
  Future<void> _login() async {
    var success = false;
    var data =<String, String> {
      "name": namecontroller.text,
      'password': passwordcontroller.text,
    };
    if (namecontroller.text != '' || passwordcontroller.text != '') {
      try {
        final baseurl = "http://10.0.2.2/";
        final url = "$baseurl/practice_api/insert_record.php";
        var res = await http.post(
            Uri.parse(url),
            body: data);
        final response = jsonDecode(res.body);
        success = response["result"] == "Success";
      } catch (e) {
        print("Catched an error!");
        print(e);
        success = false;
      }
    }
    if (success == "true") {
      print('Record Inserted');
      namecontroller.text = "";
      passwordcontroller.text = "";
    }
    else {
      print('Some issue');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Material(
      child: Form(
        child:Column(
          children: [
            const SizedBox(
              height: 30,
            ),
            TextFormField(
              controller: namecontroller,
              decoration:const InputDecoration(
                hintText: 'Enter What people call you i-e name ',
                icon: Icon(Icons.account_circle_sharp),
                labelText: 'Name',

              ) ,
            ),
            TextFormField(
              controller: passwordcontroller,
              obscureText: true,
              decoration: const InputDecoration(
                hintText: 'Password',
                icon: Icon(Icons.lock),
                labelText: 'Password',
              ),
            ),
             ElevatedButton(onPressed: (){
            _login();
            },
                 child: const Text('Insert')
            ),
          ],
        ) ,
      ),
    );
  }
}

1. PHP接口返回非法内容：FormatException的核心原因是你的insert_record.php脚本执行出错，没有输出预期的JSON格式，反而返回了PHP的错误提示（<br />是PHP报错时的换行标签），导致Flutter的jsonDecode无法解析。
2. Flutter代码存在逻辑错误：
   • 输入判断用了||，应该改成&&，需要同时填写用户名和密码才发起请求
   • success == "true"是错误写法，success是布尔类型，直接判断success即可

步骤1：修复PHP接口 #

1. 排查PHP错误：直接在浏览器访问http://127.0.0.1/practice_api/insert_record.php，或用Postman模拟POST请求传入name和password参数，查看具体错误信息（比如数据库连接失败、SQL语法错误、路径错误等）。
2. 确保PHP返回纯JSON：修改PHP脚本，强制返回JSON格式内容，示例如下：

<?php
// 必须设置响应头为JSON类型
header('Content-Type: application/json');

// 获取POST参数
$name = $_POST['name'] ?? '';
$password = $_POST['password'] ?? '';

// 参数校验
if(empty($name) || empty($password)){
    echo json_encode(["result" => "Failed", "message" => "用户名或密码不能为空"]);
    exit;
}

// 数据库插入逻辑（请根据实际配置修改）
// $conn = mysqli_connect("localhost", "root", "", "你的数据库名");
// if(!$conn){
//     echo json_encode(["result" => "Failed", "message" => "数据库连接失败"]);
//     exit;
// }
// $sql = "INSERT INTO 表名(name, password) VALUES('$name', '$password')";
// if(mysqli_query($conn, $sql)){
//     echo json_encode(["result" => "Success", "message" => "插入成功"]);
// }else{
//     echo json_encode(["result" => "Failed", "message" => "插入失败: ".mysqli_error($conn)]);
// }
// mysqli_close($conn);

// 临时测试返回
echo json_encode(["result" => "Success", "message" => "测试成功"]);
?>

步骤2：修复Flutter代码逻辑 #

修改_login方法中的错误：

Future<void> _login() async {
  var success = false;
  var data =<String, String> {
    "name": namecontroller.text,
    'password': passwordcontroller.text,
  };
  // 改为同时校验用户名和密码非空
  if (namecontroller.text.isNotEmpty && passwordcontroller.text.isNotEmpty) {
    try {
      final baseurl = "http://10.0.2.2/";
      final url = "$baseurl/practice_api/insert_record.php";
      var res = await http.post(
          Uri.parse(url),
          body: data);
      // 调试用：打印PHP返回的原始内容
      print("PHP返回内容: ${res.body}");
      final response = jsonDecode(res.body);
      success = response["result"] == "Success";
    } catch (e) {
      print("捕获到错误!");
      print(e);
      success = false;
    }
  }
  // 直接判断布尔类型变量
  if (success) {
    print('记录已插入');
    namecontroller.clear();
    passwordcontroller.clear();
  } else {
    print('存在异常问题');
  }
}

额外调试建议 #

• 确保XAMPP的Apache、MySQL服务正常运行
• 检查PHP脚本的数据库配置（主机名、用户名、密码、数据库名）是否正确
• 在Flutter代码中打印res.body，可以直观看到PHP返回的内容，快速定位问题

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