在 React Native 中使用 Firebase 进行 Google 登录

2024-01-23

请注意,由于需要解释,问题可能会很长,否则它可能会非常模糊并导致相同的旧答案。

我在创建时遇到问题Google Sign-In页面进入React Native using firebase。基于firebase文档:

随着 3.1.0 SDK 的更新,几乎所有的 JavaScript SDK 功能现在应该可以在 React Native 中顺利运行。但是这里有 一些注意事项:

  • “Headful” auth 方法(例如 signInWithPopup()、signInWithRedirect()、linkWithPopup() 和 linkWithRedirect())不会 使用 React Native(或 Cordova)工作。您仍然可以签名 通过使用在联合提供商中或与联合提供商链接signInWithCredential()使用您选择的提供商提供的 OAuth 令牌。

这意味着我cannot在我的中使用以下代码反应本机项目:

var provider = new firebase.auth.GoogleAuthProvider();

firebase.auth().signInWithPopup(provider).then(function(result) {

  // This gives you a Google Access Token. You can use it to access the Google API.
  var token = result.credential.accessToken;
  // The signed-in user info.
  var user = result.user;
  // ...

}).catch(function(error) {
  // Handle Errors here.
  var errorCode = error.code;
  var errorMessage = error.message;
  // The email of the user's account used.
  var email = error.email;
  // The firebase.auth.AuthCredential type that was used.
  var credential = error.credential;
  // ...
});

然后通过谷歌搜索并搜索了数十个 stackoverflow,我发现了以下使用方法谷歌登录 using Firebase API in 反应本机项目为:

const provider = firebase.auth.GoogleAuthProvider;
const credential = provider.credential(token);

  firebase.auth().signInWithCredential(credential)
    .then((data) => {
      console.log('SUCCESS', data);
    })
    .catch((error) => {
      console.log('ERROR', error)
    });

Now in 就在上面的代码,你可能已经注意到token在以下行中:

const 凭证 = 提供商.凭证(token);

所以基于firebase文档,token得到如下:

// `googleUser` from the onsuccess Google Sign In callback.
var token = googleUser.getAuthResponse().id_token;

所以我的问题是我如何获得它token使用 GoogleUser 对象或它所在的任何对象反应本机?或者还有别的办法吗?


我假设你已经添加了GoogleSignin到你的项目。如果没有,你可以找到一个很好的说明here https://github.com/devfd/react-native-google-signin

Google 提供的回调有一个项目,称为idToken,可用于通过 google 登录您的 firebase。一旦您从以下位置返回了该对象Google Signin, EG

  GoogleSignin.signIn()
        .then((user) => { this.loginWithGoogle(user) });

你可以简单地使用这个user对象的idToken作为凭证,

