---
title: ServiceWorkerContainer.register()
slug: Web/API/ServiceWorkerContainer/register
translation_of: Web/API/ServiceWorkerContainer/register
---
<p>{{SeeCompatTable}}{{APIRef("Service Workers API")}}</p>

<p><strong><code>register()</code></strong> метод {{domxref("ServiceWorkerContainer")}} интерфейса который создаёт и обновляет <a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration" title="The ServiceWorkerRegistion interface of the ServiceWorker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin."><code>ServiceWorkerRegistration</code></a>  для указанного <code>URL js скрипта</code>.</p>

<p>Если удачно, service worker registration связывается по указанному URL js скрипта , который соответственно используется для проверки совпадения при навигации по URL. Если метод не возвращает <code>ServiceWorkerRegistration</code>, он возвращает <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object is used for deferred and asynchronous computations. A Promise is in one of the three states:"><code>Promise</code></a>. Есть возможность вызвать этот метод без проверки на условие, т.е. нет необходимости сначала проверять существует ли активная регистрация в данный момент или нет.</p>

<h2 id="Синтаксис">Синтаксис</h2>

<pre class="brush: js notranslate">ServiceWorkerContainer.register(scriptURL, options)
  .then(function(ServiceWorkerRegistration) { ... });</pre>

<h3 id="Параметры">Параметры</h3>

<dl>
 <dt><code>scriptURL</code></dt>
 <dd>URL скрипта service worker - а.</dd>
 <dt><code>options</code> <code>{{optional_inline}}</code></dt>
 <dd>Опции — это объект  необходимый для регистрации service worker-a. В данный момент доступные опции:
 <ul>
  <li><code>scope</code>: {{domxref("USVString")}} представляет собой URL, который определяет scope service worker-a; Какой диапазон URL может контролировать service worker. Это обычно относительный URL. Значение по умолчанию — это URL,  который соответствует корню, т.е. './', используя директорию расположения js скрипта service worker-а как основу.</li>
 </ul>
 </dd>
</dl>

<h3 id="Возвращает">Возвращает</h3>

<p>{{domxref("Promise")}} который резолвится в {{domxref("ServiceWorkerRegistration")}} объект.</p>

<h2 id="Пример_использования">Пример использования</h2>

<p>Примеры кода, приведённые ниже, должны рассматриваться вместе для лучшего понимания того, как применяется scope service worker-ов к конкретной странице.</p>

<p>Следующий пример использует дефолтный scope (не указывая его прямо). Service worker в этом случае будет контролировать <code>example.com/index.html</code> и страницы, расположенные "глубже", например <code>example.com/product/description.html</code>.</p>

<pre class="brush: js notranslate">if ('serviceWorker' in navigator) {
  // Регистрация service worker-а, расположенного в корне сайта
  // за счёт использования дефолтного scope (не указывая его)
  navigator.serviceWorker.register('/sw.js').then(function(registration) {
    console.log('Service worker зарегистрирован:', registration);
  }).catch(function(error) {
    console.log('Ошибка при регистрации service worker-а:', error);
  });
} else {
  // Текущий браузер не поддерживает service worker-ы.
  console.log('Текущий браузер не поддерживает service worker-ы');
}</pre>

<p>Следующий пример, если он размещён на странице корня сайта, будет применён ровно к тем же страницам, что и пример выше. Помните, scope, если он указан, использует path страницы в качестве своей базы. Это значит, что, если следующий пример будет использоваться на странице <code>example.com/product/description.html</code>, то scope <code>./</code> будет означать, что service worker работает только со страницами внутри <code>example.com/product</code>. Если необходимо зарегистрировать service worker на <code>example.com/product/description.html</code>, и вы хотите, чтобы он обслуживал и корень, <code>example.com</code>, то scope лучше не указывать совсем, как в примере выше.</p>

<pre class="brush: js notranslate">if ('serviceWorker' in navigator) {
  // Регистрация service worker-а, расположенного в корне сайта
  // с указанием более строгого scope
  navigator.serviceWorker.register('/sw.js', {scope: './'}).then(function(registration) {
    console.log('Service worker зарегистрирован:', registration);
  }).catch(function(error) {
    console.log('Ошибка при регистрации service worker-а:', error);
  });
} else {
  console.log('Текущий браузер не поддерживает service worker-ы.');
}</pre>



<h2 id="Спецификация">Спецификация</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Спецификация</th>
   <th scope="col">Статус</th>
   <th scope="col">Комментарии</th>
  </tr>
  <tr>
   <td>{{SpecName('Service Workers', '#service-worker-container', 'ServiceWorkerContainer')}}</td>
   <td>{{Spec2('Service Workers')}}</td>
   <td>Первичное определение.</td>
  </tr>
 </tbody>
</table>

<h2 id="Браузерная_совместимость">Браузерная совместимость</h2>

<p>{{Compat("api.ServiceWorkerContainer.register")}}</p>