OLD | NEW |
1 <h1>Offline First</h1> | 1 <h1>Offline First</h1> |
2 | 2 |
3 | 3 |
4 <p> | 4 <p> |
5 Because internet connections can be flakey or non-existent, | 5 Because internet connections can be flakey or non-existent, |
6 you need to consider <em>offline first</em>: | 6 you need to consider <em>offline first</em>: |
7 write your app as if it has no internet connection. | 7 write your app as if it has no internet connection. |
8 Once your app works offline, | 8 Once your app works offline, |
9 add whatever network functionality you need | 9 add whatever network functionality you need |
10 for your app to do more when it’s online. | 10 for your app to do more when it’s online. |
(...skipping 117 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
128 </p> | 128 </p> |
129 | 129 |
130 <p> | 130 <p> |
131 Some of the restrictions on Chrome Apps are enforced by the | 131 Some of the restrictions on Chrome Apps are enforced by the |
132 <a href="contentSecurityPolicy">Content Security Policy (CSP)</a> | 132 <a href="contentSecurityPolicy">Content Security Policy (CSP)</a> |
133 which is always the following and cannot be changed for Chrome Apps: | 133 which is always the following and cannot be changed for Chrome Apps: |
134 </p> | 134 </p> |
135 | 135 |
136 <pre> | 136 <pre> |
137 default-src 'self'; | 137 default-src 'self'; |
138 connect-src *; | 138 connect-src * data: blob: filesystem:; |
139 style-src 'self' blob: data: filesystem: 'unsafe-inline'; | 139 style-src 'self' blob: data: filesystem: 'unsafe-inline'; |
140 img-src 'self' blob: data: filesystem:; | 140 img-src 'self' blob: data: filesystem:; |
141 frame-src 'self' blob: data: filesystem:; | 141 frame-src 'self' blob: data: filesystem:; |
142 font-src 'self' blob: data: filesystem:; | 142 font-src 'self' blob: data: filesystem:; |
143 media-src *; | 143 media-src * data: blob: filesystem:; |
144 </pre> | 144 </pre> |
145 | 145 |
146 <h2 id="manifest"> Specifying offline_enabled </h2> | 146 <h2 id="manifest"> Specifying offline_enabled </h2> |
147 | 147 |
148 <p> | 148 <p> |
149 It is assumed that your app behaves well offline. If it doesn't, you should | 149 It is assumed that your app behaves well offline. If it doesn't, you should |
150 advertise that fact, so that its launch icon is dimmed when the user is offline. | 150 advertise that fact, so that its launch icon is dimmed when the user is offline. |
151 To do so, set <code>offline_enabled</code> to <code>false</code> in the | 151 To do so, set <code>offline_enabled</code> to <code>false</code> in the |
152 <a href="manifest">app manifest file</a>: | 152 <a href="manifest">app manifest file</a>: |
153 </p> | 153 </p> |
(...skipping 140 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
294 switching often between online and offline. | 294 switching often between online and offline. |
295 </li> | 295 </li> |
296 </ul> | 296 </ul> |
297 | 297 |
298 <p> | 298 <p> |
299 Also make sure that the app saves <b>no sensitive user data</b> | 299 Also make sure that the app saves <b>no sensitive user data</b> |
300 (such as passwords) on the user's machine. | 300 (such as passwords) on the user's machine. |
301 </p> | 301 </p> |
302 | 302 |
303 <p class="backtotop"><a href="#top">Back to top</a></p> | 303 <p class="backtotop"><a href="#top">Back to top</a></p> |
OLD | NEW |