XMLHttpRequest внутри сервисного работника
Я пытаюсь создать систему push-уведомлений на Chrome.
У меня есть php, который извлекает данные из mysql и отображает JSON, теперь я хотел бы вызвать функцию getJsonCode (), которая активируется, когда приходит push-уведомление и читает данные JSON.
В моем сервисном работнике я создал стандартные функции. Проблема в том, что когда я создаю getJsonCode с XMLHttpRequest, он говорит мне, что он не определен
self.addEventListener('install', function(event) {
self.skipWaiting();
console.log('Installed', event);
});
self.addEventListener('activate', function(event) {
console.log('Activated', event);
});
self.addEventListener('push', function(event) {
console.log('Push message', event);
getJsonCode();
);
})
getJsonCode() {
codeRequest= new XMLHttpRequest();
codeRequest.open('get', 'myfileWithJson.php', true);
codeRequest.send();
dataJSON = codeRequest.responseText;
console.log('rispostaJSON');
}
Можно ли вызвать такой внешний файл внутри сервисного работника или есть какие-то ограничения? Потому что я не понимаю, почему это не работает
Решение
Вместо XMLHttpRequestВы можете использовать новый Получить API. XMLHttpRequest устарел и недоступен в области работника сервиса.
Есть пример того, чего вы хотите достичь в этот рецепт ServiceWorker Cookbook.
Другие решения
Вы можете использовать fetch () вместо XHR, так как fetch () — это новый API, который позволяет делать запросы, аналогичные XHR, но имеет более простой / дружественный API. Подробнее о fetch Вот. Попробуй это:-
self.addEventListener('push', function(event) {
console.log('Push message', event);
event.waitUntil(
fetch('/myfileWithJson.php').then(function(response){
return response.json();
}).then(function(data){console.log(data);
return self.registration.showNotification(data.title, {
body: data.body,
icon: 'images/icon.png',
tag: data.url
});
}));
});