ローカルストレージ誕生の背景
HTML4時代のCookieのサイズ、形式、保存データ形式の制限により、Webサイトアプリケーションがユーザーの情報の一部をブラウザ側(cè)に保存したい場合、Cookieのみを使用できます。ただし、Cookie のこれらの制限は、Cookie が ID などの識別子などの単純なデータしか保存できないことを意味します。
以下は Cookie の制限です:
ほとんどのブラウザは、最大サイズ 4096 バイトの Cookie をサポートします。
ブラウザは、サイトがユーザーのコンピュータに保存できる Cookie の數(shù)も制限します。ほとんどのブラウザでは、サイトごとに 20 個の Cookie しか許可されません。それ以上の Cookie を保存しようとすると、最も古い Cookie が破棄されます。
一部のブラウザでは、すべてのサイトから受け入れる Cookie の総數(shù)に絶対的な制限 (通常は 300) が設(shè)定されています。
デフォルトでは、Cookie は HTTP リクエストとともにバックエンドサーバーに送信されますが、すべてのリクエストに Cookie が必要なわけではありません。たとえば、JS、CSS、畫像などのリクエストには Cookie が必要ありません。
Cookie の一連の制限を打ち破るために、HTML5 は JS の新しい API を通じて大量のデータをクライアント ブラウザに直接保存できるようになり、複雑なローカル データベースをサポートして JS をより効率的にします。 HTML5 は 2 種類の WebStorage をサポートしています:
永続的なローカル ストレージ (localStorage)
セッション レベルのローカル ストレージ (sessionStorage)
localStorage がサポートされているかどうかを検出します:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)</title>
</head>
<body>
<div id="result"></div>
<script>
if(window.localStorage){ alert("瀏覽支持localStorage") }else{ alert("瀏覽暫不支持localStorage") } //或者 if(typeof window.localStorage == 'undefined'){ alert("瀏覽暫不支持localStorage") }
</script>
</body>
</html> 
