javascript存储

In my previous article I was quite excited about starting my first AIR application, called Harpoon, using only HTML, CSS, and JavaScript. One of the features I ran out of time to discuss was the way you can use an XML file to store and retrieve application preferences.

在上一篇文章中，我仅使用HTML，CSS和JavaScript来启动我的第一个AIR应用程序(称为Harpoon)感到非常兴奋。 我没有时间讨论的功能之一是使用XML文件存储和检索应用程序首选项的方式。

If you downloaded and installed Harpoon you may have noticed the Preferences panel with the select list.

如果您下载并安装了Harpoon，则可能会注意到带有选择列表的“首选项”面板。

Here’s the HTML for that field and its label:

这是该字段HTML及其标签：

<label>Refresh every (minutes)</label>
<select id="pref_refresh" name="pref_refresh"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> ... <option value="10">10</option>
</select>

If you recall, Harpoon is destined to be an auction watching application for the Flippa site. Eventually this will control how often Flippa is checked for new auctions matching your query. Of course you’d want Harpoon to remember this setting, so we’ll store the selected value in an XML file.

如果您还记得，鱼叉注定是Flippa网站的拍卖观看应用程序。 最终，这将控制检查Flippa进行与您的查询匹配的新拍卖的频率。 当然，您希望Harpoon记住此设置，因此我们会将所选值存储在XML文件中。

Our task is this:

我们的任务是这样的：

• When Harpoon is opened we check to see if the preferences file is available.打开鱼叉后，我们将检查首选项文件是否可用。
• If unavailable Harpoon should create the file and write the default value.如果不可用，鱼叉应创建该文件并写入默认值。
• If available Harpoon should read it and set the field value.如果可用，鱼叉应该阅读并设置字段值。
• Whenever the field value is changed Harpoon should write the new value to the preferences file.每当字段值更改时，鱼叉都应将新值写入首选项文件。

This sounds way more complicated than it really is. Let’s dive in so I can show you.

这听起来比实际要复杂得多。 让我们潜入，以便我向您展示。

First some adjustments to our Harpoon object. (If you need to prod your memory, take a detour and refer back to my previous article.) We want to store the refresh value, and a couple of other important values within the Harpoon object:

首先，对我们的Harpoon对象进行一些调整。 (如果需要提高记忆力，请绕行并参考我的上一篇文章 。)我们要在Harpoon对象中存储刷新值和其他两个重要值：

var Harpoon = {... prefsFile : null, storePath : null, prefs : { refresh : 10 }
}

I’ll address prefsFile and storePath in a moment, but you can also see the prefs object that has one property called refresh. This is where we’ll store the refresh value, and it’ll be accessible within our application from Harpoon.prefs.refresh.

我将在稍后介绍prefsFile和storePath ，但您还可以看到具有一个称为refresh属性的prefs对象。 这是我们存储刷新值的地方，可以在我们的应用程序中从Harpoon.prefs.refresh进行访问。

Now we come back to the prefsFile and storePath properties. For security reasons each AIR application is given its own storage directory from which it can read and write files. This is where our preferences file will reside. These two properties will store the path to the application storage directory and the path to the preferences file.

现在，我们回到prefsFile和storePath属性。 出于安全原因，每个AIR应用程序都有其自己的存储目录，可以从中读取和写入文件。 这是我们的首选项文件所在的位置。 这两个属性将存储应用程序存储目录的路径和首选项文件的路径。

If you remember from the previous article Harpoon has an init function for initialisation, where we placed that call to the setupWindow function. We’ll add a few lines of code to that:

如果您还记得上一篇文章，Harpoon有一个用于初始化的init函数，我们将该调用放置在setupWindow函数中。 我们将在其中添加几行代码：

init : function() {Harpoon.setupWindow(); Harpoon.storePath = air.File.applicationStorageDirectory; Harpoon.prefsFile = Harpoon.storePath.resolvePath("prefs.xml"); Harpoon.getPrefs(); ...
},

We use the air.File.applicationStorageDirectory to obtain Harpoon’s storage directory. Then we use the resolvePath method to retrieve the path to the preferences file prefs.xml and store it as a File object. The next line, Harpoon.getPrefs(), is a call to a new function we shall write.

我们使用air.File.applicationStorageDirectory获取鱼叉的存储目录。 然后，我们使用resolvePath方法检索首选项文件prefs.xml的路径，并将其存储为File对象。 下一行Harpoon.getPrefs()是对我们将要编写的新函数的调用。

The getPrefs function will retrieve the application preferences from the file if it exists, otherwise it will create a new one. The default preferences file will look like this:

getPrefs函数将从文件中检索应用程序首选项(如果存在)，否则将创建一个新的首选项。 默认首选项文件如下所示：

<?xml version="1.0" encoding="utf-8"?>
<preferences> <refresh>10</refresh>
</preferences>

Here’s the getPrefs function:

这是getPrefs函数：

getPrefs : function() {if (Harpoon.prefsFile.exists) { ... } else { ... }
},

First we check to see if the preferences file exists, using the conveniently named exists property of the File object we stored back in our init function. If it does exist, then we read the contents using a custom function you’ll see in a moment called readXML — basically it takes a file path and returns an XML document:

