zoukankan      html  css  js  c++  java
  • 本地存储、离线应用程序

    1、Web Storage                                             
    在Web上存储数据,是针对客户端本地而言的。对HTML4中cookies存储机制的一个改善。
    sessionStorage:用来保存用户从进入网站到浏览器关闭这段时间要保存的数据。
    sessionStorage.setItem(key,value),sessionStorage.getItem(key);
    localStorage:将数据保存在客户端本地的硬件设备中,下次打开浏览器可以继续使用。
    localStorage.setItem(key,value),localStorage.getItem(key). clear()方法。
    2、本地数据库                                                    
    创建访问数据库的对象:
    var db=openDatabase('mydb','1.0','Test DB',2*1024*1024);//数据库名,版本号,描述,大小
    事物:transaction使用回调函数。
    db.transaction(function(tx){
    tx.executeSql('create table if not exists LOGS(id unique,log text)');
    });
    使用executeSql来执行查询:
    transaction.executeSql(sqlquery,[],dataHandler,errorHandler);//
    参数:1-SQL语句(参数用"?"代替,然后这些参数依次放到第二个参数中),
    2-参数数组,
    3-成功后的回调函数:function dataHandler(transaction,result){...}
    4-出错时回调的回调函数:function errorHandler(transaction,errmsg){...}
    结果数据集对象result有一个rows属性,rows.length,rows[index],rows.Item([indexx])等。

    3、离线web应用程序:
    本地缓存。
    本地缓存与浏览器网页缓存的区别:
    manifest文件:
    本地缓存是通过每个页面的manifest文件来管理的。
    在该文件中以清单的形式列举了需要缓存或不需要缓存的资源文件,以及资源文件访问路径。
    可以为每个页面指定一个manifest文件,也可以对整个web应用程序指定一个总的manifest文件。

    需要配置让服务器支持text/cache-manifest这个MIME类型。
    IIS中的MIME映射中添加"manifest"类型"text/cache-manifest"
    为页面指定manifest:<html manifesst="hello.manifest">
    浏览器与服务器的交互过程:
    首次访问网站,在得到一个页面的所有资源后,再处理manifest文件,重新请求需要缓存的资源,进行缓存更新,并触发一个事件通知本地缓存被更新。
    下次访问网站时,先使用本地资源,再请求manifest.
    applicationCache:
    当浏览器对本地缓存进行更新,装入新资源文件时,会触发applicationCache对象的updateready事件,通知本地缓存已被更新。可以在该事件中告诉用户需要手工刷新页面来得到最新版本的应用程序。
    swapCache方法:用来手工执行本地缓存的更新。只能在updateready事件触发时调用。
    事件:浏览器与服务器交互过程中会触发一系列事件。

  • 相关阅读:
    codeforces 1060 B
    codeforces 1060 A
    牛客 国庆七天乐 day1 L
    BZOJ 1087: [SCOI2005]互不侵犯King
    codeforces 792CDivide by Three(两种方法:模拟、动态规划
    codeforces 797C Minimal string
    codeforces 110E Lucky Tree
    codeforces 798D
    2017福建省赛 FZU2272~2283
    Android -- Looper、Handler、MessageQueue等类之间关系的序列图
  • 原文地址:https://www.cnblogs.com/lynn-/p/3451973.html
Copyright © 2011-2022 走看看