Versionamento e atualizações
Migre esquemas com alterações de versão.
Versionamento e atualizações é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de JavaScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de JavaScript Academy inclui 4 aulas no total.
Por que usar versionamento?
Os aplicativos evoluem: você adiciona stores, acrescenta índices ou altera a estrutura dos dados. O IndexedDB usa um número de versão para gerenciar essas alterações de esquema com segurança no navegador de cada usuário.
O número da versão
O segundo argumento de open é a versão, um número inteiro positivo. Aumentá-la informa ao navegador que o esquema mudou e aciona uma atualização.
// Bumping from 1 to 2 triggers onupgradeneeded:
const request = indexedDB.open('app-db', 2);A versão só aumenta
Só é possível aumentar a versão. Abrir o banco com um número menor do que o armazenado falha com um erro. Nunca diminua a versão.
// If the stored DB is version 3:
const req = indexedDB.open('app-db', 2);
req.onerror = () => console.log('cannot open older version');oldVersion e newVersion
Dentro de onupgradeneeded, o evento expõe oldVersion e newVersion. Use esses valores para aplicar apenas as migrações que ainda não foram executadas.
request.onupgradeneeded = (e) => {
console.log('upgrading from', e.oldVersion, 'to', e.newVersion);
};Migrações incrementais
Um padrão robusto é usar uma sequência contínua com oldVersion: cada bloco se baseia no anterior, para que um usuário em qualquer versão antiga chegue ao esquema mais recente.
request.onupgradeneeded = (e) => {
const db = e.target.result;
if (e.oldVersion < 1) {
db.createObjectStore('notes', { keyPath: 'id' });
}
if (e.oldVersion < 2) {
db.createObjectStore('tags', { keyPath: 'name' });
}
};Adicionando um índice posteriormente
Para adicionar um índice a um store existente durante uma atualização, obtenha o store da transaction de atualização e chame createIndex nele.
request.onupgradeneeded = (e) => {
if (e.oldVersion < 3) {
const store = e.target.transaction.objectStore('notes');
store.createIndex('byDate', 'createdAt');
}
};A transaction de alteração de versão
Durante onupgradeneeded, a transaction do evento é uma transaction especial de versionchange. Esse é o único contexto em que é possível alterar o esquema e migrar dados.
request.onupgradeneeded = (e) => {
const tx = e.target.transaction; // versionchange tx
const store = tx.objectStore('notes');
// migrate existing records here if needed
};Migrando dados existentes
Se uma alteração de esquema exigir a reestruturação dos registros, percorra o store com um cursor durante a atualização e use put para salvar novamente os valores transformados.
const store = e.target.transaction.objectStore('notes');
store.openCursor().onsuccess = (ev) => {
const cursor = ev.target.result;
if (cursor) {
const note = cursor.value;
note.archived = false; // new field
cursor.update(note);
cursor.continue();
}
};O evento versionchange
Quando uma aba faz uma atualização, outras abas que mantêm a versão antiga recebem um evento versionchange em seu db. Elas devem ser fechadas para que a atualização não seja bloqueada.
db.onversionchange = () => {
db.close(); // let the other tab upgrade
console.log('database is outdated, please reload');
};Excluindo stores
Você pode remover um store obsoleto durante uma atualização usando db.deleteObjectStore(name). Isso o exclui permanentemente, junto com seus dados.
request.onupgradeneeded = (e) => {
const db = e.target.result;
if (e.oldVersion < 4 && db.objectStoreNames.contains('temp')) {
db.deleteObjectStore('temp');
}
};Práticas recomendadas para atualizações
Mantenha as migrações idempotentes e ordenadas por oldVersion, feche as conexões antigas em versionchange e teste as atualizações a partir de cada versão anterior. Assim, os dados dos usuários que retornarem permanecerão intactos.
Verificação rápida
Teste sua compreensão sobre versionamento e atualizações.
Recapitulação
Você aprendeu sobre versionamento e atualizações:
- Aumente o número da versão para acionar
onupgradeneeded. - Use
oldVersionpara migrações incrementais e idempotentes. - A transaction de
versionchangeda atualização altera o esquema e os dados. - Migre registros com um cursor e
cursor.update. - Feche as abas antigas quando ocorrer o evento
versionchange.
Você concluiu o IndexedDB. Em seguida, veremos os trabalhadores de serviço.
Aprenda JavaScript com um tutor de IA — grátis
Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.
- Cursos
- 59
- Aulas
- 200
Perguntas Frequentes
A aula “Versionamento e atualizações” é grátis?
Sim — o texto completo de “Versionamento e atualizações” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de JavaScript Academy, atualize para CoddyKit PRO. O curso de JavaScript Academy inclui 4 aulas no total.
O que vou aprender em “Versionamento e atualizações”?
Migre esquemas com alterações de versão. Você pratica JavaScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar JavaScript Academy?
Nenhuma experiência prévia é necessária. JavaScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.
Quanto tempo leva a aula “Versionamento e atualizações”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de JavaScript Academy?
Sim. Cada aula de JavaScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- Abrindo um banco de dados
- Transações e CRUD
- Índices e consultas
- Versionamento e atualizações