首先，我们使用方便存储的init函数命名的File对象的exists属性，检查首选项文件是否存在。 如果确实存在，那么我们使用您将在稍后看到的名为readXML的自定义函数读取内容-基本上，它采用文件路径并返回XML文档：

if (Harpoon.prefsFile.exists) {var xml = Harpoon.readXML(Harpoon.prefsFile);

We next find the first refresh element in our XML document using some jQuery selector magic and store its text value as an integer in our Harpoon object:

接下来，我们使用一些jQuery选择器魔术在XML文档中找到第一个refresh元素，并将其文本值作为整数存储在Harpoon对象中：

Harpoon.prefs.refresh = parseInt($(xml).find('refresh:eq(0)').text());

In jQuery :eq(index) is a selector filter that matches the element by its index. In the above code refresh:eq(0) will match the first refresh element.

在jQuery中:eq(index)是一个选择器过滤器，通过其索引匹配该元素。 在上面的代码中， refresh:eq(0)将匹配第一个refresh元素。

The final step in this branch is to set the select field’s value, again using jQuery:

该分支的最后一步是再次使用jQuery设置选择字段的值：

$('#pref_refresh option[value=' + Harpoon.prefs.refresh + ']').attr("selected","selected");

On the other hand, if there’s no preferences file then we want to create one:

另一方面，如果没有首选项文件，那么我们要创建一个：

} else {Harpoon.savePrefs(); }

The savePrefs function is another one of our custom functions:

savePrefs函数是我们的另一个自定义函数：

savePrefs : function() {var cr = air.File.lineEnding; var prefsXML =   '<?xml version="1.0" encoding="utf-8"?>' + cr + '<preferences>' + cr  + '  <refresh>' + Harpoon.prefs.refresh + "</refresh>" + cr + '</preferences>'; Harpoon.writeXML(Harpoon.prefsFile, prefsXML);
},

It’s a simple function that builds a string representing the XML tags, and saves it to the preferences file using the as yet unseen writeXML function. The current value of Harpoon.prefs.refresh is concatenated into the XML string. You may notice the use of air.File.lineEnding in the above function; it’s a property that represents the platform line-ending character which is different on Mac OS X, Windows, and Linux.

这是一个简单的函数，可构建表示XML标签的字符串，并使用尚未出现的writeXML函数将其保存到首选项文件中。 Harpoon.prefs.refresh的当前值被串联到XML字符串中。 您可能会注意到上面函数中使用了air.File.lineEnding ； 它是代表平台行尾字符的属性，在Mac OS X，Windows和Linux上是不同的。

Now to those previously named readXML and writeXML functions. In Adobe AIR, if you want to read and write files in JavaScript you need to use a FileStream object. First, the readXML file creates a new FileStream object and opens the preference file from the File object we pass into it, in read mode. The FileStream is read as a string, stored in the xml variable, and closed:

现在到那些以前命名的readXML和writeXML函数。 在Adobe AIR中，如果要使用JavaScript读写文件，则需要使用FileStream对象。 首先， readXML文件创建一个新的FileStream对象，并以读取方式从传递给它的File对象中打开首选项文件。 FileStream作为字符串读取，存储在xml变量中，并关闭：

readXML : function(path) { var stream = new air.FileStream(); stream.open(path, air.FileMode.READ); var xml = stream.readUTFBytes(stream.bytesAvailable); stream.close();
Next we use a DOMParser object to convert the string into an XML document and return it:The writeXML function also uses a FileStream object, but opens it in write mode. This function takes a File object and the XML source string, and writes the string to the file:

writeXML : function(path, xml) {var stream = new air.FileStream(); stream.open(path, air.FileMode.WRITE); stream.writeUTFBytes(xml); stream.close();
},

Have we forgotten anything? There's still one more task. When the user changes the preference value in the interface we want Harpoon to save that preference. All it takes is a simple event listener:
The above code binds a function to be executed every time the select list value is changed. The function stores the new preference value and calls the savePrefs function. We add this to the setupWindow function we created in the first article.
And there we have it. Reading and writing preferences to an XML file using JavaScript in an Adobe AIR application: easy! The source code can be downloaded as well as the packaged application. Hopefully this has provided enough code for you to go and implement preferences in your own AIR application.

 readXML : function(path) { var stream = new air.FileStream(); stream.open(path, air.FileMode.READ); var xml = stream.readUTFBytes(stream.bytesAvailable); stream.close();
Next we use a DOMParser object to convert the string into an XML document and return it:The writeXML function also uses a FileStream object, but opens it in write mode. This function takes a File object and the XML source string, and writes the string to the file:

writeXML : function(path, xml) {var stream = new air.FileStream(); stream.open(path, air.FileMode.WRITE); stream.writeUTFBytes(xml); stream.close();
},

Have we forgotten anything? There's still one more task. When the user changes the preference value in the interface we want Harpoon to save that preference. All it takes is a simple event listener:
The above code binds a function to be executed every time the select list value is changed. The function stores the new preference value and calls the savePrefs function. We add this to the setupWindow function we created in the first article.
And there we have it. Reading and writing preferences to an XML file using JavaScript in an Adobe AIR application: easy! The source code can be downloaded as well as the packaged application . Hopefully this has provided enough code for you to go and implement preferences in your own AIR application.

翻译自: https://www.sitepoint.com/adobe-air-pref-javascript/

javascript存储