Archiviazione locale nelle app chrome utilizzando Dart

Question

Quando si tenta di utilizzare la classe Storage in un'app packaged come questa window.localStorage restituisce null. Il codice qui sotto funziona bene quando si lancia in Dartium o Chrome. Perché lo store locale non funziona nelle app del pacchetto? E cosa scrivere per ottenere la seguente funzionalità?

import 'dart:json'; 

void save(List data) { 
    var jsonString = stringify(data); 
    window.localStorage['highscore'] = jsonString; 
} 

List load() { 
    var jsonString = window.localStorage['highscore']; 
    return parse(jsonString); 
} 

Answer 1

Secondo il chrome packaged app API documentation, non è possibile utilizzare window.localStorage ma è possibile utilizzare chrome.storage per ottenere un API con caratteristiche simili (e più).

È inoltre necessario richiedere il permesso di stoccaggio nel vostro manifesto:.

... 
"permissions": [ 
    "storage" 
], 

Date un'occhiata a the chrome pub package che dovrebbe fornire l'accesso a Chrome '* API a Dart (quando si importa nel tuo pubspec Te. re particolarmente interessato a the chrome.storage Dart library

Esempio di utilizzo qui di seguito (utilizzando l'opzione App Chrome Confezionato in Dart Editor nuova applicazione) ...:.

import 'dart:html'; 

import 'package:js/js.dart' as js; 
import 'package:chrome/chrome.dart' as chrome; 


void main() { 
    print("Starting..."); 
    query("button").onClick.listen(onClick); 
} 


onClick(e) { 
    document.body.append(new Element.html("<p>Clicked...</p>")); 
    // save the highscore 123 
    chrome.storage.local.set({'highscore':'123'}).then((storageArea) { 

    // load the highscore 
    chrome.storage.local.get(['highscore']).then((Map<String,String> vals) { 
     var highscore = vals['highscore']; 
     document.body.append(new Element.html("<p>$highscore</p>")); 
    }); 

    }); 
} 

con HTML che assomiglia a questo:

...snip 
<button>Click Me</button> 
<script src="storage.dart" type="application/dart"></script> 

<script src="packages/browser/dart.js"></script> 
<script src="packages/browser/interop.js"></script> 
<script src="packages/js/dart_interop.js"></script> 
... 

e un manifesto che assomiglia a questo:

{ 
    "name": "StorageExample", 
    "version": "1", 

    "manifest_version": 2, 

    "icons": {"128": "dart_icon.png"}, 

    "permissions" : [ 
    "storage" 
    ], 

    "app": { 
    "background": { 
     "scripts": ["background.js"] 
    } 
    } 
} 

havn't provato in Dartium, ma la conversione in JS e carico come un app confezionato in Chrome v28 funziona bene.