OStack程序员社区-中国程序员成长平台

标题: ios - Google 身份验证后的 React-Native 网络请求未携带身份验证 cookie [打印本页]

作者: 菜鸟教程小白    时间: 2022-12-12 19:30
标题: ios - Google 身份验证后的 React-Native 网络请求未携带身份验证 cookie

我正在将我的 iOS 应用从 Cordova 迁移到 React-Native。我有一个 App Engine 后端并在应用程序中使用 Google 身份验证。使用cordova,用户只需使用webview登录他们的谷歌账户,这将删除一个cookie,然后他们可以访问他们的数据,如下所示:

function getSomeResource(callback_method)
{
     $.ajax({ 
    type: "GET",
    url: 'https://myapp.appspot.com' + '/endpoint',
    dataType: "jsonp",
    cache: true,
    xhrFields: {
      withCredentials: true
    },
    success: function(result) 
        {
            callback_method(result);
        },
    error: function(fail)
      {
         console.log(fail)
      }
    });
}

对于 React-Native,我使用的是 https://github.com/apptailor/react-native-google-signin插入。身份验证的工作原理如下:

  1. 用户使用谷歌链接点击授权
  2. Safari 打开
  3. 用户验证
  4. 返回我的应用

当调用以下函数时

const user = GoogleSignin.currentUser();

提供了一个用户对象。

但是,当使用以下 RN 网络请求时,似乎没有存储任何身份验证 cookie,因此对 App Engine 后端的后续请求无法识别用户已登录

fetch('https://myapp.appspot.com' + '/endpoint', {
  method: 'GET',
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
    'Access-Control-Allow-Credentials' : 'true'
  }
})
.then((response) => response.text())
.then((responseText) => {
  var responseObject = JSON.parse(responseText);
  console.log(responseObject);
});

问题是我是否有任何方法可以获取 cookie(就像我们使用 Cordova 所做的那样),以便我可以使用它来针对 GAE 后端对用户进行身份验证?



Best Answer-推荐答案


正如某人在 Facebook RN group 中所说的那样,您可以使用 react-native-cookie库来处理这个。但是,我真的认为您应该重新考虑使用基于 cookie 的身份验证,并改用基于 token 的身份验证。

基于 Cookie 的身份验证实际上只适用于 Web 应用程序。这对于 Cordova 应用程序来说很好,因为整个应用程序都在 WebView 中,但是,在使用 React Native 时,您需要改变对应用程序的看法。您应该将 RN 应用视为有效的原生应用,用 JS 编写。

GoogleSignin.currentUser() 返回的对象包含一个 serverAuthCode 参数,假设您配置正确 (see the note here)。您可以使用它来获取用户的访问 token 。这是一些未经测试的代码:

function getTokenForUser(user) {
  var formData = new FormData();
  formData.set("grant_type", "authorization_code");
  formData.set("client_id", "{clientId}");
  formData.set("client_secret", "{clientSecret}");
  formData.set("redirect_uri","");
  formData.set("code", user.serverAuthCode);

  return fetch('https://www.googleapis.com/oauth2/v4/token', {
    method: 'OST',
    body: formData,
  }).then((response) => response.json())
}

这将返回一个用 token 对象解析的 promise 。示例:

{
  "expires_in": 3600,
  "token_type": "Bearer",
  "refresh_token": "...",
  "id_token": "...",
  "access_token": "..."
}

然后您可以使用它来发出您需要的请求。

关于ios - Google 身份验证后的 React-Native 网络请求未携带身份验证 cookie,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36790947/






欢迎光临 OStack程序员社区-中国程序员成长平台 (https://ostack.cn/) Powered by Discuz! X3.4