loginWithGoogle = (user) => {
    var credential = firebase.auth.GoogleAuthProvider.credential(user.idToken);

然后使用该凭据登录 firebase

firebase.auth().signInWithCredential(credential).then(u => {
    //blah blah bleep
}

希望这可以帮助。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 React Native 中使用 Firebase 进行 Google 登录 的相关文章

随机推荐

  • 强制 MigLayout 像 GridBagLayout 一样收缩隐藏对象

    我正在尝试更换GridBagLayout with MigLayout 问题是如果我打电话obj setVisible false 对于某些对象GridBaglayout 布局缩小 但在MigLayout它只是保持隐藏状态 你知道一些方法吗
  • 从 Excel 导入 - 标题不在第 1 行

    我是否缺少一些简单的方法来使用 OleDBConnection 将 Excel 工作表导入数据表并更改标题所在的行 我的连接字符串中有 HDR YES 当标题位于第 1 行但标题实际上需要位于第 3 行时效果很好 我正在使用以下 Comma
  • ggplot 饼图中的标签错误

    我正在尝试为百分比值创建饼图 当我尝试为它们添加标签时 标签是错误的 我的意思是这些值指向图表中的错误位置 ggplot Consumption building type aes x y percentage fill Building
  • 如何对齐 Bootstrap 导航栏中留下的品牌标题和链接?

    我是 Bootstrap 的新手 我一直在努力了解导航栏 我注意到 当浏览器为全 宽屏 宽度时 品牌标题和导航锚点保持在页面的左侧中心 而不是像窗口较小时那样与页面的最左侧对齐 如何使导航栏中的文本紧贴页面左侧 无论浏览器窗口有多宽 我都希
  • async/await 如何在 ASP.Net 应用程序中提供帮助?

    在MVC控制器的action方法中使用async await可以扩展Web应用程序 因为在await时 Asp Net线程池的请求线程被释放 以便它可以为该工作进程处理IIS队列中的其他请求 这意味着 如果我们将工作进程的队列长度限制为 1
  • 如何知道 JUnit 测试触及了哪些类

    以编程方式了解 JUnit 测试涉及哪些类的有效方法是什么 正确的知道 我正在用以下工具来检测我的整个代码JaCoCo http www eclemma org jacoco 获取每行代码的代码覆盖率信息 然后我可以找出使用了哪些类 是否可
  • 我应该如何在类层次结构中链接构造函数?

    我们有以下类层次结构 public class Base public Base do generic initialization public Base SomeClass param1 this init properties tha
  • “额外的间接级别可以解决所有问题”这句话是什么意思? [关闭]

    Closed 这个问题是与编程或软件开发无关 help closed questions 目前不接受答案 计算机科学中的 间接级别解决每个问题 这句话是什么意思 一般来说 这意味着通过提高抽象级别可以使问题更容易理解 解决 不过 要小心你的
  • 隐藏第 n 最大行的 VBA 代码

    Excel 2010 VBA 中是否有任何代码可以用来隐藏第 n 行 例如第 200 行 到最大行 顺便说一句 该表的名称特别是main 通常我会告诉你尝试否决你的问题 但是嘿 今天早上我很懒 所以我只会给你你没有找到的答案 Rows 20
  • 如何从 spring RESTful 服务返回 JSON 并使用 RestTemplate 类访问它

    我制作了一个 Spring RESTful Web 服务 用于以 JSON 格式提供热门歌曲列表 为此 我在列表中添加了歌曲名称 并从 Spring RESTful Web 服务的 Restcontroller 返回了该名称 所以 Rest
  • LinearLayout 的点击监听器永远不会被调用

    尝试让 onclick 侦听器在线性布局上工作 但它从未被调用 已启用可点击和可聚焦 两种模式 但仍然无法让点击侦听器响应 平台详细信息 Android 3 0 有任何帮助吗 下面的代码
  • 使用表单生成器将字段的值显示到 Rails 中的标签中

    我正在使用 Rails 3 2 并且需要使用表单生成器对象显示标签中字段的值 在文本框中显示它很简单 但我无法在标签中做到这一点 代码是这样的 上面的 f 是我的表单生成器 我的模型有一个名为 key name 的字段 第二行工作正常 我将
  • addslashes() 可以安全地防止 HTML 属性中的 XSS 吗?

    我不得不开发一个以前的开发人员留下的旧网络应用程序 它使用addslashes 来防止HTML属性上的XSS 这是一个例子 这是否容易受到 XSS 攻击 有没有什么方法可以让 javascript 在 value 属性中运行 就像在 src
  • 未定义的方法“分页”

    我正在尝试使用 will paginate gem 但出了点问题 我被困住了undefined method paginate 错误 我读了很多问题并尝试了很多事情 这是我所得到的 这是我的 LocationsController rb d
  • 在 pytube 中显示进度

    import pytube def video downloader vid url str input Enter Video URL print Connecting Please wait video pytube YouTube v
  • 在 ASP.NET 中处理数据时如何更新进度消息?

    我有一个流程 它输出逐步消息 即 处理项目 1 项目 2 中的错误等 我希望在整个过程中 而不是最后 将其输出给用户 我很确定我需要使用线程来完成此操作 但找不到合适的示例 这不是线程问题 而是 Web 浏览器 UI 问题 您希望浏览器在您
  • 如何仅对我想要提交的文件运行 Prettier?

    Using Husky https github com typicode husky 我已经设置了我的package json使用预提交挂钩 以便我的 JavaScript 代码使用以下格式进行格式化Prettier https pret
  • 具有模板参数大小的 const char 数组与 char 指针

    今天我在一些代码中看到了以下类型的构造 template
  • std::forward 与 std::move 的用法[重复]

    这个问题在这里已经有答案了 我总是读到std forward仅适用于模板参数 然而 我问自己为什么 请参见以下示例 void ImageView setImage const Image image image image void Ima
  • 在 React Native 中使用 Firebase 进行 Google 登录

    请注意 由于需要解释 问题可能会很长 否则它可能会非常模糊并导致相同的旧答案 我在创建时遇到问题Google Sign In页面进入React Native using firebase 基于firebase文档 随着 3 1 0 SDK