Форум

devote · #1 (**permalink**) 11.06.2012, 07:53

Привет всем, слепил тут lacalStorage для ишака 7, но и в 6-ом тоже думаю будет работать. Без какого либо использования кукисов!!!
вот тут пример: http://storage.spb-piksel.ru/

<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8 />
        <title>:)</title>
		<script type="text/javascript" src="https://raw.github.com/devote/localstorage/master/storage.min.js"></script>

		<script type="text/javascript">
			function saveData() {
				var storageKey = document.getElementById( 'storageKey' ),
					storageValue = document.getElementById( 'storageValue' );

				if ( storageKey.value ) {
					localStorage.setItem( storageKey.value, storageValue.value );
					alert( "Data successfully stored" );
				} else {
					alert( "Please enter storage KEY item" );
				}
			}

			function loadData() {
				var storageKey = document.getElementById( 'storageKey' ),
					storageValue = document.getElementById( 'storageValue' );

				if ( storageKey.value ) {
					storageValue.value = localStorage.getItem( storageKey.value );
					alert( 'Data successfully loaded: "' + storageKey.value + ': ' + storageValue.value + '"' );
				} else {
					alert( "Please enter storage KEY item" );
				}
			}

			window.onload = function() {

				loadData();

				window.onstorage = function( e ) {

					var params = ["key","oldValue","newValue","url","storageArea"];

					var k, s = "";
					while( k = params.shift() ) {
						s += "<b>" + k + "</b>: " + e[ k ] + "<br/>";
					}
					var div = document.createElement('div');
					div.innerHTML = s;
					document.body.appendChild( div );
				}
			}
		</script>
    </head>
    <body>
		Enter KEY for store storage: <input id="storageKey" type="text" value="testKey" /><br />
		Enter Value for current KEY: <input id="storageValue" type="text" value="" /><br />
		<button onclick="saveData();">Store entered data</button>
		<button onclick="loadData();">Load from storage</button>
		<button onclick="localStorage.clear();">Clear storage</button>
    </body>
</html>

Скачать можно на GitHub: https://github.com/devote/localstorage

beard · #2 (**permalink**) 11.06.2012, 12:07

стерто

devote · #3 (**permalink**) 11.06.2012, 13:58

Сообщение от beard

стерто

ты о чем?

Deff · #4 (**permalink**) 11.06.2012, 14:46

devote,

класс - Всё работает при перезагрузки страницы - выключении компа и даж при очистке Кеша

devote · #5 (**permalink**) 11.06.2012, 15:02

тока что обновил версию, баг нашел небольшой... исправил его.

Deff · #6 (**permalink**) 11.06.2012, 15:38

Сообщение от devote

тока что обновил версию

Опробовал

zebra · #7 (**permalink**) 11.06.2012, 18:27

А можно объяснить где оно хранит данные?

beard · #8 (**permalink**) 11.06.2012, 19:24

Сообщение от zebra

А можно объяснить где оно хранит данные?

да, опиши пожалуйста вкратце что происходит и как работает. Чтобы не разгребать. Был бы очень благодарен.

devote · #9 (**permalink**) 11.06.2012, 19:50

Сообщение от zebra

А можно объяснить где оно хранит данные?

хранятся данные у пользователя в компе

Сообщение от beard

да, опиши пожалуйста вкратце что происходит и как работает. Чтобы не разгребать. Был бы очень благодарен.

Особо заумного ничего не происходит, у IE давно существует localStorage но он имеет свои недостатки, которые я попытался обойти в данной реализации.

А недостатки таковы.

У IE существуют behavior'ы которые давно работают начиная с IE5+ и в этих behavior'сах есть тот самый localStorage, но он ограничен тем что записывает и хранит данные не на домен а на текущий путь указанный в адресной строке, тоесть на текущую папку правильнее сказать. Если сохранить данные находясь по адресу http://somesite.com/ то они не будут доступны по адресу http://somesite.com/folder/ то есть в иной папке. Именно эту проблему я и попытался обойти в данной реализации.

Что бы понять подробнее как это работает, в идеале конечно почитать код и понять как, но вкратце я все же скажу что реализация использует iframe и в него загружает главную страницу сайта, блокируя выполнения скриптов, загрузку ресурсов и т.д. То-есть ваша главная страница во фрейме лежит пустая, и имеет лишь небольшую часть javascript кода, который просто сохраняет данные все время в одной и той же папке. От этого и получается нужный нам эффект.

Надеюсь понятно изложил суть.

beard · #10 (**permalink**) 11.06.2012, 19:59

devote, да, понятно, спасибо

интересная тема выходит

как я понимаю эти behavior'ры нельзя никак очистить браузером, или обнулить. Т.е. получается хранилище оn которого пользователь не может избавится как от куков или локалсторадж?

Есть ли идеи как сделать подобное для всех остальных браузеров?

Форум

Справочник

Discord чат

Курсы javascript