javascript 本地数据库存储websql

　　最近我们的APP不太行了，因为是一个有做题，提交题目的功能，之前只是从APP提交错题到服务端，服务端难道答案，校验答案的对错，返回结果集，现在很多用户反映，提交速度很慢，很多时候，都提交不成功，所以领导让我把题目存在本地，校验题目的任务也交给前端来实现，服务端只接受并存储错误的题目，从而减轻服务端的压力，

　　在因为我们的题库量是很大的，而且种类比较多，每年两套题，一套题有100道左右的题目，所以单纯的localstorage并不能满足我们，因此我们选择了使用数据库，最开始，想试试sqllit，但是本身H5的标准里没有推荐，下面这个链接，可以看到dcloud提供的APP离线存储方案，可以选择

                     http://ask.dcloud.net.cn/article/166

　　最终我们使用的websql，再使用websql的时候，遇到了几个坑

　　1.数据库操作是异步的，有的时候很烦，例如我要获取一百道题目之后，对这些题目操作，返回值得方法，我没怎么用我使用的是回调函数传参的方法，感觉用起来一般，有的时候，太复杂的操作，经常会出问题，因为毕竟是函数，闭包你懂得。

　　2.数据库版本号的修改，这个情况确实恶心，我本来以为很简单就可以解决的小垃圾，卡了老子半个下午，最终配合localstorage才解决，神烦的一个机制

　　简单介绍一下：

　　数据库再每次打开的时候，都需要有一个版本号，如果在打开数据库的时候，传入的版本号，和数据本身的版本号不同，那么就会报错，而且报的错贼奇葩

　　　　　　

　　这是当我吧2.0版本的数据库，修改版本为1.0的时候报的错，解决方法：每次打开生成数据库的时候，都从localstorage里面取，当获取到的数据库版本号和本地不同的时候，我们需要，先打开一下数据库，获取到dataBase对象，然后，修改数据库版本，dataBase身上有原生的changeVersion方法，用来修改数据库的版本，然后同步到localstorage，下次数据库再打开的时候，直接从localstorage里面拿最新的；( ^ - ^ )

　　3.在插入数据的时候，不要跳转页面，由于是异步插入的，所以很容易出现插入到一把，跳页面了，结果就是，终止了循环，不插了，所以如果出现了跳转页面和插入数据在同一个函数里面的收，尽量放到跳转之后的页面里面去插入

　　下面贴上我在操作的时候，封装的Js文件( 其实我也是网上找的，自己根据需求修改了一下 )

　　websql.js

/**
*数据库操作辅助类,定义对象、数据操作方法都在这里定义
*/
var dbname='yearstopic';/*数据库名*/
var dbdesc = '历年真题题库'; /*数据库描述*/
var dbsize = 20*1024*1024; /*数据库大小*/
var dataBase = null; /*暂存数据库对象*/
/*数据库中的表单名*/
var websqlTable = "websqlTable";
/**
 * 打开数据库
 * @returns  dataBase:打开成功   null:打开失败
 */
function websqlOpenDB(){
    /*数据库有就打开 没有就创建*/
   var version = window.localStorage.DBversion;
    dataBase = window.openDatabase(dbname, version, dbdesc, dbsize);
    if (dataBase) {
        console.log("数据库创建/打开成功!");
    } else{
        console.log("数据库创建/打开失败！");
    }
    return dataBase;
}
//修改数据库版本
function changeDataBaseVersion(old_version,new_version){
    var db  = websqlOpenDB();
    db.changeVersion(old_version,new_version,null,function(err){},null)
    window.localStorage.DBversion = new_version;
}
/**
 * 新建数据库里面的表单
 * @param tableName:表单名
 */
function websqlCreatTable(tableName){
//  chinaAreaOpenDB();
    var creatTableSQL = 'CREATE TABLE IF  NOT EXISTS '+ tableName+'(ID text,QUESTION text)';
    dataBase.transaction(function (ctx,result) {
        ctx.executeSql(creatTableSQL,[],function(ctx,result){
            console.log("表创建成功 " + tableName);
        },function(tx, error){
            console.log('创建表失败:' + tableName + error.message);
        });
    });
}
//插入数据
function websqlInsterDataToTable(tableName,id,question){
    var question = JSON.stringify(question);
    var insterTableSQL = 'INSERT INTO ' + tableName + ' VALUES (?,?)';
    dataBase.transaction(function (ctx) {
        ctx.executeSql(insterTableSQL,[id,question],function (ctx,result){
            console.log("插入" + tableName + id + "成功");
        },
        function (tx, error) {
            console.log('插入失败: ' + error.message);
        });
    });
}
/**
 * 获取数据库一个表单里面的所有数据
 * @param tableName:表单名
 * 返回数据集合
 */
function websqlGetAllData(tableName,fn){
    var selectALLSQL = 'SELECT * FROM ' + tableName;
    dataBase.transaction(function (ctx) {
        ctx.executeSql(selectALLSQL,[],function (ctx,result){
            console.log('查询成功: ' + tableName +'__'+ result.rows.length);
            var len = result.rows.length;
            var queryDataArray = [];
            for(var i = 0;i < len;i++) {
                    queryDataArray.push(JSON.parse(result.rows.item(i).QUESTION));
            }
            fn(queryDataArray);
        },
        function (tx, error) {
            console.log('查询失败: ' + error.message);
        });
    });
}
//查询所有数据，获取json格式
function websqlGetAllDataJson(tableName,fn){
    var selectALLSQL = 'SELECT * FROM ' + tableName;
    dataBase.transaction(function (ctx) {
        ctx.executeSql(selectALLSQL,[],function (ctx,result){
            console.log('查询成功: ' + tableName +'__'+ result.rows.length);
            var len = result.rows.length;
            var queryDataArray = {};
            for(var i = 0;i < len;i++) {
                var id = result.rows.item(i).ID;
                id = id.replace('.0','');
                queryDataArray[id] = JSON.parse(result.rows.item(i).QUESTION);
            }
            fn(queryDataArray);
        },
        function (tx, error) {
            console.log('查询失败: ' + error.message);
        });
    });
}
/**
 * 获取数据库一个表单里面的部分数据
 * @param tableName:表单名
 * @param name:姓名
 */
function websqlGetAData(tableName,id,fn){
    var selectSQL = 'SELECT * FROM ' + tableName + ' WHERE ID = ?'
    dataBase.transaction(function (ctx) {
        ctx.executeSql(selectSQL,[id+'.0'],function (ctx,result){
            fn && fn(JSON.parse(result.rows.item(0).QUESTION))
        },
        function (tx, error) {
            console.log('查询失败: ' + error.message);
        });
    });
}

function webSqlDeleteTable(tabName){
    dataBase.transaction(function(tx) {
        tx.executeSql('DROP TABLE '+tabName+'');  
        console.log('删除表'+tabName+'成功')
    },
    function(tx,err){
        console.log('删除表'+tabName+'失败')
    })
}
/**
 * 删除表单里的全部数据
 * @param tableName:表单名
 */
function websqlDeleteAllDataFromTable(tableName){
    var deleteTableSQL = 'DELETE FROM ' + tableName;
    localStorage.removeItem(tableName);
    dataBase.transaction(function (ctx,result) {
        ctx.executeSql(deleteTableSQL,[],function(ctx,result){
            console.log("删除表成功 " + tableName);
        },function(tx, error){ 
            console.log('删除表失败:' + tableName + error.message);
        });
    });
}

　　就这么多吧，想起来了，再补充