React Native/Expo应用如何在关闭时自动清除登录Cookie？

我正在开发一款Expo/React Native应用，使用fetch和credentials: 'include'实现服务器登录功能，现有代码运行正常：

login = async (email, password) => {
  try {
    var body = JSON.stringify({ email, password });
    const response = await fetch('http://10.0.2.2/login', {
      method: 'POST',
      credentials: 'include',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ username: username, password: password })
    });
    if(response.hasOwnProperty('accessToken')) {
      console.log('login successfull');
      console.log(response);
    } else if(response.hasOwnProperty('error')) {
      console.log('login failed');
      console.log(response)
    }
  } catch(e) {
    console.log('error: ' + e);
  }
};

我的问题是：关闭应用后用户并未自动登出，我不想通过API调用手动登出，是否存在类似React Web中直接清除Chrome Cookie即可完成登出的方法？

嘿，这个问题挺常见的——毕竟React Native和Web的Cookie管理机制差异不小：Web里是浏览器帮我们维护Cookie池，而RN依赖的是原生平台的网络组件（Android的OkHttp、iOS的NSURLSession）来存储Cookie，没法像Chrome那样一键清除，但有几个靠谱的替代方案：

1. Expo环境下用expo-cookies库 #

Expo官方提供了专门处理Cookie的工具库，能直接操作原生Cookie存储，步骤很简单：

首先安装依赖：

npx expo install expo-cookies

然后在需要触发登出的场景（比如应用即将关闭、用户点击退出按钮时）调用清除方法：

import * as Cookies from 'expo-cookies';

// 清除目标域名下的所有Cookie，对应你的登录接口域名
await Cookies.clearAsync('http://10.0.2.2');

这样下次启动应用发起请求时，就不会携带之前的登录Cookie，相当于实现了自动登出。

2. 裸React Native项目用react-native-cookies #

如果你的项目是脱离Expo的裸RN项目，可以用社区维护的react-native-cookies库：

先安装依赖：

npm install react-native-cookies --save
# 或者用yarn
yarn add react-native-cookies

然后调用清除逻辑：

import CookieManager from 'react-native-cookies';

// 清除所有域名的Cookie
await CookieManager.clearAll();

// 或者更精准地只清除目标域名的Cookie
await CookieManager.clear('http://10.0.2.2');

3. 小细节提醒 #

顺便提一句，你的登录代码里有个小疏漏：定义了body变量但没用到，而且body里的username看起来是笔误，应该是传入的email参数吧？修正后更严谨：

body: JSON.stringify({ username: email, password: password })
// 或者如果后端接收的是email字段，直接用{ email, password }

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