React Native Fetch API创建用户接口部分Android设备请求失败问题

问题现象 #

域名续费后，iOS设备及部分Android 13设备调用API创建用户资料功能正常，但运行Android 12的Samsung Galaxy A13、Tecno Pova 3设备上，使用fetch发起请求时始终报错：网络请求失败。

可能原因及解决办法 #

1. SSL证书缓存未更新 #

域名续费后，Android 12设备可能仍缓存着旧的SSL证书，导致请求时证书信任验证失败

• 处理步骤：
  • 让用户清除设备的浏览器缓存及目标应用的缓存
  • 直接在设备浏览器中访问API地址，确认是否提示"网站不安全"，若有则检查服务器SSL证书是否已正确更新、证书链是否完整

2. Android 12网络安全配置限制 #

Android 12对明文HTTP请求的拦截更严格，若你的Config.SERVER_URL使用HTTP而非HTTPS，会被系统拦截

• 处理步骤：
  • 优先将服务器切换为HTTPS协议，确保证书有效
  • 若暂时无法切换，需修改Android端网络安全配置：
    1. 在android/app/src/main/res/xml目录下创建network_security_config.xml，内容如下：

       <?xml version="1.0" encoding="utf-8"?>
       <network-security-config>
           <domain-config cleartextTrafficPermitted="true">
               <domain includeSubdomains="true">你的域名</domain>
           </domain-config>
       </network-security-config>
       

    2. 在AndroidManifest.xml的application标签中添加配置：

       android:networkSecurityConfig="@xml/network_security_config"
       

3. FormData空值字段解析问题 #

Android 12对FormData的格式校验更严格，空字符串字段（如代码中的user_profile_url）可能导致请求解析失败

• 处理步骤：
  • 移除空值字段，或给空字段设置合理默认值，修改代码如下：

    const creataProfile = () => {
        let formdata = new FormData();
        formdata.append("xx", "Aftab");
        formdata.append("x1", "03408877654");
        formdata.append("x2", "PK");
        formdata.append("x3", "x1ddsf");
        // 仅当字段有值时添加
        // if (userProfileUrl) formdata.append("user_profile_url", userProfileUrl);
    
        var requestOptions = {
            method: "POST",
            body: formdata,
        };
    
        fetch(`${Config.SERVER_URL}/register_user.php`, requestOptions)
            .then((response) => response.json())
            .then(async (result) => {
                if (result.success) {
                    alert("登录成功！");
                } else {
                    alert("出现错误，请重试");
                }
            })
            .catch((err) => {
                console.error('请求错误详情:', err);
                alert(`请求失败：${err.message}`);
            });
    };
    

4. 服务器端UA/地域拦截 #

域名续费后，服务器防火墙或CDN可能对Android 12设备的请求UA进行了拦截

• 处理步骤：
  • 在请求中添加符合Android 12设备的UA头：

    var requestOptions = {
        method: "POST",
        body: formdata,
        headers: {
            'User-Agent': 'Mozilla/5.0 (Linux; Android 12; SM-A135F) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Mobile Safari/537.36'
        }
    };
    

  • 检查服务器防火墙、CDN的访问规则，确保未拦截Android 12设备的请求

5. React Native版本兼容性问题 #

旧版本React Native的fetch API在Android 12上存在兼容性bug

• 处理步骤：
  • 升级React Native至0.71+的稳定版本
  • 或改用axios替代原生fetch验证请求是否正常：

    import axios from 'axios';
    
    const creataProfile = async () => {
        let formdata = new FormData();
        formdata.append("xx", "Aftab");
        formdata.append("x1", "03408877654");
        formdata.append("x2", "PK");
        formdata.append("x3", "x1ddsf");
    
        try {
            const response = await axios.post(`${Config.SERVER_URL}/register_user.php`, formdata, {
                headers: { 'Content-Type': 'multipart/form-data' }
            });
            if (response.data.success) {
                alert("登录成功！");
            } else {
                alert("出现错误，请重试");
            }
        } catch (err) {
            console.error('请求错误详情:', err);
            alert(`请求失败：${err.message}`);
        }
    };
    

调试建议 #

• 在catch块中打印详细错误信息，替代通用提示，便于定位具体问题
• 使用Android Studio的Logcat过滤OkHttp或Network相关日志，查看网络请求的具体失败原因（如证书错误、连接超时等）

内容的提问来源于stack exchange，提问作者Engr.Aftab Ufaq