使用DART的Chrome应用程序中的本地存储

Question

当我尝试在类似于window.localStorage的Chrome打包应用程序中使用Storage类时，它返回null。下面的代码在Dartium或Chrome中启动时工作正常。为什么本地存储在Package应用程序中不起作用？我会写什么来获得以下功能？

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

按照chrome packaged app API documentation，则不能使用window.localStorage但你可以使用chrome.storage获得具有类似的功能（及以上）的API。

您还需要请求存储许可在您的清单：。

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

看看the chrome pub package应提供接入铬*在飞镖的API（当您导入它在你的pubspec你”再在the chrome.storage Dart library特别感兴趣

以下（通过使用飞镖编辑器新应用的Chrome封装应用选项）使用的示例...：

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

    }); 
} 

与HTML，看起来像这样：

...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> 
... 

和看起来像这样一个清单：

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

    "manifest_version": 2, 

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

    "permissions" : [ 
    "storage" 
    ], 

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

我没有带在Dartium测试，但转换为JS和加载的打包应用程序到Chrome v28工作正常。