无法将数据库数据从后端获取至前端，附React代码求助

后端GET API经Postman测试可正常返回数据，但React前端无法成功获取数据。以下是涉及的前端代码：

相关代码 #

AllUsers.js #

import React, { useState, useEffect, forwardRef } from "react";
import UserService from "../actions/User";

export default function ViewUsers() {

  const [userList, setUserList] = useState(null);

  useEffect(() => {
    handleUser()
  }, [])

  const handleUser = async () =>{
    const users = await UserService.viewUser()
    console.log(users, "gg")
    setUserList(users);
  }
  console.log(userList,"1gmg")

UserService.js #

async viewUser() {
    const data = await this.sendRequest({
      method: 'GET',
      url: `http://localhost:80/allusers`,
      responseType: 'json',
    });
    return data.data;
}

排查方向 #

• 检查跨域问题：若前端与后端域名/端口不一致，后端需配置CORS支持。打开浏览器开发者工具的Network标签，查看请求是否存在CORS相关错误。
• 完善错误捕获逻辑：在异步请求中添加try/catch，避免请求失败导致代码中断，同时打印错误信息定位问题：

const handleUser = async () =>{
  try {
    const users = await UserService.viewUser()
    console.log(users, "gg")
    setUserList(users);
  } catch (error) {
    console.error('获取用户数据失败:', error);
  }
}

• 验证sendRequest方法：确认该方法是否正确处理了HTTP请求，是否在请求失败时抛出异常或返回错误信息。
• 核对请求URL：确认后端服务确实运行在localhost:80，且接口路径/allusers与后端路由完全匹配。
• 检查数据结构匹配：对比Postman返回的数据结构，确认data.data是否对应正确的返回字段——比如后端是否直接返回数组，还是嵌套在data属性下。
• 查看浏览器控制台：除了自定义的打印信息，检查是否有网络请求失败、语法错误等系统级提示。

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