Budget API 소개

Push Messaging API를 사용하면 브라우저가 닫힙니다. 많은 개발자가 이 메시지를 사용하여 브라우저를 열지 않고도 콘텐츠를 업데이트하고 동기화하지만, 한 가지 중요한 제한 사항이 있습니다. 단일 푸시 메시지를 수신할 수 있습니다.

푸시 메시지를 전송하여 사용자 기기의 데이터를 동기화하거나 알림을 받는 것은 사용자에게 매우 유용할 수 있고 사용자가 없어도 웹 앱이 백그라운드에서 작동하도록 할 수 있습니다. 악용될 수 있다는 사실을 아는 것이죠

예산 API 개발자가 제한된 백그라운드 작업을 수행할 수 있도록 설계된 새로운 API입니다. 사용자에게 알리지 않고(예: 무음 푸시, 백그라운드 실행) 가져올 수 있습니다 Chrome 60 이상에서는 이 API를 사용하여 Chrome팀은 개발자 여러분의 의견을 기다리고 있습니다.

개발자가 백그라운드에서 사용자의 리소스를 사용할 수 있도록 하기 위해 웹은 새로운 예산 API를 사용하는 예산의 개념을 도입하고 있습니다. 각 제출한 사용자 참여에 따라 Google에서 보유한 백그라운드 작업에 소비할 수 있으며 자동으로 푸시되는 것을 예로 들 수 있습니다. 이 예산 지출 시 사용자 없이 백그라운드 작업을 더 이상 수행할 수 없음 가시성을 제공합니다 사용자 에이전트가 예산을 결정합니다. 휴리스틱(예: 예산 허용)에 따라 웹 앱에 할당 사용자 참여와 연결될 수 있습니다 브라우저마다 자체 휴리스틱을 결정할 수 있습니다.

요약: 예산 API를 사용하면 예산을 예약하고, 예산을 사용하고, 목록을 가져올 수 있습니다. 백그라운드 작업 비용을 파악할 수 있습니다.

예산 예약

Chrome 60 이상에서는 navigator.budget.reserve() 메서드를 사용할 수 있습니다. 깃발 없이 수행될 수 있습니다.

reserve() 메서드를 사용하면 특정 작업의 예산을 요청할 수 있습니다. 예산을 예약할 수 있는지를 나타내는 부울 값을 반환합니다. 만약 예산이 예약되었으므로 사용자에게 백그라운드에 대해 알리지 않아도 됩니다. 있습니다

푸시 알림의 예에서는 ' 무음 - 푸시' reserve()가 true로 확인되면 허용됩니다. 그렇지 않으면 false가 반환되며 알림을 표시해야 합니다.

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);
});

Chrome 60에서는 'silent-push'가 사용됩니다. 인코더에 남은 유일한 연산 유형이 사용할 수 있지만 사양의 작업 유형 전체 목록을 참조하세요. 테스트나 디버깅을 위한 예산을 쉽게 늘릴 수 있는 방법도 없습니다. 임시적인 해결 방법으로 새 파일을 만들 수 있습니다. 할 수 있습니다. 안타깝게도 예산 때문에 시크릿 모드로 사용할 수도 없습니다. API는 시크릿 모드에서 예산 0을 반환합니다 (단, 버그를 발견했는데 )입니다.

현재 작업을 실행하려는 경우에만 reserve()를 호출해야 합니다. 예약하지 않을 수 있습니다. 참고: 여전히 알림이 표시되어 있다면 예산이 계속 사용됩니다.

reserve()만으로 사용 설정되지 않는 일반적인 사용 사례는 다음과 같습니다. 자동으로 푸시되도록 예약할 수 있습니다 예산 API에는 사용 설정할 수 있는 API가 있습니다. 아직 Chrome에서 작업 중이며 현재 플래그 또는 오리진 트라이얼을 통해서만 제공됩니다.

예산 API 및 오리진 트라이얼

웹 앱에서 사용할 수 있는 두 가지 메서드인 getBudget()getCost()가 있습니다. 예산 사용을 계획합니다

Chrome 60에서는 오리진 트라이얼에 가입하면 이 두 방법을 모두 사용할 수 있습니다. 하지만 테스트용으로는 실험용 웹 플랫폼 기능 플래그 (Open chrome://flags/#enable-experimental-web-platform-features Chrome).

이러한 API를 사용하는 방법을 살펴보겠습니다.

예산 확인하기

getBudget() 메서드로 사용 가능한 예산을 찾을 수 있습니다. 일부 브라우저 (예: Chrome)에는 예산 '감소'가 포함됩니다. 전체 데이터 세트를 가시성은 예산을 나타내는 BudgetStates 배열을 반환합니다. 또 다른 시점에 일어날 것입니다.

예산 항목을 나열하려면 다음을 실행합니다.

navigator.budget.getBudget()
.then((budgets) => {
  budgets.forEach((element) => {
    console.log(\`At '${new Date(element.time).toString()}' \` +
      \`your budget will be '${element.budgetAt}'.\`);
  });
});

첫 번째 항목이 현재 예산이며 추가 값이 표시됩니다. 향후 예산에서 예상되는 금액을 추산할 수 있습니다.

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'.

향후 예산 허용금을 포함할 경우의 이점 중 하나는 개발자가 이 정보를 백엔드와 공유하여 서버 측 동작을 조정합니다. (즉, 클라이언트에 예산이 있을 때만 푸시 메시지를 보내 업데이트를 트리거함 을 입력합니다.

작업 비용 확인

작업 비용을 확인하기 위해 getCost()를 호출하면 호출 시 사용할 예산의 최대 금액을 나타내는 숫자입니다. reserve()입니다.

예를 들어 사용자가 알림을 표시하지 않을 경우 발생하는 비용을 확인할 수 있습니다. 푸시 메시지 (즉, 자동 푸시 비용)를 수신하고, 코드:

navigator.budget.getCost('silent-push')
.then((cost) => {
  console.log('Cost of silent push is:', cost);
})
.catch((err) => {
  console.error('Unable to get cost:', err);
});

이 문서 작성 시점에 Chrome 60에서 다음 항목이 인쇄됩니다.

Cost of silent push is: 2

reserve()getCost() 메서드로 강조해야 할 한 가지는 실제 작업 비용은 getCost()에서 반환된 비용보다 적을 수 있습니다. 현재 예산이 더 적은 경우에도 운영을 예약할 수 있습니다. 표시됩니다. 사양의 구체적인 세부정보는 다음과 같습니다. 다음을 참고하세요.

이것이 Chrome의 현재 API이며, 웹은 계속해서 새로운 API를 백그라운드 가져오기와 같은 백그라운드 작업을 수행할 수 있는 기능이 필요한 경우, 사용자에게 알리지 않고 수행할 수 있는 작업의 수를 관리할 수 있습니다.

API를 사용하면서 GitHub 저장소에 관한 의견을 보내주세요. crbug.com에서 Chrome 버그를 신고하세요.