2016-08-19 16 views
1

私はFirebaseapp-indexeddb-mirror要素を統合して、ユーザーデータをキャッシュし、オフライン時に配信しようとしています。Firebaseとapp-indexeddb-mirrorの統合が機能しない

私はオフラインであっても、自分のfirebaseデータベース内のすべてのユーザの名前をリストする要素を指定しました。私は、コンソールでApp IndexedDB Client connecting..を取得するアプリをオフラインで実行すると

<link rel="import" href="../bower_components/polymer/polymer.html"> 
<link rel="import" href="../bower_components/polymerfire/polymerfire.html"> 
<link rel="import" href="../bower_components/app-storage/app-indexeddb-mirror/app-indexeddb-mirror.html"> 

<dom-module id="firebase-test"> 
    <template><!--{{{--> 
     <style>/*{{{*/ 
    </style><!--}}}--> 

     <firebase-app 
      name="app" 
      auth-domain="my-app.firebaseapp.com" 
      database-url="https://my-app.firebaseio.com" 
      api-key="my-key"> 
     </firebase-app> 

     <app-indexeddb-mirror 
      key="teste" 
      data="{{firebaseData}}" 
      persisted-data="{{data}}" 
     ></app-indexeddb-mirror> 

     <firebase-query 
      id="query" 
      app-name="app" 
      path="/user" 
      data="{{firebaseData}}"> 
     </firebase-query> 

     <template is="dom-repeat" items="{{data}}"> 
      <h1>{{item.name}}</h1> 
     </template > 

    </template><!--}}}--> 

    <script>//{{{ 
    Polymer({ 
     is: 'firebase-test', 
    }); 
    </script><!--}}}--> 
</dom-module> 

、何が私はapp-network-status-behaviorは、私がオフラインだ時に発見するために失敗していることを疑うことができます。

答えて

0

app-network-status-behaviorを変更しました。私はfirebaseシステムを使って接続状態を確認しています。

<!-- 
@license 
Copyright (c) 2016 The Polymer Project Authors. All rights reserved. 
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 
Code distributed by Google as part of the polymer project is also 
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 
--> 
<link rel="import" href="../polymer/polymer.html"> 
<script> 
    (function() { 
    'use strict'; 

    var networkStatusSubscribers = []; 

    firebase.database().ref('.info/connected') 
    .on('value',function(snap){ 
     for (var i = 0; i < networkStatusSubscribers.length; ++i) { 
     networkStatusSubscribers[i].refreshNetworkStatus(snap.val()) 
     } 
    }) 

    /** 
    * `Polymer.appNetworkStatusBehavior` tracks the status of whether the browser 
    * is online or offline. True if the browser is online, and false if the browser is 
    * offline matching the HTML browser state spec. 
    * 
    * @polymerBehavior 
    */ 
    Polymer.AppNetworkStatusBehavior = { 
     properties: { 
     /** 
     * True if the browser is online, and false if the browser is offline 
     * matching the HTML browser state spec. 
     * 
     * @type {Boolean} 
     */ 
     online: { 
      type: Boolean, 
      readOnly: true, 
      notify: true, 
      value: function() { 
      firebase.database().ref('.info/connected') 
      .once('value',function(snap){ 
       return snap.val() 
      }) 
      } 
     } 
     }, 

     attached: function() { 
     networkStatusSubscribers.push(this); 
     this.refreshNetworkStatus(); 
     }, 

     detached: function() { 
     var index = networkStatusSubscribers.indexOf(this); 
     if (index < 0) { 
      return; 
     } 
     networkStatusSubscribers.splice(index, 1); 
     }, 

     /** 
     * Updates the `online` property to reflect the browser connection status. 
     */ 
     refreshNetworkStatus: function(netStatus) { 
     this._setOnline(netStatus); 
     } 
    }; 
    })(); 
</script> 
関連する問題