离线应用与客户端存储

离线检测：

 

navigator.onLine: 这个值为ture表示能上网，值为false表示设备离线。

 

online：这是window对象的事件，当从离线变为在线时触发。

 

offline：这是window对象的事件，当从在线变为离线时触发。

 

 

 

Cookie:

 

设置cookie一次只设置一个。如果删除cookie，只要将相对应的cookie的失效时间设为以前的日期就可以了。每个域的cookie的总数是有限的(50条或者20条或者30条，具体看浏览器，大小也有限制，一般都是每个域大约4096B)

 

cookie的构成

 

名称：cookie的名称。名称是不区分大小写的。必须被URL编码过。

 

值：存储在cookie中的字符串值。必须被URL编码过。

 

域：指定对哪个域是有效的，如果在设置cookie时想要设置域可以在后面加上; domain=*

 

路径：对于指定域中的那个路径。如果在设置cookie时想要设置路径可以在后面加上

; path=*

 

失效时间：表示cookie应该何时被删除的时间。这个值需要时GMT格式的日期。可以直接调用Date实例的toGMTString()方法得到GMT格式的日期。如果设置的失效时间时一个以前的日期，则cookie会被立即删除。如果没设置时间，浏览器会在会话结束时删除cookie。如果在设置cookie时想要设置失效时间可以在后面加上; expires=*

 

安全标志：指定后，cookie只有在使用SSL连接的时候才发送到服务器。也就是只能发送给使用的协议是https的服务器。如果在设置cookie时想要设置安全标志可以在后面加上; secure

 

 

 

 

Storage类型：

 

Storage只是一个类型，不能使用，只能使用它的实例。实例在window对象下(分别是sessionStorage和localStorage)，也不能用这个类型新建实例。提供最大的存储空间来存储名值对(每个域存储空间2.5M或者5M，具体还是看浏览器)。Storage的实例与其它对象类似，有如下方法和属性。

 

clear()：删除所有值。

 

getItem(名称)：根据指定的名称获取值。

 

key(index): 获取index处值的名字。

 

removeItem(name): 删除指定的名值对。

 

setItem(名称, 值)：为指定的名称设置一个值。

 

length: 返回当前页面的Storage相对应实例存储了多少条名值对。

 

具体数据的操作可以用getItem，removeItem，setItem但是，也可以直接用对象的点来访问和操作，比如setItem，可以直接这样子操作，storage.name = storage。

 

 

 

sessionStorage对象:

 

这个对象只能将当前页面的数据保存到浏览器关闭。因为这个对象是Storage的实例，所以所有Storage的方法和属性，它都有。可以用for-in循环来迭代sessionStorage中的值，但是内置属性和方法也会返回，要使用hasOwnProperty方法作出判断。

 

 

localStorage对象：

 

这个对象能将当前页面的数据一直保存，除非用javascript删除或者用户清除浏览器缓存。因为这个对象是Storage的实例，所以所有Storage的方法和属性，它都有。可以用for-in循环来迭代sessionStorage中的值，但是内置属性和方法也会返回，要使用hasOwnProperty方法作出判断。

 

 

 

 

 

数据库：

 

数据库也有大小限制(每个域存储空间5M或者50M，只有Firefox上限是50M，具体还是看浏览器)需要通过全局的indexedDB对象的open(传入相对应的数据库名称, 版本号)方法取到IDBrequest对象，然后在IDBrequest对象success或者upgradeneeded事件里通过事件对象event.target.result或者IDBrequest.result来取得可以操作数据库的对象(IDBrequest对象的实例，以下简称DB)

IDBrequest有以下几个事件：

 

success：当连接数据库成功时触发，可以在这个回调里通过DB的transaction(对象存储空间名称, ‘readwrite’) 取得相对应的对象然后通过objectStore(对象存储空间名称)取得对象存储空间，增加、修改、删除、获取数据。

 

error：当连接失败时触发。

 

upgradeneeded：当在更新版本号时触发，可以通过DB的createObjectStore(对象存储空间名称，{keyPath：键})方法增加新的对象存储空间，然后还可以调用新的对象存储空间的createIndex(‘字段名称’，’字段名称’, {unique: 是否唯一})来创建索引。然后就可以通过createObjectStore()方法返回的对象存储空间的add(数据)方法来增加新的数据。

 

 

versionchange：当同一个源别的标签在修改版本号时会调用这个事件，应该在这个事件里调用DB.close。

 

blocked: 当你想要更新数据库版本的时候，但另一个标签已经打开数据库的情况下，就会触发这个事件处理程序。此时最好先通知用户关闭其它标签页，然后再重新修改版本号。

 

 

 

 

数据库有以下几个方法：

 

transaction(对象存储空间名称, 取得对象存储空间可以操作的模式) ：创建事务，第一个参数可以是包含多个名称的字符串数组，第二个参数可以是readwrite，不传的话那就是只读。事务对象有以下事件与方法：

 

error: 在通过事务对象取得的对象存储空间操作失败时触发。

 

complete：在通过事务对象取得对象存储空间操作成功时触发，在get时这里的事件对象取不到返回的数据，只能在相应的请求的success事件处理程序中才能访问到数据。

 

 

objectStore(对象存储空间名称)：创建事务对象以后还要通过这个事务对象的这个方法才能取得对象存储空间。取得的对象存储空间有这么几个方法和属性：

 

