Проблема с событием beforeunload в Safari возникает из-за стратегии безопасности браузера. Согласно этой стратегии, Safari блокирует некоторые действия на странице, такие как всплывающие окна и переходы на другую страницу при обработке события beforeunload.
Однако, существует альтернативный способ сохранить данные при обновлении страницы в Safari (и в других браузерах). Вместо отправки запроса методом POST через axios или fetch, вы можете использовать localStorage для хранения данных при обновлении страницы.
Следующий код показывает, как сохранить данные в localStorage при обновлении страницы:
```javascript
// Запишите данные в localStorage при обновлении страницы
window.addEventListener('beforeunload', function(event) {
localStorage.setItem('data', JSON.stringify(yourData));
});
// Получите данные при загрузке страницы (выполните этот код, когда загружается Vue.js приложение)
window.addEventListener('load', function(event) {
var storedData = localStorage.getItem('data');
if (storedData) {
yourData = JSON.parse(storedData);
localStorage.removeItem('data'); // удалите сохраненные данные после использования
}
});
```
Вы можете поменять `yourData` на ваше реальное хранилище данных, которое вы хотите сохранить при обновлении страницы.
Этот подход работает во всех браузерах, включая Safari, и более предсказуем, чем использование события beforeunload, так как он не зависит от стратегий безопасности конкретного браузера.
Если вам все же нужно отправить HTTP-запрос во время обновления страницы, то вы можете использовать синхронный запрос (хотя это не рекомендуется, так как это может вызвать задержку и заморозку страницы):
```javascript
// Отправка синхронного запроса методом POST
var xhr = new XMLHttpRequest();
xhr.open('POST', 'your-url', false); // false означает синхронный запрос
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify(yourData));
```
Обратите внимание, что использование синхронного запроса может вызывать проблемы производительности и является устаревшим подходом.