React Native中fetch请求成功后Alert不弹出提示如何解决

你遇到的「数据插入成功但前端无弹窗」问题由3个明确的代码问题导致：

• 前端fetch配置了mode:'no-cors'：该模式下请求可以正常发送到服务端（所以数据库能写入成功），但前端被禁止读取任何响应内容，拿到的response是不透明的opaque类型，调用response.json()会直接抛出解析错误，逻辑直接进入catch分支，不会走到后续Alert调用的逻辑里。no-cors模式仅适用于埋点上报这类不需要读取响应结果的场景，完全不能用于普通业务接口请求
• 后端返回格式不统一：接口执行失败时直接返回纯文本字符串，不是合法JSON格式，即使移除no-cors配置，请求走到失败分支时也会触发JSON解析错误。
• 前端未做异常场景提示：catch分支仅打印错误日志，没有任何用户提示，所以解析失败时用户看不到任何反馈。同时Alert.alert的传参不符合规范，该方法第一个入参是弹窗标题，直接传入解析结果在部分RN版本下会出现渲染异常。

前端代码调整 #

移除no-cors配置，增加响应状态校验、JSON解析容错，补全异常提示，调整Alert传参符合API要求：

fetch(InsertAPIURL, {
  method: 'POST',
  headers: headers,
  body: JSON.stringify(Data)
})
.then(async (response) => {
  if (!response.ok) {
    throw new Error(`请求异常，状态码：${response.status}`);
  }
  // 先读取原始文本再解析JSON，避免解析失败时无法定位问题
  const rawText = await response.text();
  try {
    return JSON.parse(rawText);
  } catch (parseErr) {
    return rawText;
  }
})
.then((res) => {
  Alert.alert(
    '操作提示',
    typeof res === 'string' ? res : res.message || JSON.stringify(res)
  );
})
.catch((error) => {
  console.error("请求失败：", error);
  Alert.alert('操作提示', error.message || '网络异常，请稍后重试');
})

后端PHP代码调整 #

统一所有分支返回合法JSON格式，增加必要的跨域响应头，处理OPTIONS预检请求：

// 设置JSON响应头
header('Content-Type: application/json');
// 按需配置跨域，生产环境请将*替换为实际前端域名，不要用通配符
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type');

// 处理跨域预检请求
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
  http_response_code(200);
  exit;
}

$register = mysqli_query($CN, $insertuserid);
$result = [];
if ($register) {
  $result['code'] = 0;
  $result['message'] = "Member has been registered successfully";
} else {
  $result['code'] = -1;
  $result['message'] = "Server Error... please try later";
}

echo json_encode($result);
exit;

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