Google 在 React 中使用 firebase 登录 chrome 扩展

2024-03-15

使用 Firebase 进行 Google 登录,并使用 React 创建的 Chrome 扩展程序。我已经使用设置了 oauthGoogleConsole并能够使用 chrome 扩展程序成功登录

chrome.identity.getAuthToken({ interactive: true }, function (token) {
if (chrome.runtime.lastError) {
    console.log('It was not possible to get a token programmatically.');
} else if (chrome.runtime.lastError) {
    console.error(chrome.runtime.lastError);
} else if (token) {
    // Authorize Firebase with the OAuth Access Token.
    var credential = firebase.auth.GoogleAuthProvider.credential(null, token);
    firebase.auth().signInWithCredential(credential).catch(function (error) {
        // The OAuth token might have been invalidated. Lets' remove it from cache.
        if (error.code === 'auth/invalid-credential') {
            chrome.identity.removeCachedAuthToken({ token: token }, function () {
                signInWithGoogle();
            });
        }
    });
} else {
    console.error('The OAuth Token was null');
}
});

现在,我想使用react、redux、webext-redux 来构建我的代码......

在firebase的配置中,包括apiKey, databaseUrl , storageBucket and authDomain as chrome-extension://key_name.

在 Firebase 中的 Firebase -> Auth -> SignIn -> Auth Domains 下定义了相同的身份验证域。 扩展抛出错误Uncaught Error: Illegal url for new iframe - https://chrome-extension/:auth/iframe?apiKey=secretKeys尝试使用 Google 登录时。

如果需要更多信息,请告诉我。


移动了chrome.identity代码来自popup.js to background.js维护用户跨浏览器的单点登录。

Popup.js -> background.js -> execute singin with google.

Used webext-redux, redux, redux-thunk, firebase实施Google SignIn with React.

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

Google 在 React 中使用 firebase 登录 chrome 扩展 的相关文章

