OLD | NEW |
1 <!-- BEGIN AUTHORED CONTENT --> | |
2 <p id="classSummary"> | 1 <p id="classSummary"> |
3 Use the <code>chrome.storage</code> module | 2 Use the <code>chrome.storage</code> module |
4 to store, retrieve, and track changes to user data. | 3 to store, retrieve, and track changes to user data. |
5 This API has been optimized | 4 This API has been optimized |
6 to meet the specific storage needs of extensions. | 5 to meet the specific storage needs of extensions. |
7 It provides the same storage capabilities as the | 6 It provides the same storage capabilities as the |
8 <a href="https://developer.mozilla.org/en/DOM/Storage#localStorage">localStorage
API</a> | 7 <a href="https://developer.mozilla.org/en/DOM/Storage#localStorage">localStorage
API</a> |
9 with the following key differences: | 8 with the following key differences: |
10 </p> | 9 </p> |
| 10 |
11 <ul> | 11 <ul> |
12 <li>User data can be automatically synced with Chrome sync | 12 <li>User data can be automatically synced with Chrome sync |
13 (using <code>storage.sync</code>).</li> | 13 (using <code>storage.sync</code>).</li> |
14 <li>Your extension's content scripts can directly access user data | 14 <li>Your extension's content scripts can directly access user data |
15 without the need for a background page.</li> | 15 without the need for a background page.</li> |
16 <li>A user's extension settings can be persisted | 16 <li>A user's extension settings can be persisted |
17 even when using | 17 even when using |
18 <a href="manifest.html#incognito">split incognito behavior</a>.</li> | 18 <a href="manifest.html#incognito">split incognito behavior</a>.</li> |
19 <li>User data can be stored as objects | 19 <li>User data can be stored as objects |
20 (the <code>localStorage API</code> stores data in strings).</li> | 20 (the <code>localStorage API</code> stores data in strings).</li> |
| 21 <li>Domain policies configured by the administrator for the extension |
| 22 can be read (using <code>storage.managed</code>).</li> |
21 </ul> | 23 </ul> |
| 24 |
22 <h2 id="manifest">Manifest</h2> | 25 <h2 id="manifest">Manifest</h2> |
23 <p>You must declare the "storage" permission in the <a | 26 <p>You must declare the "storage" permission in the <a |
24 href="manifest.html">extension manifest</a> | 27 href="manifest.html">extension manifest</a> |
25 to use the storage API. | 28 to use the storage API. |
26 For example:</p> | 29 For example:</p> |
27 <pre>{ | 30 <pre>{ |
28 "name": "My extension", | 31 "name": "My extension", |
29 ... | 32 ... |
30 <b>"permissions": [ | 33 <b>"permissions": [ |
31 "storage" | 34 "storage" |
32 ]</b>, | 35 ]</b>, |
33 ... | 36 ... |
34 }</pre> | 37 }</pre> |
| 38 |
35 <h2 id="using-sync">Usage</h2> | 39 <h2 id="using-sync">Usage</h2> |
| 40 |
36 <p> | 41 <p> |
37 To store user data for your extension, | 42 To store user data for your extension, |
38 you can use either | 43 you can use either |
39 <code>storage.sync</code> or | 44 <code>storage.sync</code> or |
40 <code>storage.local</code>. | 45 <code>storage.local</code>. |
41 When using <code>storage.sync</code>, | 46 When using <code>storage.sync</code>, |
42 the stored data will automatically be synced | 47 the stored data will automatically be synced |
43 to any Chrome browser that the user is logged into, | 48 to any Chrome browser that the user is logged into, |
44 provided the user has sync enabled. | 49 provided the user has sync enabled. |
45 </p> | 50 </p> |
| 51 |
46 <p> | 52 <p> |
47 When Chrome is offline, | 53 When Chrome is offline, |
48 Chrome stores the data locally. | 54 Chrome stores the data locally. |
49 The next time the browser is online, | 55 The next time the browser is online, |
50 Chrome syncs the data. | 56 Chrome syncs the data. |
51 Even if a user disables syncing, | 57 Even if a user disables syncing, |
52 <code>storage.sync</code> will still work. | 58 <code>storage.sync</code> will still work. |
53 In this case, it will behave identically | 59 In this case, it will behave identically |
54 to <code>storage.local</code>. | 60 to <code>storage.local</code>. |
55 </p> | 61 </p> |
| 62 |
56 <p class="warning"> | 63 <p class="warning"> |
57 Confidential user information should not be stored! | 64 Confidential user information should not be stored! |
58 The storage area isn't encrypted. | 65 The storage area isn't encrypted. |
59 </p> | 66 </p> |
| 67 |
| 68 <p> |
| 69 The <code>storage.managed</code> is a read-only |
| 70 storage that contains settings configured by the |
| 71 domain administrator for the extension. Enforcing |
| 72 these settings allows administrators to configure |
| 73 your extension on enterprise deployments. |
| 74 </p> |
| 75 |
60 <h2 id="limits">Storage and throttling limits</h2> | 76 <h2 id="limits">Storage and throttling limits</h2> |
| 77 |
61 <p><code>chrome.storage</code> is not a big truck. | 78 <p><code>chrome.storage</code> is not a big truck. |
62 It's a series of tubes. | 79 It's a series of tubes. |
63 And if you don't understand, | 80 And if you don't understand, |
64 those tubes can be filled, | 81 those tubes can be filled, |
65 and if they are filled | 82 and if they are filled |
66 when you put your message in, | 83 when you put your message in, |
67 it gets in line, | 84 it gets in line, |
68 and it's going to be delayed | 85 and it's going to be delayed |
69 by anyone that puts into that tube | 86 by anyone that puts into that tube |
70 enormous amounts of material. | 87 enormous amounts of material. |
| 88 |
71 <p>For details on the current limits | 89 <p>For details on the current limits |
72 of the storage API, and what happens | 90 of the storage API, and what happens |
73 when those limits are exceeded, please | 91 when those limits are exceeded, please |
74 see the <a href="#apiReference">API reference</a>. | 92 see the <a href="#apiReference">API reference</a>. |
| 93 |
| 94 |
75 <h2 id="examples">Examples</h2> | 95 <h2 id="examples">Examples</h2> |
| 96 |
76 <p> | 97 <p> |
77 The following example checks for | 98 The following example checks for |
78 CSS code saved by a user on a form, | 99 CSS code saved by a user on a form, |
79 and if found, | 100 and if found, |
80 stores it. | 101 stores it. |
81 </p> | 102 </p> |
| 103 |
82 <pre> | 104 <pre> |
83 function saveChanges() { | 105 function saveChanges() { |
84 // Get a value saved in a form. | 106 // Get a value saved in a form. |
85 var theValue = textarea.value; | 107 var theValue = textarea.value; |
86 // Check that there's some code there. | 108 // Check that there's some code there. |
87 if (!theValue) { | 109 if (!theValue) { |
88 message('Error: No value specified'); | 110 message('Error: No value specified'); |
89 return; | 111 return; |
90 } | 112 } |
91 // Save it using the Chrome extension storage API. | 113 // Save it using the Chrome extension storage API. |
92 chrome.storage.sync.set({'value': theValue}, function() { | 114 chrome.storage.sync.set({'value': theValue}, function() { |
93 // Notify that we saved. | 115 // Notify that we saved. |
94 message('Settings saved'); | 116 message('Settings saved'); |
95 }); | 117 }); |
96 } | 118 } |
97 </pre> | 119 </pre> |
| 120 |
98 <p> | 121 <p> |
99 If you're interested in tracking changes made | 122 If you're interested in tracking changes made |
100 to a data object, | 123 to a data object, |
101 you can add a listener | 124 you can add a listener |
102 to its <code>onChanged</code> event. | 125 to its <code>onChanged</code> event. |
103 Whenever anything changes in storage, | 126 Whenever anything changes in storage, |
104 that event fires. | 127 that event fires. |
105 Here's sample code | 128 Here's sample code |
106 to listen for saved changes: | 129 to listen for saved changes: |
107 </p> | 130 </p> |
| 131 |
108 <pre> | 132 <pre> |
109 chrome.storage.onChanged.addListener(function(changes, namespace) { | 133 chrome.storage.onChanged.addListener(function(changes, namespace) { |
110 for (key in changes) { | 134 for (key in changes) { |
111 var storageChange = changes[key]; | 135 var storageChange = changes[key]; |
112 console.log('Storage key "%s" in namespace "%s" changed. ' + | 136 console.log('Storage key "%s" in namespace "%s" changed. ' + |
113 'Old value was "%s", new value is "%s".', | 137 'Old value was "%s", new value is "%s".', |
114 key, | 138 key, |
115 namespace, | 139 namespace, |
116 storageChange.oldValue, | 140 storageChange.oldValue, |
117 storageChange.newValue); | 141 storageChange.newValue); |
118 } | 142 } |
119 }); | 143 }); |
120 </pre> | 144 </pre> |
| 145 |
121 <p> | 146 <p> |
122 You can find examples that use this API on the | 147 You can find examples that use this API on the |
123 <a href="samples.html#sty">Samples page</a>. | 148 <a href="samples.html#sty">Samples page</a>. |
124 </p> | 149 </p> |
125 <!-- END AUTHORED CONTENT --> | |
OLD | NEW |