indexedDB error case

indexeddb-error-case-step-1.js

// 尝试连接indexedDB，得到一个‘响应’
let request;

request = indexedDB.open('testing', 1.0);

request.onerror = function (event) {
  alert('Something bad happened while trying to open: ' + event.target.errorCode);
};

request.onsuccess = function () {
  const db = request.result;
};

indexeddb-error-case-step-2.js

// 创建对象存储空间失败
let request = indexedDB.open('testing', 1.0);

request.onerror = function (event) {
  alert('Something bad happened while trying to open: ' + event.target.errorCode);
};

request.onsuccess = function () {
  const db = request.result;
  // 创建存储空间
  const store = db.createObjectStore('users', {keyPath: 'userID'});
};  
  // 上面一个语句抛出错误，这是遇到的第一个问题
  // Uncaught DOMException: Failed to execute 'createObjectStore' on 'IDBDatabase': The database is not running a version change transaction.
  // at IDBOpenDBRequest.request.onsuccess
  
  // 解决方法：参考了https://gist.github.com/BigstickCarpet/a0d6389a5d0e3a24814b，将语句从request.onsuccess移至request.onupgradeneeded,
  // request.onupgradeneeded = function() {
  //   const db = open.result;
  //   const store = db.createObjectStore("users", {keyPath: "userID"});
  // };
};
};

indexeddb-error-case-step-3.js

// 模仿https://gist.github.com/BigstickCarpet/a0d6389a5d0e3a24814b，但创建事务失败

// 待写入数据
const users = [
  {
    userID: '001',
    username: 'Cherry'
  },
  {
    userID: '002',
    username: 'Rachel'
  },
  {
    userID: '003',
    username: 'Amy'
  },
  {
    userID: '004',
    username: 'David'
  },
  {
    userID: '005',
    username: 'Mia'
  }
];

// 创建数据库连接  
let request.indexedDB.open('testing', 1.0)
  
request.onerror = function (event) {
  alert('Something bad happened while trying to open: ' + event.target.errorCode);
};
  
request.onupgradeneeded = function () {
  const db = request.result;
  // 创建存储空间
  const store = db.createObjectStore('users', { keyPath: 'userID' });
  const index = store.createIndex('NameIndex', 'username');
};

request.onsuccess = function () {
  const db = request.result;
  // 事务 - 读取与修改操作
  const transaction = db.transaction('users', 'readwrite');
  // 上面一行抛出错误，这是遇到的第二个问题
  // Uncaught DOMException: Failed to execute 'transaction' on 'IDBDatabase': One of the specified object stores was not found.
  // at IDBOpenDBRequest.request.onsuccess
  
  // 问题表现：
  // 将找到的那个demo放在网页中跑，没问题，但我仿写的代码一直出错，认真对比过，并没有发现区别，很郁闷
  
  // 寻找方案：
  // 看了一个stackoverflow的网页，并没有找到解决方案
  
  // 解决方法
  // 最后在chrome dev tools的indexedDB中删除了'testing'这个数据库，再次执行代码才没有抛出这个错误。我想是我第一次建立连接的时候，就创建了一个空的
  // 名为'testing'的数据库，但又没有在里面创建相应的对象存储空间，所以事务不能创建相应的事务。但我不明白的是，它在数据库创建成功后，为什么不能创建
  // 相应的对象存储空间，对于第一个问题，request.onupgradeneeded的作用是什么，我也还没去查清楚。
  
  const store = transaction.objectStore('users');
  
  let i = 0;
  // 数据写入
  while(i < users.length) {
    store.add(users[i++]);
  }

  const newRequest = store.get('002');

  newRequest.onerror = function (event) {
    alert('Did not get the object');
  };

  newRequest.onsuccess = function (event) {
    console.log(event.target.result);
  };
 
  transaction.oncomplete = function () {
   db.close();
  };
};