随机推荐

  • 使用 Objective C 自动布局中的约束来支持 RTL 语言

    我在 iOS 中有一个应用程序 我正在尝试将其本地化为 RTL 语言 显然 布局需要与语言相对应 首先 我尝试使用一个屏幕底部的按钮来更改其订单 以便使用RTL语言语言环境设置打开应用程序 我使用自动布局 并在按钮和视图之间添加了关于屏幕主
  • 如何更改 Vista Home Premium 中任何文件的“修改日期”? [关闭]

    Closed 这个问题是无关 help closed questions 目前不接受答案 在 Windows Vista 中 如何更改任何文件 文本 二进制 的 修改日期 而不进行编辑 我的意思是只改变它的一些属性 在 Win XP 中 如
  • 如何向反应式表单(Angular 2)添加撤消按钮?

    我使用 Angular 2 中提供的反应式表单技术构建了一个表单 该表单有许多不同类型的控件 现在我需要为其添加一个撤消按钮 我已经能够使用以下命令设置基本的撤消按钮click and change事件 当有人单击表单控件时 我会保存以前的
  • data.frame 中列的基于时间的平均(滑动窗口)

    我有一个包含多列的 data frame 其中一列是时间 因此是非递减的 其余列包含在 data frame 的某一行中指定的时间给定的时间记录的观察结果 我想选择一个时间窗口 比如 x 秒 并计算该窗口同一 data frame 中其他一
  • 将 Instagram 图像拉至我的应用程序 [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我正在开发适用于 iPad 的 iOS 应用程序 您可以在其中从卷中导入照片来个性化茶杯 我很想添加 Instagram 这样用户就可以添
  • Python3 + PyGobject + GTK3 和 cx_freeze 缺少 DLL

    当我使用 py python3 pygobject gtk3 应用程序制作 exe 时从 pygobject 站点来看 它缺少一些 DLL 文件 缺少什么文件 我已经手动尝试过需要哪些 DLL 因此 如果这对某人有帮助 the 必须进行编辑
  • 如何将嵌套 Java Collection 中的所有项目展平到单个列表中?

    给定一个复杂的嵌套对象集合 例如 Set
  • WPF 同一系列的多个字体文件

    我有以下字体文件 MyFont Regular tff MyFont Bold tff MyFont Italic tff 我该如何使用它们 我可以做以下事情
  • 显示精灵的另一个实例

    是否可以显示精灵的另一个实例 我想做的是反射动画精灵 到目前为止 我得到的是我的 Sprite 称为 canvas 它内部有使用 AS3 进行动画处理的内容 我想要做的是显示它翻转的副本 在它下面看起来像倒影 我尝试了以下代码 但没有运气
  • 类库(传统便携式)?

    我有一台装有 Microsoft Visual Studio Community 2017 的电脑 版本 15 2 它有一个类库 便携式 的项目模板 另一台版本为 15 3 1 的 PC 有一个类库模板 Legacy Portable PC
  • 请解释如何使用CheckBoxTableCell

    我想了解更多有关如何实际使用或子类化 如果需要 CheckBoxTableCell 的信息 在一种特定情况下 我想使用此类 其中复选框不绑定到基础数据模型属性 假设我有一个名为 选择 的列 其中包含复选框 该列或多或少充当该行的视觉标记 用
  • 亚马逊s3上传多个文件android

    如果有人仍在寻找解决方案 我最终会在代码上使用循环 但我没有找到官方 api 来执行多个文件上传 我有一个 ImageFiles 的 ArrayList 我想将其上传到 Amazon s3 他们的文档提供了以下代码 credentials
  • 通过距离和摩擦力计算速度

    我正在用 Javascript Canvas HTML5 编写一个游戏 我刚刚发现了一个与高等数学相关的大问题 该游戏是平面 2D 游戏 因此您可以从另一个角度看世界 这意味着没有重力 只有摩擦力 CODE var friction 0 9
  • 当没有导航栏时,如何在 EKEventeditViewController 中获得“完成”或“后退”按钮?

    我的 iOS 应用程序中有一个日历事件列表 单击时将在 EKEventViewController 中打开 这是我的代码 void tableView UITableView tableView didSelectRowAtIndexPat
  • 如何在表格行上使用slideDown(或show)函数?

    我正在尝试向表中添加一行并将该行滑入视图中 但是 Slidedown 函数似乎向表行添加了 display block 样式 这会弄乱布局 有什么想法可以解决这个问题吗 这是代码 get some url val1 id function
  • 在 Promise catch 中重新抛出错误

    我在教程中找到了以下代码 promise then function result some code catch function error throw error 我有点困惑 catch 调用有什么作用吗 在我看来 它没有任何效果 因
  • Windows 搜索 sql - 无法访问 System.Search.QueryFocusedSummary

    我正在尝试使用 sql 查询 Windows Search 4 0 该物业 我感兴趣的是 System Search QueryFocusedSummary 我正在尝试从 SystemIndex 读取此属性 我收到 列不存在 错误消息 我能
  • 安装nvm后无法卸载全局npm包

    我发现了与此问题相关的几个线程 但似乎没有一个专门处理我的案例 并且我无法使用我找到的建议来解决 当我跑步时npm uninstall g some package 它只是返回 up to date in 043s 全球一揽子计划仍然存在
  • cakephp 3.x 保存多个实体 - newEntities

    我在保存多条记录方面遇到了最困难的时期 我已经尝试了一百万次 但最终遇到了同样的问题 我的记录没有保存 而且我看不到任何错误 请记住 我是 cakephp 的新手 也是一名新手编码员 我是否遗漏了一些明显且关键的东西 Table this
  • Google 在 React 中使用 firebase 登录 chrome 扩展

    使用 Firebase 进行 Google 登录 并使用 React 创建的 Chrome 扩展程序 我已经使用设置了 oauthGoogleConsole并能够使用 chrome 扩展程序成功登录 chrome identity getA