Estoy buscando una solución sólida para llevar a cabo un evento asíncrono en una pestaña de cierre en JavaScript
Por contexto, tengo un sitio con varias (miles) de páginas que solo deberían permitir que un usuario edite una página a la vez (es decir, dos usuarios no pueden escribir en la misma página a la vez). Entonces, cuando un usuario abre una página, realizo una llamada de fetch para establecer un indicador de base de datos para esa página para marcarla como bloqueada.
Idealmente, cuando se cierra la pestaña/ventana o se deja la página, necesito desactivar esa bandera bloqueada; llamando a otro evento de fetch asíncrona para hacerlo. Estoy familiarizado con window.onunload y window.onbeforeunload y actualmente los uso para intentar llamar a la fetch para lograr esto, pero parece que esto solo funciona aproximadamente la mitad del tiempo. La otra mitad del tiempo, la página nunca desactivará el bloqueo, lo que causa problemas importantes cuando otros usuarios necesitan acceder a la página después
Mi código:
window.addEventListener('beforeunload', (ev) => { ev.preventDefault(); if (condition) { postToURL(`/url/to/unlock/page`); //postToURL is a custom function that essentially calls 'fetch'. Using the 'await' keyword seemed to have no effect here } return; });Mi pregunta es, ¿hay una manera más consistente de hacer esto? Con un sitio que requiere que varios usuarios abandonen y abran constantemente estas páginas, necesito una forma más precisa de manejar esto. ¡Cualquier ayuda sería muy apreciada, gracias!
La API Beacon se creó para este escenario. Enviará una solicitud independiente del cierre de la página.