如何在 Polymer 1.0 中实现 firebase-auth 的示例？答案

【问题标题】：An example of how to implement firebase-auth in Polymer 1.0?如何在 Polymer 1.0 中实现 firebase-auth 的示例？
【发布时间】：2015-07-23 07:41:11
【问题描述】：

我对如何实现firebase-auth 元素有点迷茫。任何示例都将不胜感激，我还没有找到任何示例。

谢谢

【问题讨论】：

您可能也想跟踪this Stack Overflow question。 （我支持你，因为我们都处于相同的情况。） =]
我发现 this example 确实对我有用（如果您更改了 firebase url，并将其添加为元素）。我还没有从服务器获取数据，但身份验证过程至少可以工作

标签： firebase polymer

【解决方案1】：

在this question、Glenn Vandeuren 上发布以下内容：

元素

<!--
@license
Copyright (c) 2015 Glenn Vandeuren. All rights reserved.
-->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-button/paper-button.html">

<dom-module id="login-button">

  <style>
    :host {
      display: block;
      box-sizing: border-box;
    }
  </style>

  <template>
    <paper-button raised>Login using <span>[[service]]</span></paper-button>
  </template>

</dom-module>

<script>

  Polymer({

    is: 'login-button',

    properties: {
      service: String
    },

    listeners: {
      'tap': '_handleTap'
    },

    _handleTap: function () {
      this.fire('login', this.service);
    }

  });

</script>

索引

<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
    <title>login-button Demo</title>
    <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
    <link rel="import" href="../login-button.html">
  </head>
  <body>

    <login-button service="google"></login-button>
    <login-button service="twitter"></login-button>

    <script>
      document.addEventListener('login', function(service) {
        // handleLogin();
        alert(service.detail);
      });
    </script>

  </body>
</html>

【讨论】：

关于在使用 provider = custom 时如何实现这一点的任何想法？

【解决方案2】：

我最终通过将 HackITtoday 的 this 示例元素改编为我的 firebase url 来进行身份验证。就像添加元素一样简单：

<hi9-login></hi9-login>

【讨论】：