react native cookie处理

1. 工程环境

Native-android + rn ：原生和rn混合工程

rn-version：0.55.4

android：~

2. cookie验证

参考这篇文章：React Native Cookie使用指南

主要问题点：

1：rn-cookie会自动持久化，接口请求时候自动带上

2：工程cookie同步 - native端的登录态需要共享给rn接口使用 ： cookie同步

• native如何获取cookie ~ 略
• native如何传递cookie给rn ~ 略
• rn如何设置cookie ~ 如下：

2.1. 三方工具

react-native-cookiemanager

native拿到cookie 》 传递给rn 》 rn：CookieManager.setCookie(options)

2.2. 原生设置

上述第三方cookie库，可以看源码：CookieManager，其实是回调到native去处理的。所以，自己手动设置实践是可行的

            List<Cookie> cookieList = cookieJar.loadForRequest(HttpUrl.parse("https://xxx"));
            for (int i = 0; i < cookieList.size(); i++) {
                Cookie cookie = cookieList.get(i);
                Map map = new HashMap();
                map.put("name", cookie.name());
                map.put("value", cookie.value());
                map.put("domain", cookie.domain());
                map.put("path", cookie.path());
                map.put("expiration", String.valueOf(cookie.expiresAt()));
                map.put("origin", Uri.parse("https://xxx").getHost());
                list.add(map);

                //第一种方式，native端直接设置
                CookieManager.getInstance().setCookie(MapUtil.getStringFromMap(map, "origin")
                        , MapUtil.getStringFromMap(map, "name") + "=" + MapUtil.getStringFromMap(map, "value") + ";"
                        + "path" + "=" + MapUtil.getStringFromMap(map, "path") + ";"
                        + "expiration" + "=" + MapUtil.getStringFromMap(map, "expiration") + ";"
                        + "domain" + "=" + MapUtil.getStringFromMap(map, "domain"));
            }

2.3. 使用自己的OkHttpClient

上述两种方式都是需要额外开发的，比较麻烦，涉及几个问题，实现起来比较繁琐：

• native端cookie刷新
• rn端cookie回传

后来发现：fetch用的RCTNetworking，RCTNetworking又是基于OkHttp做的，而且找到有方法自定义OkHttpClient，试着调用我们自己的额RemoteServiceUtil里的创建OkHttpClient的方法给他client这样，cookiejar是单例，可以共用，这样cookie就一套了

参考这篇文章：react-native 0.43 后如何使用自己的OkHttpClient

实践是可行的

实践遇到的问题

com.franmontiel.persistentcookiejar.PersistentCookieJar cannot be cast to com.facebook.react.modules.network.CookieJarContainer

这个是表示原工程里的RemoteServiceUtil提供的OkHttpClient中cookiejar类型与rn所需要的类型不匹配。

因为

PersistentCookieJar implement ClearableCookieJar，而rn需要的是ReactCookieJarContainer implement CookieJarContainer

解决：

1：原工程中cookie持久化用的也是三方库：PersistentCookieJar

2：修改三方库源码：ClearableCookieJar extends CookieJarContainer

3. rn端webview组件cookie相关

• 接口请求
  • 调原生
  • 调rn
• web
  • 基于native-webview封装组件
  • 跳转native-WebViewActivity加载

其他相关资料

个人rn相关专题