如何使用 Expo 在 React Native 中设置 cookie？

Question

我很难让 cookie 工作，在服务器端我使用它们通过从 req.cookies 中获取它们来验证用户。

这是我目前在 React Native 中的 Login.js 文件上设置它的方式：

import Cookies from "universal-cookie";

const cookies = new Cookies();
 cookies.set("token", token, {
                expires: 7, // 7 days
                path: "/"
                //,secure: true // If served over HTTPS
   });

当我在此页面上调用 cookies.get("token") 时，这可以正常工作。但是，当我导入、设置 const 并在另一个页面上调用 get 时，令牌不会显示...

另外，当我像这样进行提取时：

fetch("http://192.168.0.115:3000/myTransactions/", {
      credentials: "same-origin",
      method: "POST",
      headers: {
        Accept: "application/json",
        "Content-Type": "application/json"
      }
    })

服务器没有收到任何 cookie。我什至将凭据更改为包含。

我在 Windows 上使用 expo 和我的终端来运行它，而无需使用 android studio 或 xcode。我不确定这是否是一个可能的问题。

任何想法！

谢谢

Answer 1

react-native-keychain 比 cookie 更安全！

第二，你试过AsyncStorage吗？这本质上是内置在“localStorage”中的 React Native。我想这就是你要找的。​​p>

// to set
AsyncStorage.setItem('@app:session', token);

// to get
AsyncStorage.getItem('@app:session').then(token => {
  // use token
});

如果您的设置看起来像这样，您只需将令牌值作为标头发送，您可以以最安全/最方便的任何格式存储此信息。

在本例中，auth 可以是获取的这些选项之一。

localStorage.set('token', 38573875ihdkhai)
createCookie('ppkcookie' 7asdfasdf);

export const userFetchRequest = () => (dispatch, getState) => {
  let {auth} = getState();
  return superagent.get(`${__API_URL__}/user/me`)
    .set('Authorization', `Bearer ${auth}`)
    .then(res => {
      dispatch(userSet(res.body));
      return res;
    });
};

Answer 2

您可以使用 cookie 或将令牌存储在 localStorage 中以供网络应用使用。

但是对于 React Native 应用来说，使用 AsyncStorage 会是更好的解决方案。

关于异步存储：

AsyncStorage 是一个简单的、未加密的、异步的、持久的、 应用程序全局的键值存储系统。应该使用 而不是 LocalStorage。

在 iOS 上，AsyncStorage 由存储小值的本机代码支持 在序列化字典和单独文件中的较大值中。在 Android，AsyncStorage 将根据什么使用 RocksDB 或 SQLite 可用。

另外，AsyncStorage 有非常简单的 API：

const TOKEN = "TOKEN";

// save token
AsyncStorage.setItem(TOKEN, token);

// get token
AsyncStorage.getItem(TOKEN).then(token => {
  // token value could be used
});

如果您担心 AsyncStorage 安全性，您可以通过link 找到更多信息。