20.3. Механизм сохранения userData в IE

В IE версии 5 и ниже поддерживается механизм сохранения данных на стороне клиента, доступный в виде нестандартного свойства behavior элемента документа. Использовать его можно следующим образом:

var memory = document.createElement("div"); // Создать элемент

memory.id = "_memory”;                      // Дать ему имя

memory.style.display = "none";              // He отображать его

memory.style.behavior = "url('#default#userData')"; // Присоединить свойство

document.body.appendChild(memory);          // Добавить в документ

После того как для элемента будет определено поведение «userData», он получает новые методы load() и save(). Вызов метода load() загружает сохраненные данные. Этому методу можно передать строку, напоминающую имя файла и идентифицирующую конкретный пакет хранящихся данных. После загрузки данных пары имя/значение становятся доступны в виде атрибутов элемента, получить которые можно с помощью метода getAttribute(). Чтобы сохранить новые данные, необходимо установить атрибуты вызовом метода setAttribute() и затем вызвать метод save(). Удалить значение можно с помощью методов removeAttribute() и save(). Ниже приводится пример использования элемента memory, инициализированного выше:

memory.load("myStoredData");                // Загрузить сохраненные данные

var name = memory.getAttribute("username"); // Получить элемент данных

if (!name) { // Если он не был определен,

  name = prompt("Как вас зовут?);         // запросить у пользователя

  memory.setAtttribute("username", name); // Установить как атрибут

  memory.save("myStoredData");            // И сохранить до следующего раза

}

По умолчанию данные, сохраняемые с помощью механизма userData, имеют неограниченный срок хранения и сохраняются до тех пор, пока явно не будут удалены. Однако с помощью свойства expires можно определить дату, когда истечет срок хранения данных. Например, в предыдущий фрагмент можно было бы добавить следующие строки, чтобы указать, что срок хранения данных истечет через 100 дней:

var now = (new Date()).getTime();              // Текущее время в миллисекундах

var expires = now + 100 * 24 * 60 * 60 * 1000; // + 100 дней в миллисекундах

expires = new Date(expires).toUTCString();     // Преобразовать в строку

memory.expires = expires;                      // Установить срок хранения

Данные, сохраняемые с помощью механизма userData в IE, доступны только для документов, хранящихся в том же каталоге, что и оригинальный документ, сохранивший их. Это более ограниченная область видимости, чем у cookies, которые также доступны документам в подкаталогах оригинального каталога. В механизме userData отсутствует какой-либо эквивалент атрибутов path и domain в cookies, позволяющий расширить область видимости данных.

Механизм userData позволяет сохранять гораздо большие объемы данных, чем cookies, но меньшие, чем объекты localStorage и sessionStorage.

Пример 20.3 реализует методы getltem(), setltem() и removeltem() интерфейса Storage поверх механизма userData в IE. (Он не реализует такие методы, как кеу() и clear(), потому что механизм userData не предоставляет возможность выполнять итерации по всем хранящимся элементам.)

Пример 20.3. Частичная реализация интерфейса Storage на основе механизма userData в IE

function UserDataStorage(maxage) {

  // Создать элемент документа и установить в нем специальное

  // свойство behavior механизма userData, чтобы получить доступ

  // к методам save() и load().

  var memory = document.createElement("div"); // Создать элемент

  memory.style.display = ''none"; // He отображать его

  memory.style.behavior = "url('#default#userData')"; // Присоединить свойство behavior

  document.body.appendChild(memory); // Добавить в документ

  // Если указано значение параметра maxage, хранить данные maxage секунд

  if (maxage) {

    var now = new Date().getTime(); // Текущее время

    var expires = now + maxage * 1000; // maxage секунд от текущего времени

    memory.expires = new Date(expires).toUTCString();

  }

  // Инициализировать хранилище, загрузив сохраненные значения.

  // Значение аргумента выбирается произвольно, но оно должно совпадать

  // со значением, переданным методу save()

  memory.load("UserDataStorage”); // Загрузить сохраненные данные

  this.getltem = function(key) { // Загрузить значения атрибутов

    return memory.getAttribute(key) || null;

  };

  this.setltem = function(key, value) {

    memory.setAttribute(key,value); // Сохранить значения как атрибуты

    memory.save("UserDataStorage"); // Сохранять после любых изменений

  };

  this.removeltem = function(key) {

    memory.removeAttribute(key); // Удалить сохраненные значения

    memory.save("UserDataStorage"); // Сохранить новое состояние

  };

}

Поскольку программный код из примера 20.3 будет работать только в IE, можно воспользоваться условными комментариями IE, чтобы предотвратить его загрузку в броузерах, отличных от IE:

<!—[if IЕ]>

  <script src="UserDataStorage.js"></script>

<![endif]-->