Wie können Daten mit Ember Data gespeichert, abgerufen und gelöscht werden?

Question

bin ein Neuling, der mit emberJs arbeitet.

Gegenwärtig entwickle ich eine Ember-App, die eine Stufe erreicht hat, um die Offline-Funktion zu implementieren, bei der auf vorherige gespeicherte Daten offline zugegriffen werden muss.

In meiner App-Code finden Sie eines der Vorlagen Ich verwende, templates/bbc.hbs:

{{#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}} 

und für die obige Vorlage finden Sie die entsprechende Route js Datei, Routen/bbc.js

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'); 
} 
}); 

was muss ich wissen, ist:

1) wie die glut Datenfunktion zu implementieren, so dass ich die JSON-Daten mit dieser uRL, während sie online holen konnte und speichern sie in einem Datenspeicher.

2) Abrufen von Daten aus dem Datenspeicher in die Route-js-Datei, wenn der Benutzer diese Route online/offline wechselt.

3) Löschen Sie alle vorherigen Daten für diese Route, wenn sie erneut online ausgewählt wurden, und aktualisieren Sie neue Daten, die über die URL empfangen wurden, die JSON-Daten empfängt. Und wenn Offline diesen Schritt überspringen.

Ich habe bereits den Service-Mitarbeiter mit Brokkoli-Servicearbeiter in dieser App implementiert, um die Offline-Funktion zu implementieren.

Da ich keine Möglichkeit gefunden habe, die Daten zu speichern, auf die im Offline-Zugriff zugegriffen werden könnte, wie die Verwendung der IndexedDB-Funktion, könnten die Glutdaten hilfreich sein.

Während ich meinen Rezensenten nach einer Rezension fragte, schlug er mir persönlich vor, Ember Data mit dem broccoli-serviceworker-Paket zu verwenden, um einen Service-Mitarbeiter mit Zugriff auf die Embers-Datenbibliothek zu konfigurieren.

Wenn es eine bessere Option zum Speichern und Abrufen von Daten gibt, die auch mit Offline-Kompatibilität, ist es willkommen. https://github.com/JEEVANJGA/Capstone-News-App

Answer 1

einfach wickeln Sie Ihre Ember $ mit RSVP erhalten:

Bitte eine Lösung mit Schritt geben für Schritt Anweisungen, die dieses Problem

Github Repo-Link zu meinem Projekt folgen muss zu lösen... Versprechen und verwenden localstorage für das Caching:

1. Try-Feed
2. zu bekommen Wenn Anfrage erfolgreich ist, speichern Daten in den lokalen Speicher und lösen Versprechen
3. Wenn die Anfrage fehlgeschlagen ist, bedeutet dies kein Internet, Daten aus dem lokalen Speicher abrufen und Versprechen erfüllen. Optional: Legen Sie das Zeitlimit fest, um das Modell in einer Minute zu aktualisieren.

Im Hinblick auf die oben @Gennady Dogaev Anweisungen, geändert @JEEVAN GEORGE ANTONY die Routen/bbc.js in der Frage Datei wie folgt:

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; 
    }); 
    } 
    }); 

Diese die Offline accessiblity von Daten lösen mit ember, der localstorage verwendet, auch ohne ember-daten, pouchDB oder indexedDB features zu verwenden.