Firebase 在使用我的PolymerFire身份验证系统对用户进行身份验证之前，如何限制应用程序页面？

我目前有一个有效的PolymerFire身份验证系统，我可以通过电子邮件和密码登录并创建用户。我的登录和注册页面目前只是我应用程序中的另一个页面

我想采取这些网页，并有他们是唯一的网页访问的用户谁没有登录。登录后，我想隐藏这些身份验证页面，并允许它们使用我应用程序的其余页面

以下是一些相关代码：

my-app.html

<app-location route="{{route}}"></app-location>
<app-route
    route="{{route}}"
    pattern="/:page"
    data="{{routeData}}"
    tail="{{subroute}}"></app-route>

<app-drawer-layout fullbleed force-narrow>
  <!-- Drawer content -->
  <app-drawer align="end" id="drawer" >
    <app-toolbar>Menu</app-toolbar>
    <iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation">
      <a name="home" href="/home" hidden$="{{computeLogoutHidden(statusKnown, user)}}">Home</a>
      <a name="video-gate-builder" href="/video-gate-builder">Video Gate Builder</a>
      <a name="video-survey-builder" href="/video-survey-builder">Video Survey Builder</a>
      <a name="login" href="/login">Login</a>
      <a name="sign-up" href="/sign-up">Sign Up</a>
      More Features Coming Soon!
    </iron-selector>
  </app-drawer>

  <!-- Main content -->
  <app-header-layout has-scrolling-region>

    <app-header condenses reveals effects="waterfall">
      <app-toolbar>
        <img id="logo" src="../images/vidvision-icon-white.png">
        <div main-title>Vidvision</div>
        <span style="flex: 1;"></span>
        <p>{{computeLoginStatus(statusKnown, user)}}</p>
        <paper-icon-button icon="my-icons:menu" drawer-toggle></paper-icon-button>
      </app-toolbar>
    </app-header>

    <iron-pages
        selected="[[page]]"
        attr-for-selected="name"
        fallback-selection="view404"
        role="main">
      <my-home name="home" hidden$="{{computeLogoutHidden(statusKnown, user)}}"></my-home>
      <my-video-gate-builder name="video-gate-builder"></my-video-gate-builder>
      <my-video-survey-builder name="video-survey-builder"></my-video-survey-builder>
      <my-login name="login"></my-login>
      <my-sign-up name="sign-up"></my-sign-up>
      <my-view404 name="view404"></my-view404>
    </iron-pages>
  </app-header-layout>
</app-drawer-layout>

my-login.html

<firebase-auth id="auth" user="{{user}}" status-known="{{statusKnown}}" location="https://vidvission.firebaseio.com" provider="{{provider}}" on-error="errorHandler" on-user-created="userSuccessHandler" on-password-changed="userSuccessHandler" on-password-reset="userSuccessHandler" on-user-removed="userSuccessHandler"></firebase-auth>

<app-location route="{{route}}"></app-location>
<div id="background">
<img id="logo" src="../images/vidvision-icon-white.png">
<div class="card">
  <div id="paddingCont">
    <label class="labels" for="email">Email</label>
    <input class="inputStyles" value="{{email::input}}">
    <label class="labels" for="password">Password</label>
    <input class="inputStyles" type="password" value="{{password::input}}">
    <div class="buttonCont">
      <div class="col-left">
        <button class="login" on-tap="login" hidden$="{{computeLoginHidden(statusKnown, user)}}">LOG IN</button>
        <button class="login" on-tap="logout" hidden$="{{computeLogoutHidden(statusKnown, user)}}">LOG OUT</button>
      </div>
      <div class="col-right">
        <a id="signUp" href="/sign-up">SIGN UP</a>
      </div>
    </div>
  </div>
</div>
<a id="forgotPassword"><p>Forgot Password?</p></a>


<div id="message">[[message]]</div>
<br>
<h3>Login status:</h3>
<p>{{computeLoginStatus(statusKnown, user)}}</p>

<h3>User ID:</h3>
<pre>{{user.uid}}</pre>
</div>

---

我对身份验证系统非常陌生，所以欢迎提供任何建议或资源建议。我发现目前还没有太多关于PolymerFire的信息。谢谢。

元素内部：

添加属性：

signedIn=”“

将其绑定到一个值：

signedIn=“{{isSignedIn}}”

observers: [
    '_routePageChanged(routeData.page)',
    '_userNotSignedIn(isSignedIn)
  ],

添加一个函数

Polymer({
is: 'my-login',
properties: {
  provider: {
    type: String,
    value: 'anonymous'
  },
  message: {
    type: String,
    value: ''
  },
  email: {
    type: String,
    value: ''
  },
  password: {
    type: String,
    value: ''
  },
  user: {
    type: Object,
    value: null
  },
  statusKnown: {
    type: Boolean
  },
},
login: function() {
  this.$.auth.signInWithEmailAndPassword(this.email, this.password);
},
logout: function() {
  this.$.auth.signOut();
},
errorHandler: function(e) {
  this.message = 'Error: ' + e.detail.message;
},
userSuccessHandler: function(e) {
  this.message = e.type + ' success!';
},
computeLoginHidden: function(statusKnown, user) {
  return !statusKnown || !!user;
},
computeLogoutHidden: function(statusKnown, user) {
  return !statusKnown || !user;
},
computeLoginStatus: function(statusKnown, user) {
  if (statusKnown && user) {
    this.set('route.path', '/home');
    return 'Logged in';
  }
  if (statusKnown) {
    return 'Logged out';
  }
  return 'Unknown (checking status...)';
},

<firebase-auth id="auth" user="{{user}}" provider="google" on-
error="handleError" signedIn="{{isSignedIn}}"></firebase-auth>

observers: [
    '_routePageChanged(routeData.page)',
    '_userNotSignedIn(isSignedIn)
  ],

_userNotSignedIn: function (isSignedIn) {
 if (isSignedIn === false) {
   this.page = 'view404'; // redirect the user to another page
                          // import an element that cover the view
 }
}