IndexedDB 錯誤：NotFoundError：無法在“IDBDatabase”上執行“事務”：未找到指定的對象存儲之一

Question

我在 ReactJs PWA 中創建了一個 IndexedDB 設置。

拋出以下錯誤：

NotFoundError: Failed to execute 'transaction' on 'IDBDatabase': One of the specified object stores was not found.

在行userSearchDBtx = userSearchDB.transaction("userdata","readwrite")

我的函數如下所示：

function Users() {
  let userSearchDB,userSearchDBstore,userSearchDBtx;
  let userDbrequest = window.indexedDB.open("MyTestDatabase", 1);

useEffect(()=>{
  if (!window.indexedDB) {
      console.log("Your browser doesn't support a stable version of IndexedDB. Such and such feature will not be available.");
  }

  else console.log("IndexedDB supported")

  userDbrequest.onupgradeneeded = function(event) { 
    userSearchDB = event.target.result;
    userSearchDBtx = event.target.transaction;
    userSearchDBstore = userSearchDB.createObjectStore("userdata",{keyPath:"uid"})
  };

  userDbrequest.onerror = function(event) {
    console.log("ERROR: " + event.target.errorCode)
  };

  userDbrequest.onsuccess = function(event) {
    console.log("IndexdDb Working")
    userSearchDB = event.target.result
    userSearchDBtx = userSearchDB.transaction("userdata","readwrite");
    userSearchDBstore = userSearchDBtx.objectStore("userdata");
  };
  //Here also put is unknown
  userSearchDBstore.put({uid:3854238974,phone:3257777,name:"shan",email:"1@1.com"})

},[])

}

Answer 1

let userDbrequest = window.indexedDB.open("MyTestDatabase", 1);

將此行放在 useEffect() 中

代碼應該是

let userSearchDB,userSearchDBstore,userSearchDBtx,userDbrequest;

useEffect(()=>{
   userDbrequest = window.indexedDB.open("MyTestDatabase", 2);
   ...Conrinue your code
},[])

此外，在這樣做的同時增加版本

Answer 2

您在連接數據庫之前調用userSearchDBstore.put(...) ，這意味着不保證升級需要回調完成，這意味着不保證存儲創建。

你需要等待。 將 put 調用移動到 open db 請求成功回調中，以便它僅在數據庫升級后運行。

Answer 3

我發現原因是錯誤的 storeNames 在： const request = db .transaction(storeNames , "readwrite")