时间戳

首页 > 解决方案 > Firebase 和 VueJS：未捕获（承诺）DOMException：阻止了来源为“http://localhost:3000”的帧

javascript - Firebase 和 VueJS：未捕获（承诺）DOMException：阻止了来源为“http://localhost:3000”的帧

问题描述

我正在关注官方的 firebase auth tutorials，并且我不断收到以下代码的此错误：

const provider = new firebase.auth.GoogleAuthProvider()
      firebase.auth()
        .signInWithPopup(provider)
        .catch((error) => alert(error.message))
        .then((data) => console.log(data.user, data.credential.accessToken))

这是我的控制台错误：

backend.js:12632 Uncaught (in promise) DOMException: Blocked a frame with origin "http://localhost:3000" from accessing a cross-origin frame.

我确实将 localhost 作为身份验证控制台中的白名单域

我也需要添加端口吗？假设这会有所帮助......但任何建议将不胜感激。谢谢你

仅供参考，我正在使用 Nuxt (Vue)

标签： javascriptvuejs2firebase-authenticationnuxt.js

解决方案

我认为这可能是因为为身份验证提供程序signInWithPopup加载了一个<iframe>。

我无法从单独发布的代码中看出，但我猜您可能正在使用 google 或 facebook auth 提供，并且您需要将 localhost 与 auth 提供者一起列入白名单，这是您无法做到的。

如果是这种情况，最简单的方法可能是使用像 ngrok 这样的代理来获取可通过网络访问的临时服务器（唱 https 也可能会有所帮助）

推荐阅读