blob: 5fc78d7ba29c5626fbd19057511a14abd470b8e7 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
|
---
title: Window.localStorage
slug: Web/API/Window/localStorage
tags:
- API
- Property
- Read-only
- Reference
- Storage
- Web Storage
- Window
- WindowLocalStorage
- localStorage
translation_of: Web/API/Window/localStorage
---
<p>{{APIRef()}}</p>
<p><code>localStorage</code> プロパティはローカルの {{domxref("Storage")}} オブジェクトにアクセスすることができます。 <code>localStorage</code> は <code><a href="/ja/docs/Web/API/Window.sessionStorage">sessionStorage</a></code> によく似ています。唯一の違いは、<code>localStorage</code> に保存されたデータには保持期間の制限はなく、<code>sessionStorage</code> に保存されたデータはセッションが終わると同時に（ブラウザが閉じられたときに）クリアされてしまうことです。</p>
<p><code>localStorage<font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">または</span></font>sessionStorage</code>に保存されるデータは<strong>そのページのプロトコル固有である</strong>ことに注意する必要があります。</p>
<h2 id="Syntax" name="Syntax">構文</h2>
<pre class="brush: js notranslate">myStorage = localStorage;</pre>
<h3 id="Value" name="Value">値</h3>
<p>現在のオリジンの local storageスペースにアクセスするのに使用できる {{domxref("Storage")}} オブジェクトを返します。</p>
<h3 id="Exceptions" name="Exceptions">例外</h3>
<dl>
<dt><code>SecurityError</code></dt>
<dd>リクエストがポリシーの決定に反している、またはオリジンが<a href="https://developer.mozilla.org/ja/docs/Web/Security/Same-origin_policy#Definition_of_an_origin">妥当な scheme/host/port tuple</a>でない (これは例えば、オリジンが <code>file:</code> や <code>data:</code> スキームを使うときに起こります)。例えば、ユーザーがブラウザー設定で特定オリジンへのデータ永続化のパーミッションを拒否していることもあります。</dd>
</dl>
<h2 id="Example" name="Example">例</h2>
<p>以下のスニペットでは現在のドメインのローカル {{domxref("Storage")}} オブジェクトにアクセスし、{{domxref("Storage.setItem()")}} を利用してデータを追加しています。</p>
<pre class="brush: js notranslate">localStorage.setItem('myCat', 'Tom');</pre>
<p>localStorage 項目の読み込みの文法は以下の通り:</p>
<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> cat <span class="operator token">=</span> localStorage<span class="punctuation token">.</span><span class="function token">getItem</span><span class="punctuation token">(</span><span class="string token">"myCat"</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
<p>localStorage 項目の削除の文法は以下の通り:</p>
<pre class="brush: js line-numbers language-js notranslate"><code class="language-js">localStorage<span class="punctuation token">.</span><span class="function token">removeItem</span><span class="punctuation token">(</span><span class="string token">"myCat"</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
<div class="note">
<p><strong>注</strong>: 詳細な使用例は <a href="/ja/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a> の記事を参照してください。</p>
</div>
<h2 id="Specifications" name="Specifications">仕様</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">仕様書</th>
<th scope="col">策定状況</th>
<th scope="col">コメント</th>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG', 'webstorage.html#dom-localstorage', 'localStorage')}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザ実装状況</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>機能</th>
<th>Chrome</th>
<th>Edge</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>localStorage</td>
<td>4</td>
<td>{{CompatVersionUnknown}}</td>
<td>3.5</td>
<td>8</td>
<td>10.50</td>
<td>4</td>
</tr>
<tr>
<td>sessionStorage</td>
<td>5</td>
<td>{{CompatVersionUnknown}}</td>
<td>2</td>
<td>8</td>
<td>10.50</td>
<td>4</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>機能</th>
<th>Android</th>
<th>Edge</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Phone</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>基本サポート</td>
<td>2.1</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{ CompatUnknown }}</td>
<td>8</td>
<td>11</td>
<td>iOS 3.2</td>
</tr>
</tbody>
</table>
</div>
<p>すべてのブラウザは <code>localStorage</code> と {{domxref("sessionStorage")}} に対する容量変更ができるようになっています。<a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">詳しくはこちらを参照してください。</a></p>
<div class="note">
<p><strong>注:</strong> iOS 5.1 からは、Safari Mobile は <code>localStorage</code> データをキャッシュフォルダーに保存し、そこは時々 OS の指示で (よくあるのはスペースが少ない場合) 掃除されがちです。Safari Mobile のプライベートブラウジングモードでも、まったく <code>localStorage</code> が使用できません。</p>
</div>
<h2 id="See_also" name="See_also">関連情報</h2>
<ul>
<li><a href="/ja/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li>
<li>{{domxref("LocalStorage")}}</li>
<li>{{domxref("SessionStorage")}}</li>
<li>{{domxref("Window.sessionStorage")}}</li>
</ul>
|
