如何从React Native向Laravel后端发送JSON对象并成功存入数据库？

问题原因分析 #

你的500错误核心在于前后端请求格式不匹配：

• 用Insomnia测试时，你直接发送了联系人数组作为请求体，Laravel控制器可以直接遍历数组处理数据；
• 但React Native代码里，你把数组用JSON.stringify转成字符串后，又包在了{ data: ... }对象里发送。这导致Laravel收到的请求体不是预期的数组，而是包含data键的对象，控制器遍历$request->json()->all()时，拿到的是对象的键值对（而非联系人对象），自然会因找不到name/phone等字段抛出错误。

推荐解决方案：修改React Native前端代码 #

直接将联系人数组作为POST请求的主体发送，axios会自动处理JSON序列化，不需要手动JSON.stringify，也无需额外包裹data字段：

export default function Contact({ navigation }) {
  const { user, logout } = useContext(AuthContext)
  const [contact, setContact] = useState([]);
  const [count, setCount] = useState('');
  
  const uticontact = utility.con;
  console.log(uticontact)

  const SubmitCon = async () => {
    axios.defaults.headers.common['Authorization'] = `Bearer ${user.token}`;
    try {
      // 直接传递数组作为请求体，axios自动处理JSON格式
      await axios.post(`/api/contact`, utility.con);
      console.log(`Contacts successfully added`);
    } catch (err) {
      console.log(err);
    }
  };

  // ... 其他组件代码
}

这里加上await是为了确保请求完成后再打印成功日志，避免异步操作的时序问题。

备选方案：修改Laravel后端代码（不推荐） #

如果因特殊原因无法修改前端，可以调整Laravel控制器，先解析前端传来的data字段：

public function store(Request $request) {
  // 解析前端传来的JSON字符串为数组
  $contacts = json_decode($request->input('data'), true);
  
  // 检查解析是否成功，增加错误处理
  if (!is_array($contacts)) {
    return response()->json(["code" => 400, "message" => "Invalid data format"], 400);
  }

  foreach ($contacts as $record) {
    $contact = new Contact();
    $contact->name = $record['name'];
    $contact->phone = $record['phone'];
    $contact->users_id = $record['users_id'];
    $contact->save();
  }
  
  return response()->json([ "code" => 200, "message" => "Contacts added successfully" ]);
}

不过更推荐前端修改，这样请求格式和Insomnia测试的一致，更符合REST API的设计规范。

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