Ember Dataを使用してデータを保存、取得、削除する方法は？

Question

emberJsで働いている初心者です。

現在、オフライン時に格納された以前のデータにアクセスする必要があるオフライン機能を実装する段階に達したemberアプリケーションを開発しています。

{{#link-to 'bbc'}}<img src="/assets/images/bbc-news-icon.png" alt="bbc news logo" style="max-width: 150px;min-height:150px;">{{/link-to}} 
{{log model}} 

{{#each model.articles as |item|}} 
<hr> 
<div class="panel panel-primary"> 
<div class="panel-heading"><span class="badge">Title</span> 
<h3>{{item.title}}</h3></div> 
<div class="panel-body"> 
<span class="badge">Description</span> 
{{item.description}} 
</div> 
<div class="panel-footer"><span class="badge">URL to News</span> 
<a href={{item.url}} target="_blank" role="link" aria-label={{item.title}}> {{item.title}} </a> 
</div> 
</div> 

{{/each}} 
{{outlet}} 

と上記テンプレートの

次は、対応するルートのjsファイル、ルート/ bbc.js

です：コード以下の私のアプリで

は、私が使用するテンプレート、テンプレート/ bbc.hbsの一つであります私が知っておくべきこと

import Ember from 'ember'; 

export default Ember.Route.extend({ 
model(){ 
    return Ember.$.get('https://newsapi.org/v1/articles?source=bbc-news&sortBy=top&apiKey=c4ea221e6833496bad7716c6c4fc5ece'); 
} 
}); 

は次のとおりです。

1）私はオンライン中にこのURLからJSONデータを取得し、データ・ストアに保管することができるように燃えさしデータ機能を実装する方法。

2）ユーザーがオンライン/オフライン中にこのルートに移動すると、データストアからデータをルートjsファイルに取得します。

3）オンラインでもう一度選択した場合は、そのルートの以前のデータをすべて削除し、JSONデータを受け取るURLから受け取った新しいデータを更新します。オフラインでこの手順をスキップするだけの場合

私はすでにこのアプリケーションでブロッコリーサービスマンとサービスワーカーを実装してオフライン機能を実装しています。

IndexedDB機能を使用しているように、オフラインでアクセスできるデータを格納する方法が見つからなかったので、Emberデータが役立つと思います。

私は査読者に尋ねられたが、彼はEmber Dataをbroccoli-serviceworkerパッケージと共に使用して、Embersデータライブラリにアクセスできるサービスワーカーを設定するよう個人的に勧めました。

オフラインの互換性を持つデータの保存と取得に関して、より良いオプションがある場合は、その歓迎です。

ているステップバイステップのインストラクションとの溶液を得たようにしてくださいは、私のプロジェクトにこの問題に

のGithubレポのリンクを解決するために従うべき：https://github.com/JEEVANJGA/Capstone-News-Appは

Answer 1

ちょうどあなたのエンバーをラップ$ RSVPを取得します。。。約束とキャッシングのためのlocalStorageを使用します。

1. を要求が成功した場合は、ローカルストレージにデータを保存し、約束
を解決フィード
2. を取得してください
3. リクエストが失敗した場合は、インターネットがないことを意味し、ローカルストレージからデータを取得して約束を解決します。オプション：1分でモデルをリフレッシュするタイムアウトを設定します。 @Gennady Dogaevによって与えられた上記の手順に関して

、@JEEVAN GEORGE ANTONYはルートを変更/ bbc.js問題のファイルを次のよう

import Ember from 'ember'; 

export default Ember.Route.extend({ 
model(){ 
function getJSON(url){ 
    return new Promise(function(resolve, reject){ 
    var xhr = new XMLHttpRequest(); 

    xhr.open('GET', url); 
    xhr.onreadystatechange = handler; 
    xhr.responseType = 'json'; 
    xhr.setRequestHeader('Accept', 'application/json'); 
    xhr.send(); 
    function handler() { 
     if (this.readyState === this.DONE) { 
     if (this.status === 200) { 
      resolve(this.response); 
     } else { 
        reject(new Error('getJSON: `' + url + '` failed with status: [' + this.status + ']')); 
     } 
     } 
    } 
    }); 
} 
return getJSON('https://newsapi.org/v1/articles?source=bbc-news&sortBy=top&apiKey=c4ea221e6833496bad7716c6c4fc5ece').then(function(json) { 
     // on fulfillment 
     var data = JSON.stringify(json); 
     localStorage.setItem('bbcnews', data); 
     return JSON.parse(data); 
    }, function(reason) { 
     // on rejection 
       console.log(reason); 
       var data = JSON.parse(localStorage.getItem('bbcnews')); 
       console.log(data); 
      return data; 
    }); 
    } 
    }); 

これはデータのオフラインアクセス可能性を解決emberはemberデータ、pouchDBまたはindexedDB機能を使用しなくてもlocalstorageを使用します。