【问题标题】:Goole Auth and Facebook Auth problem with firebase and chrome extensionFirebase 和 chrome 扩展的 Goole Auth 和 Facebook Auth 问题
【发布时间】:2020-02-26 00:13:20
【问题描述】:

我正在使用 VueJS 构建一个 Chrome 扩展程序,在这个扩展程序中,我有 3 个按钮来连接用户、Google、Facebook 和电子邮件/密码。第三个系统电子邮件/密码工作得很好,我可以将用户提交到我的数据库,但是当我点击 Facebook 的 Google 按钮时,我的控制台中有一个错误,我不知道这是什么,知道我有遵循 Google 文档建议我们执行的所有步骤来创建这 2 个身份验证弹出窗口(即使在 manifest.json 文件夹中)。

有错误:

code: "auth/unauthorized-domain" 
message: "This chrome extension ID (chrome-extension://myID) is not authorized to run this operation. Add it to the OAuth redirect domains list in the Firebase console -> Auth section -> Sign

这是我的 manifest.json

{
  "name": "extension",
  "description": "VueJS Extension",
  "version": null,
  "manifest_version": 2,
  "icons": {
    "128": "icons/logo.png"
  },
  "browser_action": {
    "default_title": "extension",
    "default_popup": "popup/popup.html"
  },
  "content_security_policy": "script-src 'self' https://apis.google.com; object-src 'self'",
  "background": {
    "scripts": [
      "background.js"
    ]
  },
  "permissions": [
    "identity"
  ],
  "oauth2": {
    "client_id": "myAppID.apps.googleusercontent.com",
    "scopes": [
      "https://apis.google.com"
    ]
  }
}

还有我的signup.vue 组件:

methods: {
    googleSignIn() {
        let provider = new firebase.auth.GoogleAuthProvider();
        console.log(provider);
        fb.auth().signInWithPopup(provider)
            .then(function (result) {
                console.log(result)
                console.log("Account success")
            })
            .then(() => {
                this.$router.push({
                    name: 'main'
                })
            })
            .catch(function (err) {
                console.log(err)
                console.log(("Account failed"))
            })
    },

    facebookSignIn() {
        let provider = new firebase.auth.FacebookAuthProvider();
        console.log(provider);
        fb.auth().signInWithPopup(provider)
            .then(function (result) {
                console.log(result)
                console.log("Account success")
            })
            .then(() => {
                this.$router.push({
                    name: 'main'
                })
            })
            .catch(function (err) {
                console.log(err)
                console.log(("Account failed"))
            })
    }
}

【问题讨论】:

  • 您是否成功使用带有 chrome 扩展的 firebase facebook 登录?我有问题 Facebook 应用程序不能有 chrome-extension:.. 在应用程序域中。

标签: firebase vue.js google-chrome-extension vuejs2 firebase-authentication


【解决方案1】:

您必须在 Firebase 控制台身份验证部分添加您的 chrome 扩展 ID -> 登录方法 -> 授权域

您需要添加您的 chrome 扩展程序 ID。它将具有以下形式: chrome-extension://myID

【讨论】:

  • 是的,我已经添加了我的 chome-extension ID,这很奇怪。
  • @coco_282 你有想过这个吗?
  • 是的,非常感谢!抱歉,我忘了回答迟到的回复;)
  • @coco_282 有关可能解决方案的任何提示。在这里也问过类似的问题,stackoverflow.com/questions/64040133/…
猜你喜欢
  • 2019-02-10
  • 2011-09-01
  • 1970-01-01
  • 2016-10-12
  • 2021-06-11
  • 2017-03-10
  • 2017-07-26
  • 1970-01-01
  • 2018-02-01
相关资源
最近更新 更多