React Native升级至71后安卓WebView Cookie失效问题求助

可能原因及对应解决步骤 #

1. 隐私模式（incognito）的影响 #

RN 71中安卓WebView的incognito={true}会启用隐私浏览模式，该模式会隔离会话Cookie，即使设置sharedCookiesEnabled也无法正常共享。如果业务不需要隐私模式，先尝试关闭：

<WebView
  incognito={false} // 改为false
  // 其他原有属性保持不变
/>

测试是否能正常识别Cookie，若恢复正常则说明隐私模式是问题根源。

2. Cookie设置方式调整（替代header传递） #

直接通过source.headers传递Cookie在RN 71安卓端可能存在兼容性问题，改用Cookie管理库提前注入Cookie，确保域名和路径匹配：

import CookieManager from '@react-native-cookies/cookies';

// 在加载WebView前执行（比如useEffect中）
const setupCookies = async () => {
  // 拆分Cookie字符串为键值对（如果你的cookie是拼接好的字符串）
  const cookiePairs = cookie.split('; ');
  for (const pair of cookiePairs) {
    const [name, value] = pair.split('=');
    await CookieManager.set({
      name,
      value,
      domain: new URL(url).hostname, // 自动获取目标域名
      path: '/',
      secure: url.startsWith('https://'),
    });
  }
};

useEffect(() => {
  setupCookies();
}, [url, cookie]);

// WebView组件移除source.headers中的cookie配置
<WebView
  incognito={false}
  javaScriptEnabled={true}
  thirdPartyCookiesEnabled={true}
  sharedCookiesEnabled={true}
  source={{ uri: url }} // 不再传递headers.cookie
  // 其他回调保持不变
/>

3. 验证WebView配置属性的兼容性 #

RN 71对WebView的部分属性做了调整，确保以下属性正确设置：

• thirdPartyCookiesEnabled={true}：安卓端需明确开启第三方Cookie支持
• sharedCookiesEnabled={true}：允许WebView与原生应用共享Cookie
• 确保javaScriptEnabled={true}：页面JS需要读取Cookie的话必须开启

4. 检查Cookie格式与调试 #

• 确认传入的Cookie字符串格式正确：多个Cookie需用; （分号加空格）分隔，比如"uid=123; token=abc"
• 开启WebView调试模式排查：

<WebView
  debuggingEnabled={true} // 开启调试
  // 其他属性
/>

然后通过Chrome浏览器访问chrome://inspect，找到对应的WebView实例，查看Application面板下的Cookie是否存在，判断是Cookie未注入还是页面未读取。

5. 原生层兜底配置（若上述步骤无效） #

如果通过RN层配置仍无法解决，可在安卓原生代码中强制设置Cookie策略：
在android/app/src/main/java/[你的包名]/MainApplication.java中添加：

import android.webkit.WebSettings;
import android.webkit.WebView;
import com.facebook.react.modules.webview.ReactWebViewManager;

@Override
public void onCreate() {
  super.onCreate();
  // 自定义WebView配置
  ReactWebViewManager.setWebViewClientFactory(webView -> {
    WebSettings settings = webView.getSettings();
    settings.setAcceptCookie(true);
    settings.setAcceptThirdPartyCookies(webView, true);
    return new ReactWebViewManager.ReactWebViewClient();
  });
}

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