Я пытаюсь получить информацию от API в моей indexedDB для PWA. К сожалению, массив возвращается столько раз, сколько данных в API. Это только в функции indexedDB.
console.log (pushable) возвращается с 67 записями. Console.log («неправильно», проекты) возвращается 67 раз со всеми 67 записями. Я понятия не имею, почему это происходит. Очевидно, что код также ничего не вставляет в БД, так как он не работает, к сожалению.
let projectData = null
let pushable = []
fetch('https://cmgt.hr.nl:8000/api/projects/')
.then((response) => {
return response.json()
})
.then((data) => {
projectData = data
for (let project of projectData.projects) {
pushable.push({id: project._id, title: project.title, author: project.author})
}
// here it comes back perfect.
console.log(pushable)
//indexeddb
const request = indexedDB.open("project")
let db;
request.onupgradeneeded = function() {
const db = request.result
const store = db.createObjectStore("projects", {keyPath: "id"})
const titleIndex = store.createIndex("by_title", "title", {unique: true})
const authorIndex = store.createIndex("by_author", "author")
};
request.onsuccess = function() {
db = request.result
};
request.onsuccess = function(event) {
let projects = pushable
let db = event.target.result
let transaction = db.transaction('projects', 'readwrite')
transaction.onsuccess = function(event) {
console.log('Added!')
}
// Here is the 67 times an array of 67 items happen.
transaction.onerror = function(event){
console.log('wrong', projects)
}
//trying to push each item of the array in the indexedDB, which fails ofcourse.
let projectsStore = transaction.objectStore('projects')
projects.forEach(function(project){
var db_op_req = projectsStore.add(project)
db_op_req.onsuccess = function(event) {
console.log(event.target.result == project.id) // true
}
});
}
}).catch(err => console.log(err))
Если мой код не выглядит «красивым» или «правильным», я все еще студент. Так что любые советы по оптимизации моего кода очень ценятся! Спасибо, что посмотрели.