微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

React.js:在 fetch API 上的 Cookies 中设置 session_token,并在另一个 fetch API 上检索 session_token 会导致延迟:

如何解决React.js:在 fetch API 上的 Cookies 中设置 session_token,并在另一个 fetch API 上检索 session_token 会导致延迟:

我使用的登录 API 接受用户名和密码并返回令牌。我正在检索 session_token 并将其设置为用户的 cookie,每当其他用户登录时,我都会这样做:

async function login(username,password) {
        var myHeaders = new Headers();
        var requestOptions = {
          mode: 'cors',method: 'POST',headers: myHeaders,redirect: 'follow'
        };
        
        fetch("http://someAPIthatreturnsatoken",requestOptions)
          .then(response => response.text())
          .then(result => {
            let token = JSON.parse(result);
            let session_token = token.Token;
            Cookies.set("session_token",session_token)})
          .catch(error => console.log('error',error));
    }

对于我制作的登录表单,这个异步函数被称为 onSubmit。如果成功,它会将用户发送到“/帐户”页面。 在此帐户页面中,我需要检索 session_token 并使用 POST 将其再次发送到服务器,该 POST 将检索我的用户信息。所以,我得到了 onSubmit 的令牌,它将用户发送到他的帐户,然后我:

  1. 从 cookie 中检索令牌
  2. 像这样发送到服务器:
let session_token =Cookies.get("session_token");
const getAccountInfo = () =>   {
    var myHeaders = new Headers();
    myHeaders.append("Cookie","session_token="+session_token);
    
    var requestOptions = {
      mode: "cors",method: 'GET',redirect: 'follow'
    };
    fetch("http://someAPIthatusestokentoretrieveinformation",requestOptions)
      .then(response  => response.json())
      .then(result => {
        let accountInfo = JSON.parse(result);
        let fullName = accountInfo.session_data.FirsTNAME +'\t'+ accountInfo.session_data.LASTNAME;
        let email = accountInfo.session_data.EMAIL;
        let phone = accountInfo.session_data.PHONE;
        document.getElementById("account-holder").innerHTML = fullName;
        document.getElementById("account-email").innerHTML = email;
        document.getElementById("account-phone").innerHTML = phone;
      })
      .catch(error => console.log('error',error));
}

一切正常。我发送用户名和密码并获得会话令牌。然后我将它设置为 cookie,然后在 Account() 组件加载时将它发送到另一个 API 以检索用户信息。 但是唯一的问题是,由于这两个函数都是异步的,所以cookie更新需要一定的时间,也就是说如果有不同的session_token,页面会先加载之前的客户信息,然后我刷新的时候,它加载了正确的信息。

如何设置 cookie 以允许我检索 session_token 并在帐户页面上加载信息,而无需刷新它才能显示

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。