Html 如何使用导航器代替 window.webkitStorageInfo HTML5 文件系统 API？

How to use navigator instead of window.webkitStorageInfo HTML5 File-system API?

提问by Arthur Weborg

So there is a similar post found here html-5-filesystem-access-type-error. However, I'm not very satisfied with the conclusion because I do not feel it actually answered the question - the solution given is the deprecated code solution. Does anyone know how to use navigatorinstead of windowas the Chrome console is informing to do?

所以这里有一个类似的帖子html-5-filesystem-access-type-error。但是，我对结论不是很满意，因为我觉得它实际上并没有回答问题——给出的解决方案是弃用的代码解决方案。有谁知道如何使用navigator而不是window像 Chrome 控制台通知的那样使用？

I have been using the following and it works, but the chrome console keeps informing me not to do so because it is deprecated.

我一直在使用以下方法并且它有效，但是 chrome 控制台不断通知我不要这样做，因为它已被弃用。

Working Deprecated Code

工作已弃用的代码

window.webkitStorageInfo.requestQuota(PERSISTENT, 1024*1024*280, function(grantedBytes) {
    window.webkitRequestFileSystem(PERSISTENT, grantedBytes, onInitFs, errorHandler); 
}, function(e) {
    console.log('Error', e); 
});

Note: onInitFsand errorHandlerare both functions defined elsewhere, that work.

注意：onInitFs和errorHandler都是在其他地方定义的函数，可以工作。

Console Log- The message I get in the console is as follows:

控制台日志- 我在控制台中收到的消息如下：

'window.webkitStorageInfo' is deprecated. Please use 'navigator.webkitTemporaryStorage'
or 'navigator.webkitPersistentStorage' instead. 

So the best practice would be to stop using the deprecated method. Unfortunately, when I replace windowwith navigatorit crashes (see below). How does one use navigatorinstead of windowto access the file system?

因此，最佳做法是停止使用已弃用的方法。不幸的是，当我window用navigator它替换时崩溃了（见下文）。如何使用navigator而不是window访问文件系统？

回答by Paul Irish

Below are two examples with the currentAPI.

以下是当前API 的两个示例。

It uses navigator.webkitPersistentStorage.requestQuotainstead of the deprecated window.webkitStorageInfo.queryUsageAndQuota:

它使用navigator.webkitPersistentStorage.requestQuota而不是弃用的window.webkitStorageInfo.queryUsageAndQuota：

Query Quota

查询配额

navigator.webkitTemporaryStorage.queryUsageAndQuota ( 
    function(usedBytes, grantedBytes) {  
        console.log('we are using ', usedBytes, ' of ', grantedBytes, 'bytes');
    }, 
    function(e) { console.log('Error', e);  }
);

Request Quota

申请配额

var requestedBytes = 1024*1024*280; 

navigator.webkitPersistentStorage.requestQuota (
    requestedBytes, function(grantedBytes) {  
        console.log('we were granted ', grantedBytes, 'bytes');

    }, function(e) { console.log('Error', e); }
);

You have to choose either temporary(webkitTemporaryStorage) or persistent(webkitPersistentStorage) storage to query.

您必须选择临时( webkitTemporaryStorage) 或持久( webkitPersistentStorage) 存储进行查询。

The current Chrome implementation tracks this specific spec version, which describes things a bit more: http://www.w3.org/TR/2012/WD-quota-api-20120703/

当前的 Chrome 实现跟踪这个特定的规范版本，它描述了更多的东西：http: //www.w3.org/TR/2012/WD-quota-api-20120703/

chromestore.jsprovides an easier API for this data.

chromestore.js为这些数据提供了一个更简单的 API。

---

---

To answer your original question, your new code would look like this:

要回答您的原始问题，您的新代码将如下所示：

Request quota and initialize filesystem

请求配额并初始化文件系统

var requestedBytes = 1024*1024*280; 

navigator.webkitPersistentStorage.requestQuota (
    requestedBytes, function(grantedBytes) {  
        window.webkitRequestFileSystem(PERSISTENT, grantedBytes, onInitFs, errorHandler); 

    }, function(e) { console.log('Error', e); }
);

回答by dievardump

The error message tells you to use navigator.webkitTemporaryStorageor navigator.webkitPersistentStorageand you try to use navigator.webkitStorageInfowhich is undefined.

错误消息告诉您使用navigator.webkitTemporaryStorageornavigator.webkitPersistentStorage并且您尝试使用navigator.webkitStorageInfowhich is undefined。

UPDATE: PERSISTENT should not be passed to navigator.webkitTemporaryStorageor navigator.webkitPersistentStoragebut only to window.webkitRequestFileSystem. Then there is no more error. (see: Filesystem API not working in Chrome v27 & v29)

更新：PERSISTENT 不应传递给navigator.webkitTemporaryStorage或navigator.webkitPersistentStorage只传递给window.webkitRequestFileSystem. 然后就没有错误了。（请参阅：文件系统 API 在 Chrome v27 和 v29 中不起作用）

回答by Ari

Recently, i've spent some time creating an abstraction layer for the Filesystem API with Persistent Storage called Chromestore.js. I've fixed this error in the abstraction layer by using the same solution talked about here. But with this API, there's no need to worry about it and it's clean.

最近，我花了一些时间为带有持久存储的文件系统 API 创建一个抽象层，称为 Chromestore.js。我已经使用这里讨论的相同解决方案在抽象层中修复了这个错误。但是有了这个 API，就不用担心了，而且很干净。

https://github.com/summera/chromestore.js

https://github.com/summera/chromestore.js

It provides some additional functionality that is pretty handy as well. It definitely needs to be expanded upon, which I plan on doing soon. Any suggestions/feedback is much appreciated! This should make it easier for those using the FileSystem API. Especially for those trying to store large amounts of data retrieved from remote servers.

它提供了一些非常方便的附加功能。它肯定需要扩展，我计划很快做。非常感谢任何建议/反馈！这应该使使用 FileSystem API 的人更容易。特别是对于那些试图存储从远程服务器检索到的大量数据的人。

Examples and documentation are here: https://github.com/summera/chromestore.js/blob/master/chromestore-api.md

示例和文档在这里：https: //github.com/summera/chromestore.js/blob/master/chromestore-api.md

I think this has the potential to be expanded and do some really neat things with data and the Filesystem API.

我认为这有可能得到扩展，并使用数据和文件系统 API 做一些非常巧妙的事情。

Cheers!

干杯!