Question

我正在尝试使用firebaseui auth为单页Web应用程序创建登录屏幕。我复制了firebaseui的示例代码以创建登录屏幕：

<script src="/__/firebase/init.js"></script>
<script src="https://cdn.firebase.com/libs/firebaseui/3.0.0/firebaseui.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.firebase.com/libs/firebaseui/3.0.0/firebaseui.css" />
  <script type="text/javascript">
  // FirebaseUI config.
  var uiConfig = {
    signInOptions: [
      // Leave the lines as is for the providers you want to offer your users.
      firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      firebase.auth.EmailAuthProvider.PROVIDER_ID
    ]
  };

  // Initialize the FirebaseUI Widget using Firebase.
  var ui = new firebaseui.auth.AuthUI(firebase.auth());
  // The start method will wait until the DOM is loaded.
  ui.start('#firebaseui-auth-container', uiConfig);
</script>

然后我刚插入一个

<div id="firebaseui-auth-container'></div>

加载登录屏幕。常规的firebase内容加载得很好，但是auth屏幕没有。这是我得到的错误：

Uncaught Error: Could not find the FirebaseUI widget element on the page.

我无法在网上任何其他地方找到此错误，我不确定它的含义或出现的原因。我应该怎么做才能加载auth屏幕？

Answer 1

从这里抛出错误：https://github.com/firebase/firebaseui-web/blob/cac4047490ed90b0d3d741d6deb8b28905f5db4b/javascript/widgets/authui.js#L481

似乎无法找到html元素。您是否可以尝试从控制台调用document.querySelector('#firebaseui-auth-container');以确认该页面上是否存在该元素？

Answer 2

您的代码示例：

<div id="firebaseui-auth-container'></div>

包含不一致的引号，其中第一个是双引号，第二个是单引号。我相信您打算将其编码为：

<div id="firebaseui-auth-container"></div>

或

<div id='firebaseui-auth-container'></div>

找不到FirebaseUI小部件错误

2 个答案: