Mit der Push Messaging API können wir auch dann Benachrichtigungen an einen Nutzer senden, wenn der Browser geschlossen ist. Viele Entwickler möchten diese Nachrichtenfunktion nutzen können, um Inhalte zu aktualisieren und zu synchronisieren, ohne dass der Browser geöffnet ist. Die API hat jedoch eine wichtige Einschränkung: Sie müssen für jede einzelne empfangene Push-Nachricht eine Benachrichtigung anzeigen.
Die Möglichkeit, eine Push-Nachricht zu senden, um Daten auf dem Gerät eines Nutzers zu synchronisieren oder eine zuvor angezeigte Benachrichtigung auszublenden, kann für Nutzer und Entwickler äußerst nützlich sein. Es ist jedoch möglich, einer Webanwendung zu ermöglichen, im Hintergrund zu arbeiten, ohne dass der Nutzer weiß, dass er missbraucht wird.
Die Budget API ist eine neue API, mit der Entwickler in begrenztem Umfang Hintergrundarbeiten ausführen können, ohne den Nutzer zu benachrichtigen, z. B. im Hintergrund oder im Hintergrund. Ab Chrome 60 können Sie diese API verwenden. Das Chrome-Team freut sich auf Feedback von Entwicklern.
Damit Entwickler die Ressourcen eines Nutzers im Hintergrund nutzen können, führt die Webplattform das Konzept eines Budgets mithilfe der neuen Budget API ein. Jeder Website wird ein Ressourcenbetrag auf Grundlage der Nutzerinteraktion zur Verfügung gestellt, der für Hintergrundaktionen genutzt werden kann, z. B. für einen stummen Push, bei dem jeder Vorgang das Budget erschöpft. Wenn das Budget aufgebraucht ist, können Hintergrundaktionen nicht mehr ohne Sichtbarkeit für Nutzer ausgeführt werden. Der User-Agent ist dafür verantwortlich, das Budget zu bestimmen, das einer Web-App auf der Grundlage ihrer Heuristik zugewiesen wird. So kann z. B. ein Guthaben und ein Nachlass mit der Nutzerinteraktion verknüpft sein. Jeder Browser kann seine eigene Heuristik festlegen.
Zusammenfassung: Mit der Budget API können Sie ein Budget reservieren, verwenden, eine Liste des verbleibenden Budgets abrufen und die Kosten für Hintergrundvorgänge nachvollziehen
Budget reservieren
Ab Chrome 60 ist die Methode navigator.budget.reserve() ohne Flags verfügbar.
Mit der Methode reserve() können Sie ein Budget für einen bestimmten Vorgang anfordern. Es wird ein boolescher Wert zurückgegeben, der angibt, ob das Budget reserviert werden kann. Wenn das Budget reserviert war, muss der Nutzer nicht über Ihre Hintergrundarbeit informiert werden.
Im Beispiel von Push-Benachrichtigungen können Sie versuchen, ein Budget für einen „silent-push“-Vorgang zu reservieren. Wenn reserve() mit „true“ aufgelöst wird, ist der Vorgang zulässig. Andernfalls wird „false“ zurückgegeben und Sie müssen eine Benachrichtigung anzeigen
self.addEventListener('push', event => {
const promiseChain = navigator.budget.reserve('silent-push')
.then((reserved) => {
if (reserved) {
// No need to show a notification.
return;
}
// Not enough budget is available, must show a notification.
return registration.showNotification(...);
});
event.waitUntil(promiseChain);
});
In Chrome 60 ist "Lautlos-Push" der einzige verfügbare Vorgangstyp. Eine vollständige Liste der Vorgangstypen finden Sie in der Spezifikation. Es gibt auch keine einfache Möglichkeit, das Budget für Test- oder Debugging-Zwecke zu erhöhen, sobald es verwendet wurde. Als vorübergehende Problemumgehung können Sie jedoch ein neues Profil in Chrome erstellen. Leider können Sie auch hierfür nicht den Inkognitomodus verwenden, da die Budget API im Inkognitomodus ein Budget von null zurückgibt (obwohl es während der Tests einen Fehler gibt, der zu einem Fehler führt).
Sie sollten reserve() nur dann aufrufen, wenn Sie später den Vorgang ausführen möchten, den Sie reservieren. Wenn Sie im obigen Beispiel „Reserve“ aufgerufen haben, aber trotzdem eine Benachrichtigung angezeigt haben, wird das Budget trotzdem verwendet.
Ein häufiger Anwendungsfall, der nicht von reserve() allein aktiviert wird, ist die Möglichkeit, eine stille Push von einem Back-End zu planen. Die Budget API verfügt zwar über APIs, um diesen Anwendungsfall zu ermöglichen, sie werden jedoch noch in Chrome gearbeitet und sind derzeit nur hinter Flags und / oder in einem Ursprungstest verfügbar.
Budget API und Ursprungstests
Es gibt zwei Methoden, getBudget() und getCost(), die von einer Webanwendung verwendet werden können, um die Nutzung ihres Budgets zu planen.
In Chrome 60 sind beide Methoden verfügbar, wenn Sie sich für den Ursprungstest registrieren. Für Testzwecke können Sie sie jedoch lokal verwenden, indem Sie das Flag für experimentelle Webplattformfunktionen (chrome://flags/#enable-experimental-web-platform-features in Chrome öffnen) aktivieren.
Sehen wir uns an, wie diese APIs verwendet werden.
Budget abrufen
Sie können Ihr verfügbares Budget mit der getBudget()-Methode ermitteln. In einigen Browsern (z. B. Chrome) wird das Budget im Laufe der Zeit abschwächen. Um einen vollständigen Überblick zu erhalten, wird ein Array von BudgetStates zurückgegeben, das angibt, wie hoch Ihr Budget künftig zu verschiedenen Zeiten sein wird.
Zum Auflisten der Budgeteinträge, die ausgeführt werden können:
navigator.budget.getBudget()
.then((budgets) => {
budgets.forEach((element) => {
console.log(\`At '${new Date(element.time).toString()}' \` +
\`your budget will be '${element.budgetAt}'.\`);
});
});
Der erste Eintrag ist Ihr aktuelles Budget. Zusätzliche Werte geben an, wie hoch Ihr Budget in Zukunft sein wird.
At 'Mon Jun 05 2017 12:47:20' you will have a budget of '3'.
At 'Fri Jun 09 2017 10:42:57' you will have a budget of '2'.
At 'Fri Jun 09 2017 12:31:09' you will have a budget of '1'.
Einer der Vorteile der Einbeziehung zukünftiger Budgetnachlässe besteht darin, dass Entwickler diese Informationen mit ihrem Back-End teilen können, um ihr serverseitiges Verhalten anzupassen (d.h., eine Push-Nachricht zum Auslösen einer Aktualisierung nur zu senden, wenn der Client das Budget für einen stillen Push hat).
Kosten eines Vorgangs abrufen
Wenn Sie wissen möchten, wie viel ein Vorgang kostet, erhalten Sie durch Aufrufen von getCost() eine Zahl, die den maximalen Budgetbetrag angibt, der verbraucht wird, wenn Sie reserve() für diesen Vorgang aufrufen.
Zum Beispiel können wir mit dem folgenden Code herausfinden, wie viel es kostet, wenn Sie bei einer Push-Nachricht keine Benachrichtigung anzeigen, d.h. die Kosten für einen Push-Vorgang im Hintergrund:
navigator.budget.getCost('silent-push')
.then((cost) => {
console.log('Cost of silent push is:', cost);
})
.catch((err) => {
console.error('Unable to get cost:', err);
});
Beim Erstellen dieses Dokuments wird in Chrome 60 Folgendes ausgegeben:
Cost of silent push is: 2
Bei den Methoden reserve() und getCost() ist zu beachten, dass die tatsächlichen Kosten eines Vorgangs unter den von getCost() zurückgegebenen Kosten liegen können.
Sie können möglicherweise trotzdem einen Vorgang reservieren, wenn Ihr aktuelles Budget unter den angegebenen Kosten liegt. Die genauen Details aus der Spezifikation finden Sie hier:
Das ist die aktuelle API in Chrome. Da im Web weiterhin neue APIs unterstützt werden, die Hintergrundarbeiten wie Hintergrundabruf erfordern, kann die Budget API verwendet werden, um die Anzahl der Vorgänge zu verwalten, die Sie ausführen können, ohne den Nutzer zu benachrichtigen.
Bitte geben Sie während der Verwendung der API Feedback zum GitHub-Repository oder melden Sie Chrome-Fehler unter crbug.com.