add(数据)：增加数据，当keyPath的字段相同时会报错。在调用这个方法后会返回一个对象，通过这个对象的error和success监听事件，可以监听是否添加成功。

 

put(数据)：增加数据，当keyPath的字段相同时会修改对应数据。在调用这个方法后会返回一个对象，通过这个对象的error和success监听事件，可以监听是否添加成功。

 

get(对象的键)：返回对应键(也就是设了keyPath的字段的值)的对象。在调用这个方法后会返回一个对象，通过这个对象的error和success监听事件，可以监听是否添加成功。在success事件中的事件对象event.target.result可以取得相对应键的对象。

 

delete(对象的键)：删除对应键(也就是设了keyPath的字段的值)的对象。在调用这个方法后会返回一个对象，通过这个对象的error和success监听事件，可以监听是否添加成功。

 

clear(): 删除所有对象。在调用这个方法后会返回一个对象，通过这个对象的error和success监听事件，可以监听是否添加成功。

 

createIndex(‘索引的名字’，’索引的属性的名字’, {unique: 是否唯一}): 调用对象存储空间的这个方法创建索引，返回的是IDBIndex的实例，这个方法只能在更新版本号时才能调用。

 

createObjectStore(对象存储空间名称，{keyPath：键})：这个方法增加新的对象存储空间，只能在更新版本号时才能调用。

 

indexNames：对象存储对象的这个属性，可以访问到为该空间建立的所有索引。

 

游标 (也是属于对象存储空间的方法)：

 

openCursor(可选键范围)：通过这个方法创建游标。调用这个方法会返回一个请求对象，所以必须为该对象指定onsuccess和onerror事件处理程序。当在处理成功时调用onsuccess事件处理程序时，可以通过event.target.result取得存储空间中的下一个对象。在结果有下一项时，这个属性中保存一个IDBCursor的实例，在没有下一项时，这个属性的值为null。IDBCursor的实例有以下几个属性：

 

direction: 表示游标移动的方向。

 

key：对象的键。

 

value：实际的对象。

 

primaryKey：游标使用的键。可能是对象键也可能是索引值。

 

 

IDBCursor的实例还有以下几个方法：

 

update(新数据)：用指定的对象更新当前游标的value，前提是当前事务需要有修改对象存储空间的权限。与其他操作一样，调用这个方法也会创建一个新的请求，因此如果想知道结果。就要为它指定onsuccess和onerror事件处理程序。

 

delete()：删除当前游标。前提是当前事务需要有修改对象存储空间的权限。

 

continue(key)：移动到结果集的下一项。参数key是可选的，指定了这个参数会移动到指定键的位置。用这个方法会导致游标使用相同的请求，也就是使用openCursor方法指定的onsuccess和onerror事件处理程序(所以会循环)。

 

advance(次数):置光标向前移动其位置的次数。

 

 

 

 

键范围：

 

键范围由IDBKeyRange的实例表示，有四种定义键范围的方法，以下方法都是IDBKeyRange的方法：

 

only(键)：传入你想要取得对象的键，返回相对应的数据。这个方法和直接访问存储空间并调用get()方法一样。

 

lowerBound(开始的键，可选是否包含当前开始键)：返回从传入的第一个键的对象开始，直至最后一个对象的键范围。

 

upperBound(终止的键，可选是否包含当前终止键)：这个返回的键范围可以保证游标从头开始，到传入的第一个键的对象终止。

 

bound(开始的键，终止的键，可选是否包含当前开始键，可选是否包含当前终止键)：返回的键范围可以保证游标从第一个传入的参数的键的对象开始，到第二个传入的键的对象终止。

 

 

获取到键范围以后，传入对象存储空间的openCursor()方法，就可以得到一个符合相应约束条件的游标。

 

 

 

 

 

索引：

 

对于某些数据，可能需要为一个对象存储空间指定多个键。可以设置一个主键，然后给其它的创建索引。

 

createIndex(‘索引的名字’，’索引的属性的名字’, {unique: 是否唯一}): 调用对象存储空间的这个方法创建索引，返回的是IDBIndex的实例，这个方法只能在更新版本号时才能调用。

 

index(索引的名字)：调用对象存储空间的这个方法取得相对应的索引对象。

 

索引有以下几个方法和属性：

 

openCursor(可选键范围)：这个方法创建新的游标，除了将会把索引而非主键保存在event.target.result.key属性中之外，这个游标与在对象存储空间上调用的openCursor()返回的游标完全一样。

 

 

openKeyCursor(可选键范围)：这个方法创建只返回每条记录主键的游标。调用这个方法会返回一个请求对象，所以必须为该对象指定onsuccess和onerror事件处理程序。不会返回event.target.result.value。但是会返回event.target.result.primaryKey，保存的是主键。

 

get(索引键)：从索引中获取对应的对象。调用这个方法会返回一个请求对象，所以必须为该对象指定onsuccess和onerror事件处理程序。具体的结果在event.target.result中。

 

 

getKey(索引键)：从索引中获取对应的主键的值。调用这个方法会返回一个请求对象，所以必须为该对象指定onsuccess和onerror事件处理程序。具体的结果在event.target.result中。

 

 

name: 索引的名字。

 

keyPath：传入createIndex()中的属性路径。

 

objectStore：索引的对象存储空间。

 

unique：表示索引键是否唯一的布尔值。

 

indexNames：对象存储对象的这个属性，可以访问到为该空间建立的所有索引。