プッシュ通知システムを作成しようとしていますクロムに。 私はmysqlからデータを取得してJSONをエコーするphpを持っています。今度はプッシュ通知が到着してJSONデータを読み込んだときにアクティブになるgetJsonCode()関数を呼び出したいです。
私のサービスワーカーの中では、「標準関数を作成しました。XMLHttpRequestを使用してgetJsonCodeを作成すると、定義されていないことがわかります。
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");
}
サービスワーカー内でこのような外部ファイルを呼び出すことは可能ですか、それとも何らかの制限がありますか?なぜこれがうまくいかないのかわからないから
回答:
回答№1は5の代わりに XMLHttpRequest
、あなたは新しいを使用することができます Fetch API. XMLHttpRequest
非推奨となっており、サービスワーカーの範囲では使用できません。
まさにあなたが達成したいことの例があります このServiceWorkerクックブックレシピ.
回答№2については2
fetch()はXHRに似たリクエストを可能にする新しいAPIですが、よりシンプルで使いやすいAPIを持っているので、XHRの代わりに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
});
}));
});