Сохранение переменной Javascript для дальнейшего использования?
Мне было интересно, есть ли способ сохранить одну или несколько переменных JavaScript на локальном компьютере, а затем вызвать их позже?
var a = b
и затем, когда вы возвращаетесь на веб-страницу, она запоминает значение, которое было B?
4 ответа
То, что вы ищете, вероятно, как сделать и использовать куки.
Cookie - это переменная, которая хранится на компьютере посетителя. Каждый раз, когда один и тот же компьютер запрашивает страницу в браузере, он также отправляет cookie. С помощью JavaScript вы можете создавать и получать значения файлов cookie.
Если вы имеете в виду в веб-браузере, есть два варианта:
Веб-хранилище (в вашем случае, в частности, "локальное хранилище", а не "хранилище сеансов")
Cookies универсально поддерживаются браузерами, хотя пользователи могут их отключать. API для них в JavaScript действительно очень плохой. Файлы cookie также отправляются на ваш сервер, поэтому они увеличивают размер запросов к вашему серверу, но могут использоваться как на стороне клиента, так и на стороне сервера.
Установить cookie очень просто, но чтение cookie на стороне клиента является проблемой. Посмотрите на странице MDN выше для примеров.
Веб-хранилище поддерживается всеми основными современными браузерами (включая IE8 и выше). API намного лучше, чем куки. Веб-хранилище является чисто клиентской стороной, данные не отправляются на сервер автоматически (вы, конечно, можете отправить их самостоятельно).
Вот пример использования веб-хранилища: Live Copy
<label>Value: <input type="text" id="theValue"></label>
<input type="button" id="setValue" value="Set">
<script>
(function() {
// Use an input to show the current value and let
// the user set a new one
var input = document.getElementById("theValue");
// Reading the value, which was store as "theValue"
if (localStorage && 'theValue' in localStorage) {
input.value = localStorage.theValue;
}
document.getElementById("setValue").onclick = function () {
// Writing the value
localStorage && (localStorage.theValue = input.value);
};
})();
</script>
У вас есть три варианта сохранения состояния, которые вы можете получить позже на другой веб-странице в том же домене:
Сохраните данные в файле cookie, а затем на будущей веб-странице получите данные из файла cookie.
Сохраните данные в локальном хранилище в браузере пользователя, а затем извлеките данные из локального хранилища на будущей веб-странице.
Сохраните данные на стороне сервера каким-либо образом (с помощью post или ajax-вызова), а затем либо попросите сервер вернуть их в следующий вызов страницы, либо запросите их у сервера с помощью ajax-вызова.
Локальное хранилище, вероятно, является лучшим выбором для простого значения данных, хранимых клиентом, которое не имеет причины на стороне сервера находиться в cookie. Вы можете прочитать о локальном хранилище здесь.
// save data value
localStorage.setItem("name", "John");
// retrieve data value
var name = localStorage.getItem("name");
Локальное хранилище поддерживается в IE начиная с IE8. Если вам нужна поддержка в более старых версиях IE, вы можете либо использовать куки-файлы, либо использовать прокладку локального хранилища, включенную в страницу MDN, на которую я ссылался ранее.
Вы можете попробовать локальное хранилище HTML5, используя Modernizr lib.
Пример:
if (Modernizr.localstorage) {
localStorage.setItem("bar", "1");
var foo = localStorage.getItem("bar");
} else {
// local storage unavailable
}