我创建了一个基于聚合物的入门工具包一个火力地堡项目,并做了一些修改,以解决路由,但在登录弹出立即关闭并记录一个错误:
敲定术前弹出已关闭用户。
的_authenticate
功能(在下面的代码)被调用以对用户进行认证。 我能够正确设置它无论在Facebook和谷歌的控制台,所以我不知道什么是错误表示。
这里是我的代码:
<dom-module id="my-app"> <template> !-- Firebase Setup --> <firebase-app auth-domain="foodhop-manage.firebaseapp.com" database-url="https://foodhop-manage.firebaseio.com" api-key="AIzaSyA-1TEbd1EhlkPwjGBLNS74h3c5FNCHNo0"></firebase-app> <!-- Firebase Authentication --> <firebase-auth id="auth" user="{{user}}" signed-in="{{signedIn}}" on-error="handleError"></firebase-auth> <!-- App Routing --> <app-location route="{{route}}"></app-location> <app-route route="{{route}}" pattern="/:page" data="{{routeData}}" tail="{{subroute}}"></app-route> <!-- Scroll Position Control --> <app-scrollpos-control id="scrollpos" selected="[[page]]" reset></app-scrollpos-control> <!-- Application --> <app-header-layout> <app-header condenses reveals shadow> <app-toolbar> <div main-title style="text-align:center;font-size:40px;padding-top:20px" class="font-beautify">FoodHop</div> </app-toolbar> <app-toolbar sticky> <div class="flex"></div> <paper-tabs selected="[[page]]" attr-for-selected="name" class="self-end"> <paper-tab link name="about"> <a href="/about" class="link" tabindex="-1">About</a> </paper-tab> <paper-tab link name="register" hidden$="[[signedIn]]"> <a href="/register" class="link" tabindex="-1">Register</a> </paper-tab> <paper-tab link name="login"> <a href="/login" class="link" tabindex="-1">Login</a> </paper-tab> </paper-tabs> <div class="flex"></div> </app-toolbar> </app-header> <div> <iron-pages selected="[[page]]" attr-for-selected="name" fallback-selection="404" role="main"> <my-about name="about"></my-about> <my-register name="register"></my-register> <my-login name="login" signed-in="[[signedIn]]" user="[[user]]"></my-login> </iron-pages> </div> <!-- Go to Console --> <!-- <paper-fab icon="input"></paper-fab> --> </app-header-layout> <paper-toast id="toast"></paper-toast> </template> <script> Polymer({ is: 'my-app', properties: { page: { type: String, reflectToAttribute: true, observer: '_pageChanged' }, user: { type: Object, observer: '_userChanged' }, signedIn: { type: Boolean, observer: '_signedInChanged' } }, observers: [ '_routePageChanged(routeData.page)' ], listeners: { 'register': '_register', 'authenticate': '_authenticate', 'logout': '_logout', 'showToast': 'showToast' }, ready: function() { this.$.auth.signOut(); }, toast: function(message) { this.$.toast.text = message; this.$.toast.show(message); }, showToast: function(e) { this.$.toast.show({ text: e.detail.message }); }, _authenticate: function(e) { var provider = e.detail.provider; this.$.auth.signInWithPopup(provider) .then(function(response) { console.log('successful!', response); }).catch(function(error){ console.log('oops!', error); }); }, _userChanged: function(user) { // console.log(user); }, _signedInChanged: function(signIn) { console.log(signIn); if (signIn) { this.page = 'login'; this.set('route.path', '/login'); this.toast('Sweet. Thanks for logging in!'); } else { this.toast('YU NO sign in?'); } }, _logout: function() { this.$.auth.signOut(); }, _register: function() { this.page = 'register'; this.set('route.path', '/register'); }, _routePageChanged: function(page) { this.page = page || 'about'; }, _pageChanged: function(page) { // Load page import on demand. Show 404 page if fails var resolvedPageUrl = this.resolveUrl('my-' + page + '.html'); this.importHref(resolvedPageUrl, null, this._showPage404, true); }, _showPage404: function() { this.page = '404'; }, handleError: function(e) { console.log(e); } }); </script> </dom-module>