IntersectionObserver - Интерфейсы веб API

IntersectionObserver
====================

Интерфейс **`IntersectionObserver`** в составе Intersection Observer API предоставляет возможность асинхронного наблюдения за изменением пересечения целевого элемента с вышестоящим элементом или с верхоуровневым viewport документа. Вышестоящий элемент или viewport считается корнем.

Когда `IntersectionObserver` создан, он настроен на отслеживание заданных соотношений видимости в корне. Конфигурация не может быть изменена после создания `IntersectionObserver`, поэтому такой объект-наблюдатель полезен только для наблюдения за определёнными изменениями в степени видимости; однако вы можете следить за несколькими целевыми элементами с одним и тем же наблюдателем.

Constructor
-----------

`IntersectionObserver.IntersectionObserver()` (en-US)

Создаёт новый объект `IntersectionObserver`, который будет запускать специальную колбэк-функцию, когда обнаружит пересечение одного или нескольких пороговых значений видимостью целевого элемента.

Properties
----------

`IntersectionObserver.root` (en-US) Только для чтения

Конкретный предок наблюдаемого целевого `element`. Если в конструктор не было передано значения или оно `null`, будет использован viewport документа.

`IntersectionObserver.rootMargin` (en-US) Только для чтения

Смещение прямоугольника (*пер.* "An offset rectangle"), применяемое к bounding box (en-US) корня при расчёте пересечений, эффективно сжимает или увеличивает корень для целей расчёта. Возвращаемое этим свойством значение может не совпадать со значением, указанным при вызове конструктора, поскольку оно может быть изменено в соответствии с внутренними требованиями. Каждое смещение может быть выражено в пикселях (`px`) или в процентах (`%`). Значение по умолчанию "0px 0px 0px 0px".

`IntersectionObserver.thresholds` (en-US) Только для чтения

Список порогов, отсортированный по возрастанию, где каждый порог представляет собой отношение площади пересечения к ограничивающей области наблюдаемой цели. Уведомления для цели генерируются, когда любое из пороговых значений пересекается для этой цели. Если в конструктор не было передано значения, используется 0.

Methods
-------

`IntersectionObserver.disconnect()` (en-US)

Отключает объект `IntersectionObserver` от наблюдения любой цели.

`IntersectionObserver.observe()` (en-US)

Сообщает объекту `IntersectionObserver` целевой элемент для наблюдения.

`IntersectionObserver.takeRecords()` (en-US)

Возвращает массив из объектов `IntersectionObserverEntry` (en-US) для всех наблюдаемых целей.

`IntersectionObserver.unobserve()` (en-US)

Сообщает объекту `IntersectionObserver` прекратить наблюдение за конкретным целевым элементом.

Examples
--------

```js
var intersectionObserver = new IntersectionObserver(function (entries) {
  // Если intersectionRatio равен 0, цель вне зоны видимости
  // и нам не нужно ничего делать
  if (entries[0].intersectionRatio <= 0) return;

  loadItems(10);
  console.log("Loaded new items");
});
// начать наблюдение
intersectionObserver.observe(document.querySelector(".scrollerFooter"));
```

Specifications
--------------

| Specification |
| --- |
| Intersection Observer # intersection-observer-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `MutationObserver`
* `PerformanceObserver` (en-US)
* `ResizeObserver` (en-US)


Gyroscope - Интерфейсы веб API

Gyroscope
=========

**`Gyroscope`** интерфейс Sensor API даёт возможность считать позицию устройства по всем трём осям.

Для использования того сенсора пользователю нужно предоставить доступ устройства к `'gyroscope'` через `Permissions` (en-US) API.

If a feature policy blocks use of a feature it is because your code is inconsistent with the policies set on your server. This is not something that would ever be shown to a user. See `Feature-Policy` (en-US) for implementation instructions.

Конструктор
-----------

`Gyroscope.Gyroscope()` (en-US)

Создание нового `Gyroscope` объекта.

Свойства
--------

`Gyroscope.x` (en-US) Только для чтения

Возвращает угловое отклонение устройства по оси X.

`Gyroscope.y` (en-US) Только для чтения

Возвращает угловое отклонение устройства по оси Y.

`Gyroscope.z` (en-US) Только для чтения

Возвращает угловое отклонение устройства по оси Z.

Примеры
-------

Гироскоп обычно использует `Sensor.onreading` (en-US) событие для вызова колбэк-функции. В примере ниже функция вызывается 6 раз в секунду.

```js
let gyroscope = new Gyroscope({ frequency: 60 });

gyroscope.addEventListener("reading", (e) => {
  console.log("Angular velocity along the X-axis " + gyroscope.x);
  console.log("Angular velocity along the Y-axis " + gyroscope.y);
  console.log("Angular velocity along the Z-axis " + gyroscope.z);
});
gyroscope.start();
```

Спецификации
------------

| Specification |
| --- |
| Gyroscope # gyroscope-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


Touch - Интерфейсы веб API

Touch
=====

Интерфейс **`Touch`** представляет определённую точку касания на сенсорном устройстве. Точка касания – это место контакта пальца или стилуса с сенсорной поверхностью тачскрина или трекпада.

Свойства `Touch.radiusX` (en-US), `Touch.radiusY` (en-US), и `Touch.rotationAngle` (en-US) содержат данные об области контакта между пользователем и экраном – *области касания*. Они могут быть полезны при работе с устройствами, предусматривающими указатели низкой точности, например палец. Эти значения описывают эллипс, который соответствует области контакта (например, кончик пальца пользователя).
Экспериментальная возможность

**Примечание:** Многие значения зависят от устройства; например, если устройство не способно измерять силу нажатия на сенсорную поверхность, значение `force` всегда будет равняться 0. То же касается значений `radiusX` и `radiusY`; если у устройства только одна точка касания, данные значения всегда будут равны 1.

Конструктор
-----------

`Touch()` (en-US)
Экспериментальная возможность

Создаёт объект Touch.

Свойства
--------

*Данный интерфейс не имеет предков, не наследует и не реализует другие свойства.*

### Основные свойства

`Touch.identifier` (en-US) Только для чтения

Возвращает уникальный идентификатор указанного объекта `Touch`. Данная точка касания (например, пальцем) будет иметь один и тот же идентификатор на протяжении всего движения по сенсорной поверхности. Это гарантирует, что вы всё время отслеживаете одно и то же касание.

**`Touch.screenX` (en-US)** Только для чтения

Возвращает координату X точки касания относительно левого края экрана.

**`Touch.screenY` (en-US)** Только для чтения

Возвращает координату Y точки касания относительно верхнего края экрана.

**`Touch.clientX` (en-US)** Только для чтения

Возвращает координату X точки касания относительно левого края окна браузера, не учитывая прокрутку.

**`Touch.clientY` (en-US)** Только для чтения

Возвращает координату Y точки касания относительно верхнего края окна браузера, не учитывая прокрутку.

`Touch.pageX` (en-US) Только для чтения

Возвращает координату X точки касания относительно левого края документа. В отличие от `clientX`, это значение учитывает горизонтальную прокрутку, если она есть.

`Touch.pageY` (en-US) Только для чтения

Возвращает координату Y точки касания относительно верхнего края документа. В отличие от `clientY`, это значение учитывает вертикальную прокрутку, если она есть.

`Touch.target` (en-US) Только для чтения

Возвращает элемент (`Element`), на который попала точка касания, когда впервые появилась на сенсорной поверхности, даже если потом она была смещена за пределы данного элемента или даже была удалена из документа.

### Область касания

**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

`Touch.radiusX` (en-US) Только для чтения
Экспериментальная возможность

Возвращает радиус эллипса по оси X, наиболее близко соответствующий области контакта с экраном. Значение в пикселях того же масштаба, что и `screenX`.

`Touch.radiusY` (en-US) Только для чтения
Экспериментальная возможность

Возвращает радиус эллипса по оси Y, наиболее близко соответствующий области контакта с экраном. Значение в пикселях того же масштаба, что и `screenY`.

`Touch.rotationAngle` (en-US) Только для чтения
Экспериментальная возможность

Возвращает угол (в градусах), на который описываемый эллипс должен быть повёрнут по часовой стрелке, чтобы наиболее точно покрыть область контакта пользователя с сенсорной поверхностью.

`Touch.force` (en-US)Только для чтения
Экспериментальная возможность

Возвращает силу давления пользователем на сенсорную поверхность. Является числом от 0.0 (без давления) до 1.0 (максимальное давление).

Методы
------

*Этот интерфейс не имеет метода и родителя, а также не наследует и не реализует какой-либо метод.*

Спецификации
------------

| Specification |
| --- |
| Touch Events # touch-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* `Touch Events Overview`
* `Document.createTouch()` (en-US)


Document.origin - Интерфейсы веб API

Document.origin
===============

**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

**Document.origin —** это свойство, доступное только для чтения, которое возвращает **origin** документа. В большинстве случаев это свойство эквивалентно `document.defaultView.location.origin.`

Примеры
-------

```js
var origin = document.origin;
// На этой странице вернёт:'https://developer.mozilla.org'

var origin = document.origin;
// Для "about:blank" вернёт:'null'

var origin = document.origin;
// Для "data:text/html,<b>foo</b>" вернёт:'null'
```

Спецификация
------------

| Specification |
| --- |
| HTML Standard # dom-origin-dev |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Свойство `URLUtils.origin`.


Geolocation - Интерфейсы веб API

Geolocation
===========

Интерфейс **`Geolocation`** представляет возможность программно получит местоположение устройства. Он даёт доступ веб-содержимому к позиции пользователя. Это также помогает сайтам и приложениям предоставлять результаты, основываясь полученных данных.

Объект с этим интерфейсом получается с помощью свойства `NavigatorGeolocation.geolocation` (en-US) и реализуется объектом `Navigator`.

**Примечание:** По некоторым причинам, связанным с безопасностью, когда веб-страница пытается получить доступ к местоположению, пользователь будет уведомлен, а также будет запрошено разрешение. Имейте в виду, что у каждого браузера есть свои политики и методы для запроса этого разрешения.

Свойства
--------

*Интерфейс `Geolocation` ни реализует, ни наследует никаких свойств.*

Методы
------

**Интерфейс `Geolocation` не наследует никаких методов**.

`Geolocation.getCurrentPosition()` Secure context

Определяет местоположение устройства и возвращает объект `Position` (en-US) с данными.

`Geolocation.watchPosition()` (en-US) Secure context

Возвращает `long` значение, предоставляет вновь созданную колбэк-функцию, вызываемую при изменении местоположения устройства.

`Geolocation.clearWatch()` (en-US) Secure context

Удаляет обработчик, созданный с помощью `watchPosition()`.

Спецификации
------------

| Specification |
| --- |
| Geolocation API # geolocation\_interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Использование геолокации


AudioContext - Интерфейсы веб API

AudioContext
============

Интерфейс AudioContext можно представить как граф, состоящий из связанных между собой узлов `AudioNode`. С помощью этого интерфейса можно контролировать как создание узлов, из которых состоит AudioContext, так и контролировать обработку и декодирование звука. Необходимо создать AudioContext перед тем как делать что-либо ещё со звуком, так как всё что происходит при обработке звука, происходит внутри AudioContext.

AudioContext может выступать как обработчик событий, и он реализует интерфейс `EventTarget`.

Свойства
--------

`AudioContext.currentTime` Только для чтения

Содержит число с типом double, которое содержит значение времени в секундах, полученное от часов компьютера клиента. Это значение не может быть изменено никаким образом, оно только для чтения.

`AudioContext.destination` (en-US) Только для чтения

Содержит ссылку на `AudioDestinationNode` (en-US), представляющий собой точку назначения для всего аудио в этом контексте. Может рассматриваться как, например, аудио-воспроизводящее устройство.

`AudioContext.listener` (en-US) Только для чтения

Содержит ссылку на объект `AudioListener` (en-US), применяется для ориентирования в 3D-пространстве.

`AudioContext.sampleRate` (en-US) Только для чтения

Содержит число с типом float, представляющее собой частоту сэмплирования звука (sample rate), используемую всеми узлами в этом контексте. Это значение только для чтения и не может быть изменено.

`AudioContext.mozAudioChannelType`
Non-standard
 Только для чтения

Содержит ссылку на аудио-канал, который будет использоваться для воспроизведения звука в `AudioContext` на устройствах с FireFox OS. Только для чтения.

Методы
------

*Также реализованы методы из интерфейса* `EventTarget`.

`AudioContext.createBuffer()` (en-US)

Создаёт новый пустой объект `AudioBuffer`, в который затем могут помещаться данные для воспроизведения через `AudioBufferSourceNode` (en-US).

`AudioContext.createBufferSource()` (en-US)

Создаёт объект `AudioBufferSourceNode` (en-US), который может быть использован для воспроизведения и обработки данных звукового потока, содержащегося в объекте `AudioBuffer` . Объекты типа `AudioBuffer` создаются с помощью метода `AudioContext.createBuffer` (en-US) или возвращаются методом `AudioContext.decodeAudioData` (en-US), когда декодирование аудио-дорожки успешно завершено.

`AudioContext.createMediaElementSource()`

Создаёт объект `MediaElementAudioSourceNode`, ассоциированный с `HTMLMediaElement`. Может использоваться для воспроизведения или манипулирования данными звукового потока из `<video>` или `<audio>` элементов.

`AudioContext.createMediaStreamSource()` (en-US)

Создаёт объект `MediaStreamAudioSourceNode` (en-US), ассоциированный с `MediaStream`, и который представляет аудио-поток, поступающий от подключённого к клиентскому компьютеру микрофона или других источников.

`AudioContext.createMediaStreamDestination()` (en-US)

Создаёт объект `MediaStreamAudioDestinationNode` (en-US), ассоциированный с `MediaStream` и представляющий собой аудио-поток, который можно сохранить в локальный файл или передать на другой компьютер.

`AudioContext.createScriptProcessor()` (en-US)

Создаёт объект `ScriptProcessorNode` (en-US), который может быть использован для прямой обработки звука с помощью JavaScript.

`AudioContext.createAnalyser()` (en-US)

Создаёт объект `AnalyserNode`, который может быть использован для получения времени воспроизведения и частоты воспроизводимого звука, что, в свою очередь может быть использовано для визуализации звукового потока.

`AudioContext.createBiquadFilter()` (en-US)

Создаёт объект `BiquadFilterNode` (en-US), который представляет собой фильтр второго порядка, конфигурируемый как фильтр верхних частот, как фильтр нижних частот, фильтр полосы пропускания и так далее.

`AudioContext.createChannelMerger()` (en-US)

Создаёт объект `ChannelMergerNode` (en-US), который используется для слияния каналов из множества аудио-потоков в один аудио-поток.

`AudioContext.createChannelSplitter()` (en-US)

Создаёт объект `ChannelSplitterNode` (en-US), который используется для доступа к отдельным каналам аудио-потока для их дальнейшей обработки по отдельности.

`AudioContext.createConvolver()` (en-US)

Создаёт объект `ConvolverNode` (en-US), который может быть использован для применения эффекта свёртки (convolution effect) к аудио-графу. Например, для создания эффекта реверберации.

`AudioContext.createDelay()` (en-US)

Создаёт объект `DelayNode` (en-US), который может быть использован для задержки входящего аудио-сигнала на определённое время. Этот узел также удобен для создания петель обратной связи (feedback loops) в Web Audio графе.

`AudioContext.createDynamicsCompressor()` (en-US)

Создаёт объект `DynamicsCompressorNode` (en-US), который может быть использован для акустической компрессии аудио-сигнала.

`AudioContext.decodeAudioData()` (en-US)

Асинхронно декодирует данные из аудио-файла, находящиеся в `ArrayBuffer`. В этом случае ArrayBuffer заполняется при ответе на запрос `XMLHttpRequest`. `и установке` атрибута `responseType` в `arraybuffer`. Этот метод работает только с полными аудио-файлами и не работает с их фрагментами.

`AudioContext.createGain()` (en-US)

Создаёт объект `GainNode` (en-US), который может быть использован для контроля общей громкости во всём аудио-графе.

`AudioContext.createOscillator()` (en-US)

Создаёт объект `OscillatorNode` (en-US), источник, представляющий собой периодическую волну звукового сигнала.

`AudioContext.createPanner()`

Создаёт объект `PannerNode`, который используется для пространственного определения аудио-потока в трёхмерном пространстве.

`AudioContext.createPeriodicWave()` (en-US)

Создаёт объект `PeriodicWave` (en-US), используемый для определения периодической волны звукового сигнала, которая, в свою очередь, используется для определения вывода в `OscillatorNode` (en-US).

`AudioContext.createWaveShaper()` (en-US)

Создаёт объект `WaveShaperNode` (en-US), который может быть использован для создания эффектов нелинейных звуковых искажений.

`AudioContext.createAudioWorker()`

Создаёт объект `AudioWorkerNode`, который может взаимодействовать с потоком web worker для непосредственных генерации, обработки или анализа аудио данных. Этот метод был добавлен в спецификацию 29 августа 2014 года и не в каждом браузере пока поддерживается.

Устаревшие методы
-----------------

`AudioContext.createJavaScriptNode()` (en-US)

Создаёт объект `JavaScriptNode`, используемый для непосредственной обработки звука в JavaScript. Этот метод устарел и заменён на `AudioContext.createScriptProcessor()` (en-US).

`AudioContext.createWaveTable()` (en-US)

Создаёт объект `WaveTableNode`, для определения периодической волны звукового сигнала. Этот метод устарел и заменён на `AudioContext.createPeriodicWave()` (en-US).

Примеры
-------

Простая декларация аудио-контекста:

```js
var audioCtx = new AudioContext();
```

Кросс-браузерный вариант:

```js
var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioCtx = new AudioContext();

var oscillatorNode = audioCtx.createOscillator();
var gainNode = audioCtx.createGain();
var finish = audioCtx.destination;
// etc.
```

Спецификации
------------

| Specification |
| --- |
| Web Audio API # AudioContext |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Применение Web Audio API (en-US)


Performance - Интерфейсы веб API

Performance
===========

Интерфейс **`Performance`** представляет информацию о производительности страницы с временными метками.

Объект этого типа может быть получен в результате вызова атрибута `Window.performance`, доступного только для чтения.

**Примечание:** Этот интерфейс и его составляющие доступны в фоновых потоках выполнения, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса ещё не документированы (подробнее см. разделы документации Performance Timeline и User Timing). Также заметим, что временные метки производительности относятся к текущему контексту. Если вы создадите метку в основном потоке (или в другом фоновом потоке), то её нельзя будет увидеть в другом фоновом потоке и наоборот.

Свойства
--------

*Интерфейс `Performance` не наследует никаких других свойств.*

`Performance.navigation` (en-US) Только для чтения

Объект `PerformanceNavigation` (en-US), представляющий тип навигации в текущем контексте браузера, как, например, количество перенаправлений, которые нужно пройти, чтобы получить ресурс. Not available in workers.

`Performance.onresourcetimingbufferfull` (en-US)

Колбэк-функция, реализующая интерфейс `EventTarget`, вызываемая при наступлении события `resourcetimingbufferfull`.

`Performance.timing` (en-US) Только для чтения

Объект `PerformanceTiming` (en-US), содержащий информацию о производительности, связанной со временем задержек. Not available in workers.

Методы
------

**Интерфейс `Performance` не наследует других методов**.

`Performance.clearMarks()` (en-US)

Удаляет из буфера записей производительности браузера указанную *временну́ю метку*.

`Performance.clearMeasures()` (en-US)

Удаляет из буфера записей производительности браузера указанное *измерение*.

`Performance.clearResourceTimings()` (en-US)

Удаляет все `записи о производительности` (en-US) со свойством `entryType` (en-US) равным "`resource`" из буфера данных производительности браузера.

`Performance.getEntries()` (en-US)

Возвращает список объектов `PerformanceEntry` (en-US), руководствуясь переданным аргументом *filter.*

`Performance.getEntriesByName()` (en-US)

Возвращает список объектов `PerformanceEntry` (en-US), руководствуясь аргументами *name* (название) and *entry type* (тип записи).

`Performance.getEntriesByType()` (en-US)

Возвращает список объектов `PerformanceEntry` (en-US) переданного, как аргумент, *типа записи*.

`Performance.mark()` (en-US)

Создаёт `временну́ю метку` с заданным именем в *буфере записей производительности.*

`Performance.measure()` (en-US)

Создаёт именованную `временну́ю метку` в буфере записей производительности браузера между двумя определёнными метками (известных как *start mark* (начальная метка) и *end mark* (конечная метка), соответственно).

`Performance.now()`

Возвращает объект `DOMHighResTimeStamp`, представляющий количество миллисекунд, прошедших с начала момента отсчёта.

`Performance.setResourceTimingBufferSize()` (en-US)

Устанавливает размер буфера измерения ресурсов браузера равным указанному числу объектов `записей производительности` (en-US) `типа` (en-US) "`resource`".

`Performance.toJSON()` (en-US)

Возвращает json объект, представляющий объект `Performance.`

Спецификации
------------

| Specification |
| --- |
| High Resolution Time # sec-performance |
| Performance Timeline # extensions-to-the-performance-interface |
| Resource Timing # sec-extensions-performance-interface |
| User Timing # extensions-performance-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Похожие интерфейсы: `PerformanceTiming` (en-US), `PerformanceNavigation` (en-US).


VRFrameData - Интерфейсы веб API

VRFrameData
===========

**Устарело:** Эта возможность была удалена из веб-стандартов. Хотя некоторые браузеры по-прежнему могут поддерживать её, она находится в процессе удаления. Не используйте её ни в старых, ни в новых проектах. Страницы или веб-приложения, использующие её, могут в любой момент сломаться.

**Не стандартно:** Эта возможность не является стандартной и стандартизировать её пока никто не собирается. Не используйте её на сайтах, смотрящих во внешний мир: она будет работать не у всех пользователей. Также могут присутствовать большие несовместимости между реализациями и её поведение может в будущем измениться.

Интерфейс **`VRFrameData`** из WebVR API предоставляет всю необходимую информацию для отображения одного кадра VR-сцены, создаётся с помощью `VRDisplay.getFrameData()` (en-US).

**Примечание:** Это свойство было частью старого WebVR API, который был заменён на WebXR Device API.

Конструктор
-----------

`VRFrameData()` (en-US)
Устарело

Non-standard

Создаёт экземпляр объекта `VRFrameData`.

Свойства экземпляра
-------------------

`VRFrameData.leftProjectionMatrix` (en-US)
Устарело
 Только для чтения
Non-standard

Массив `Float32Array` (en-US), представляющий матрицу 4x4, которая описывает проекцию отображения для левого глаза.

`VRFrameData.leftViewMatrix` (en-US)
Устарело
 Только для чтения
Non-standard

Массив `Float32Array` (en-US), представляющий матрицу 4x4, которая описывает преобразование отображения для левого глаза.

`VRFrameData.pose` (en-US)
Устарело
 Только для чтения
Non-standard

Объект `VRPose` (en-US) с данными о положении устройства `VRDisplay` (en-US) в текущий момент времени `VRFrameData.timestamp` (en-US).

`VRFrameData.rightProjectionMatrix` (en-US)
Устарело
 Только для чтения
Non-standard

Массив `Float32Array` (en-US), представляющий матрицу 4x4, которая описывает проекцию отображения для правого глаза

`VRFrameData.rightViewMatrix` (en-US)
Устарело
 Только для чтения
Non-standard

Массив `Float32Array` (en-US), представляющий матрицу 4x4, которая описывает преобразование отображения для правого глаза.

`VRFrameData.timestamp` (en-US)
Устарело
 Только для чтения
Non-standard

Постоянно увеличивающееся значение отметки времени, представляющее время, когда произошло обновление кадра.

Примеры
-------

Смотрите примеры использования в `VRDisplay.getFrameData()` (en-US).

Спецификации
------------

Это свойство было частью старого WebVR API, который был заменён на WebXR Device API. Больше не планируется сделать его стандартом.

Пока все браузеры не реализуют новые WebXR API (en-US), рекомендуется использовать такие фреймворки как A-Frame, Babylon.js, Three.js или полифил для разработки приложений WebXR, которые будут работать во всех браузерах.

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* WebVR API


Crypto - Интерфейсы веб API

Crypto
======

Интерфейс **`Crypto`** представляет базовые криптографические функции, доступные в общеупотребительном контексте. Он позволяет получить доступ к криптографически сильному генератору случайных чисел и к криптографическим примитивам.

Объект с этим интерфейсом доступен в Web-контексте через свойство `Window.crypto`.

Свойства
--------

*Этот интерфейс реализует свойства, объявленные в `RandomSource` (en-US).*

`Crypto.subtle` (en-US)
Экспериментальная возможность
Только для чтения

Возвращает объект `SubtleCrypto`, предоставляющий доступ к часто используемым криптографическим примитивам, таким как хэширование, цифровые подписи, шифрование и расшифрованные.

Методы
------

*Этот интерфейс реализует методы, объявленные в `RandomSource` (en-US).*

`RandomSource.getRandomValues()`

Заполняет переданные `TypedArray` случайными в криптографическом смысле значениями.

Спецификации
------------

| Specification |
| --- |
| Web Cryptography API # crypto-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Components.utils.importGlobalProperties


CacheStorage - Интерфейсы веб API

CacheStorage
============

Интерфейс **`CacheStorage`** представляет собой хранилище для объектов `Cache`. Он предоставляет главную директорию всех именованных кешей, к которым могут получить доступ `ServiceWorker`, другие типы воркеров или `window` (вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имён соответствующих объектов `Cache`.

`CacheStorage` также позволяет вызвать `CacheStorage.open()` и `CacheStorage.match()`. Используйте `CacheStorage.open()` для получения экземпляров `Cache`. Используйте `CacheStorage.match()` для проверки того, является ли данный `Request` ключом в любом из объектов `Cache`, отслеживаемых объектом `CacheStorage`.

Вы можете получить доступ к `CacheStorage` через глобальное свойство `caches` (en-US).

**Примечание:** CacheStorage всегда возвращает отказ с `SecurityError` для ненадёжных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.

**Примечание:** `CacheStorage.match()` удобный метод. Подобная функциональность сопоставления записей кеша может быть реализован путём открытия вашего кеша с помощью `CacheStorage.open()`, возвращения записей, в ней содержащихся, через `CacheStorage.keys()` (en-US) и сравнения необходимой `CacheStorage.match()`.

Методы
------

`CacheStorage.match()`

Проверяет, является ли данный `Request` ключом в любом из объектов `Cache`, отслеживаемых объектом `CacheStorage`, и возвращает `Promise`, который успешно завершится, когда найдёт совпадение.

`CacheStorage.has()` (en-US)

Возвращает `Promise`, который успешно завершится и вернёт `true,` если объект `Cache` содержит кеш с установленным `cacheName`.

`CacheStorage.open()`

Возвращает `Promise`, который успешно завершится, когда объект `Cache` найдёт необходимый объект с `cacheName` (если такого нет, то создаст новый).

`CacheStorage.delete()` (en-US)

Находит объект `Cache`, соответствующий `cacheName`, и, если такой обнаружен, удаляет объект `Cache` и возвращает `Promise`, завершающийся с `true`. Если объект `Cache` не найдёт, то возвращается `false`.

`CacheStorage.keys()` (en-US)

Возвращает `Promise`, который вернёт массив, содержащий строки, соответствующие всем именованным объектам `Cache`, отслеживаемым `CacheStorage`. Используйте этот метод для прохода по списку всех объектов `Cache`.

Примеры
-------

Фрагмент кода взят с MDN sw-test example (смотри sw-test running live). Этот service worker ожидает старта события `InstallEvent` (en-US), затем запускает `waitUntil` для обработки процесса установки приложения. Он состоит из вызова `CacheStorage.open` для создания нового кеша и затем использует `Cache.addAll` для добавления к нему списка ресурсов.

Во втором блоке кода мы ждём запуска события `FetchEvent`. Мы создаём встроенный ответ:

1. Проверяем, был ли необходимый запрос найден в CacheStorage. Если да, выполняем его.
2. Если нет, получаем запрос от сети, затем так же открываем кеш, созданный в первом блоке, и добавляем клон запроса в него, используя `Cache.put` (en-US) (`cache.put(event.request, response.clone())`.)
3. Если произошла ошибка (например, из-за отсутствия подключения), возвращаем ответ с отказом.

Наконец, возвращаем ответ, был ли встроенный запрос в итоге равнозначным, используя `FetchEvent.respondWith` (en-US).

```js
this.addEventListener("install", function (event) {
  event.waitUntil(
    caches.open("v1").then(function (cache) {
      return cache.addAll([
        "/sw-test/",
        "/sw-test/index.html",
        "/sw-test/style.css",
        "/sw-test/app.js",
        "/sw-test/image-list.js",
        "/sw-test/star-wars-logo.jpg",
        "/sw-test/gallery/bountyHunters.jpg",
        "/sw-test/gallery/myLittleVader.jpg",
        "/sw-test/gallery/snowTroopers.jpg",
      ]);
    }),
  );
});

this.addEventListener("fetch", function (event) {
  var response;
  event.respondWith(
    caches
      .match(event.request)
      .catch(function () {
        return fetch(event.request);
      })
      .then(function (r) {
        response = r;
        caches.open("v1").then(function (cache) {
          cache.put(event.request, response);
        });
        return response.clone();
      })
      .catch(function () {
        return caches.match("/sw-test/gallery/myLittleVader.jpg");
      }),
  );
});
```

Спецификации
------------

| Specification |
| --- |
| Service Workers # cachestorage-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Using Service Workers (en-US)
* `Cache`
* `WorkerGlobalScope.caches` (en-US)


MediaStream - Интерфейсы веб API

MediaStream
===========

Интерфейс **`MediaStream`** представляет поток медиа данных. Поток состоит из нескольких **треков**, таких как видео и аудио треки. Каждый трек является экземпляром `MediaStreamTrack`. MediaStream можно получить либо с помощью конструктора, либо вызовом `MediaDevices.getUserMedia()`.

Некоторые агенты предоставляют подклассы, чтобы привести более точную информацию или расширить функциональность, например `CanvasCaptureMediaStream` (en-US).

Конструктор
-----------

`MediaStream()` (en-US)

Создаёт и возвращает новый объект MediaStream. Можно создать пустой поток, поток, основанный на существующем или содержащий указанный список треков (массив объектов `MediaStreamTrack`).

Свойства
--------

*Этот интерфейс наследует свойства своего родителя,* *`EventTarget`.*

`MediaStream.active` Только для чтения

Возвращает `true`, если `MediaStream` активен, иначе `false`.

`MediaStream.ended` Только для чтения

Возвращает `true`, если достигнут конец потока. Это свойство удалено из спецификации; следует проверять свойство `MediaStreamTrack.readyState` (en-US), которое имеет значение `"ended"` у завершённых треков.

`MediaStream.id` (en-US) Только для чтения

Объект `DOMString`, содержащий 36 символов универсального уникального идентификатора (UUID) потока.

### Обработчики событий

`MediaStream.onaddtrack` (en-US)

Объект `event handler`, содержащий действие, которое должно выполняться, когда случается событие `addtrack` при добавлении нового объекта `MediaStreamTrack`.

`MediaStream.onremovetrack` (en-US)

Объект `event handler`, содержащий действие, которое должно выполняться, когда случается событие `removetrack` при удалении объекта `MediaStreamTrack`.

Методы
------

*Этот интерфейс наследует методы своего родителя,* *`EventTarget`.*

`MediaStream.addTrack()` (en-US)

Сохраняет копию данного объекта `MediaStreamTrack`. Если данный трек добавлялся в `MediaStream` ранее, ничего не происходит.

`MediaStream.clone()` (en-US)

Возвращает точную копию объекта `MediaStream`. Исключение составляет значение `id` (en-US), которое изменится на новое уникальное.

`MediaStream.getAudioTracks()` (en-US)

Возвращает список объектов `MediaStreamTrack`, хранимых в объекте `MediaStream` с атрибутом `kind` имеющим значение `"audio"`. Порядок не определён и может меняться между браузерами, а также между вызовами.

`MediaStream.getTrackById()` (en-US)

Возвращает трек с `trackid` соответствующем данному. Если в метод не передано аргументов или трека с данным ID нет, возвращает `null`. Если несколько треков имеют одинаковый ID, возвращает первый из них.

`MediaStream.getTracks()` (en-US)

Возвращает список всех объектов `MediaStreamTrack`, сохранённых в объекте `MediaStream`, вне зависимости от значения их свойства `kind`. Порядок не определён и может меняться между браузерами, а также между вызовами.

`MediaStream.getVideoTracks()` (en-US)

Возвращает список объектов `MediaStreamTrack`, хранимых в объекте `MediaStream` с атрибутом `kind` имеющим значение `"video"`. Порядок не определён и может меняться между браузерами, а также между вызовами.

`MediaStream.removeTrack()` (en-US)

Удаляет данный объект `MediaStreamTrack`. Если данный трек не сохранён в объекте `MediaStream`, ничего не происходит.

События
-------

`addtrack` (en-US)

 Вызывается при добавлении нового объекта `MediaStreamTrack`.
 Также доступно как свойство `onaddtrack` (en-US).

`removetrack` (en-US)

 Вызывается при удалении объекта `MediaStreamTrack`.
 Также доступно как свойство `onremovetrack` (en-US).

Спецификации
------------

| Specification |
| --- |
| Media Capture and Streams # mediastream |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Использование интерфейса MediaStream
* WebRTC API
* Web Audio API
* `MediaStreamTrack`


CSSValue - Интерфейсы веб API

CSSValue
========

Интерфейс **`CSSValue`** возвращает текущее вычисленное значение CSS-свойства.

Свойства
--------

`CSSValue.cssText` (en-US)

`DOMString` возвращает текущее значение.

`CSSValue.cssValueType` (en-US) Только для чтения

An `unsigned short` representing a code defining the type of the value. Возможные значения:

| Константа | Описание |
| --- | --- |
| `CSS_CUSTOM` | The value is a custom value. |
| `CSS_INHERIT` | Значение унаследовано и `cssText` содержит `"inherit"`. |
| `CSS_PRIMITIVE_VALUE` | The value is a primitive value and an instance of the `CSSPrimitiveValue` (en-US) interface can be obtained by using binding-specific casting methods on this instance of the `CSSValue` interface. |
| `CSS_VALUE_LIST` | The value is a `CSSValue` list and an instance of the `CSSValueList` (en-US) interface can be obtained by using binding-specific casting methods on this instance of the `CSSValue` interface. |

Specifications
--------------

#### No specification found

No specification data found for `api.CSSValue`.
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `CSSPrimitiveValue` (en-US)
* `CSSValueList` (en-US)


SpeechRecognition - Интерфейсы веб API

SpeechRecognition
=================

**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Интерфейс **Распознавание голоса** Web Speech API является интерфейсом контроллера для сервиса распознавания; который так же перехватывает событие `SpeechRecognitionEvent` (en-US), отправленное сервисом распознавания.

Конструктор
-----------

`SpeechRecognition.SpeechRecognition()` (en-US)

Создаёт новый объект `SpeechRecognition` .

Свойства
--------

*`SpeechRecognition` наследует свойства от своего родительского интерфейса, `EventTarget`.*

`SpeechRecognition.grammars` (en-US)

Возвращает и устанавливает коллекцию объектов `SpeechGrammar` грамматики которые будут понятны текущему `SpeechRecognition`.

`SpeechRecognition.lang` (en-US)

Задаёт и возвращает язык текущего `SpeechRecognition`. Если данное свойство не указано по умолчанию, то используется из HTML кода значение атрибута `lang` , или настройки языка агента текущего пользователя.

`SpeechRecognition.continuous` (en-US)

Проверяет возвращается ли непрерывные результаты или вернулся только один. По умолчанию для одиночного значение (`false`.)

`SpeechRecognition.interimResults` (en-US)

Контроллирует, следует ли возвращать промежуточные результаты (`true`) или нет (`false`.) Промежуточные результаты это результаты которые ещё не завершены ( например `SpeechRecognitionResult.isFinal` (en-US) свойство ложно.)

`SpeechRecognition.maxAlternatives` (en-US)

Устанавливает максимальное количество предоставленных результатов `SpeechRecognitionAlternative` (en-US). По умолчанию значение 1.

`SpeechRecognition.serviceURI`

Определяет местоположение службы распознавания речи, используемой текущим SpeechRecognition, для обработки фактического распознавания. По умолчанию используется речевая служба агента пользователя.

### Обработчики событий

`SpeechRecognition.onaudiostart` (en-US)

Вызывается когда пользовательский агент начал захват аудио.

`SpeechRecognition.onaudioend` (en-US)

Вызывается когда пользовательский агент закончил захват аудио.

`SpeechRecognition.onend` (en-US)

Вызывается когда служба распознавания речи отключилась.

`SpeechRecognition.onerror` (en-US)

Вызывается когда произошла ошибка распознавания речи.

`SpeechRecognition.onnomatch` (en-US)

Вызывается, когда служба распознавания речи возвращает окончательный результат без существенного распознавания. Это может включать определённую степень признания `confidence` (en-US) которая не соответствует пороговому значению или превышает его.

`SpeechRecognition.onresult` (en-US)

Вызывается когда возвращает результат — слово или фраза были распознаны положительно, и это было передано обратно в приложение.

`SpeechRecognition.onsoundstart` (en-US)

Вызывается при обнаружении любого звука - не важно, распознана речь или нет.

`SpeechRecognition.onsoundend` (en-US)

Вызывается когда любой звук — распознаваемая речь или нет — перестала распознаваться.

`SpeechRecognition.onspeechstart` (en-US)

Вызывается, когда обнаружен звук, распознаваемый службой распознавания речи как речевой сигнал.

`SpeechRecognition.onspeechend` (en-US)

Вызывается, когда прекращается обнаружение речи, распознанной службой распознавания речи.

`SpeechRecognition.onstart` (en-US)

Вызывается, когда служба распознавания речи начинает обрабатывать входящий звук с намерением распознать грамматики, связанные с текущим распознаванием речи.

Методы
------

*Распознавание речи также наследует методы от своего родительского интерфейса, `EventTarget`.*

`SpeechRecognition.abort()` (en-US)

Останавливает обработку входящего аудио службой распознавания речи и не пытается вернуть `SpeechRecognitionResult` (en-US).

`SpeechRecognition.start()` (en-US)

Запускает службу распознавания речи, прослушивая входящее аудио с целью распознавания грамматик, связанных с текущим распознаванием речи.

`SpeechRecognition.stop()` (en-US)

Останавливает обработку входящего аудио службой распознавания речи и пытается вернуть `SpeechRecognitionResult` (en-US) Используя уже записанный звук.

Примеры
-------

В нашем простом примере Speech color changer , мы создаём новый объект экземпляра `SpeechRecognition` используя этот конструктор `SpeechRecognition()` (en-US) , создание нового `SpeechGrammarList` (en-US), И установить его в качестве грамматики, которая будет распознаваться экземпляром распознавание речи с использованием свойства `SpeechRecognition.grammars` (en-US).

После определения некоторых других значений мы затем устанавливаем их так, чтобы служба распознавания началась когда произошло событие по клику ( `SpeechRecognition.start()` (en-US).) Когда результат был успешно распознан, the `SpeechRecognition.onresult` (en-US) обработчик извлекаем цвет, который был произнесён из события, а затем меняем цвет фона на данный цвет `<html>`.

```js
var grammar =
  "#JSGF V1.0; grammar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;";
var recognition = new SpeechRecognition();
var speechRecognitionList = new SpeechGrammarList();
speechRecognitionList.addFromString(grammar, 1);
recognition.grammars = speechRecognitionList;
//recognition.continuous = false;
recognition.lang = "en-US";
recognition.interimResults = false;
recognition.maxAlternatives = 1;

var diagnostic = document.querySelector(".output");
var bg = document.querySelector("html");

document.body.onclick = function () {
  recognition.start();
  console.log("Ready to receive a color command.");
};

recognition.onresult = function (event) {
  var color = event.results[0][0].transcript;
  diagnostic.textContent = "Result received: " + color;
  bg.style.backgroundColor = color;
};
```

Спецификации
------------

| Specification |
| --- |
| Web Speech API # speechreco-section |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Web Speech API


Fetch API - Интерфейсы веб API

Fetch API
=========

Fetch API предоставляет интерфейс для получения ресурсов (в том числе по сети). Он покажется знакомым любому, кто использовал `XMLHttpRequest`, но новый API является более мощным и гибким набором функций.

Определения и использование
---------------------------

Fetch обеспечивает обобщённое определение объектов `Request` и `Response` (и других вещей, связанных с сетевыми запросами). Это позволит им использоваться везде, где необходимо в будущем, в том числе и для service workers, Cache API и других подобных технологий, которые обрабатывают или изменяют запросы (requests) и ответы (responses), а так же в любых других случаях, которые могут потребовать от вас генерировать свой собственный ответ программно.

Это также предоставляет определение в отношение таких понятий, как CORS и семантика заголовков HTTP origin, заменяя их обособленные определения где бы то ни было.

Чтобы создать запрос и получить данные, используется метод `GlobalFetch.fetch` (en-US). Он реализован во множестве интерфейсов, в том числе в `Window` и `WorkerGlobalScope` (en-US). Это позволяет использовать его практически в любом контексте для получения данных.

Метод `fetch()` принимает один обязательный аргумент — путь к данным, которые вы хотите получить. Он возвращает promise, который разрешается в (`Response`) независимо от того, был ли запрос удачным. Вы можете также передать во втором аргументе необязательный объект с указанием опций (см. `Request`.)

Как только `Response` выполнится успешно, становятся доступными несколько методов для определения тела контента и, как его содержимое должно быть обработано (см. `Body`.)

Вы можете создавать запрос и ответ непосредственно, используя конструкторы `Request()` (en-US) и `Response()`, но маловероятно, что в этом есть необходимость. Напротив, более вероятно, что они будут созданы как результат работы другого API (например, `FetchEvent.respondWith` (en-US) в service workers.)

### Отличия от jQuery

Спецификации `fetch()` отличаются от `jQuery.ajax()` тремя основными способами:

* Промис, возвращённый из `fetch()`, **не будет отвергнут при статусе ошибки HTTP**, даже если ответ является HTTP `404` или `500`. Вместо этого, оно будет разрешаться нормально (со статусом `ok` установленным в `false`), и будет отклоняться только при сбое в сети или если что-то помешало завершению запроса.
* `fetch()` может получать межсайтовые куки-файлы; таким образом вы можете установить межсайтовую сессию используя `fetch`.
* `fetch()` не будет посылать куки-файлы, если только не указано `credentials: 'same-origin'`.

**Примечание:** узнайте больше об использовании Fetch API на Using Fetch и изучите концепции на Fetch basic concepts (en-US).

### Прерывание выборки

Браузеры начали добавлять экспериментальную поддержку для `AbortController` и `AbortSignal` интерфейсов (aka The Abort API), которые позволяют прерывать операции, такие как Fetch и XHR, если они ещё не завершены. Подробности смотрите на страницах интерфейсов.

Fetch интерфейсы
----------------

`GlobalFetch`

Содержит метод `fetch()`, используемый для получения ресурсов.

`Headers` (en-US)

Представляет заголовки запроса/ответа, позволяет запрашивать данные и выполнять различные действия в зависимости от результата.

`Request`

Запрашивает ресурс.

`Response`

Представляет ответ на запрос.

Fetch примесь
-------------

`Body`

Предоставляет методы, относящиеся к телу запроса/ответа, позволяя вам определять content-type и то, как ответ должен быть обработан.

Спецификации
------------

| Specification |
| --- |
| Fetch Standard # fetch-method |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* ServiceWorker API (en-US)
* HTTP access control (CORS) (en-US)
* HTTP
* Fetch полифил
* Fetch базовые понятия (en-US)


ImageData - Интерфейсы веб API

ImageData
=========

Интерфейс **`ImageData`** представляет лежащие в основе пиксельные данные области элемента `<canvas>`. Он создан используя конструктор `ImageData()` (en-US) или метод создания объекта `CanvasRenderingContext2D` ассоциированного с canvas: `createImageData()` (en-US) и `getImageData()`. Он также может быть использован для установки части canvas используя метод `putImageData()`.

Конструкторы
------------

`ImageData()` (en-US)
Экспериментальная возможность

Создаёт ImageData из указанного `Uint8ClampedArray` и из размера изображения которого он содержит. Если массив не указан, то он создаёт изображение чёрного прямоугольника. Обратите внимание, что такой довольно распространённый путь создания подобного объекта в воркерах как `createImageData()` (en-US) там не доступен.

Свойства
--------

`ImageData.data` (en-US) Только для чтения

Возвращает `Uint8ClampedArray` представляющий собой одномерный массив, содержащий данные цветовой модели RGBA, с целыми значениями от 0 до 255 (включительно).

`ImageData.height` (en-US) Только для чтения

Фактическая высота в пикселях объекта `ImageData`.

`ImageData.width` (en-US) Только для чтения

Фактическая ширина в пикселях объекта `ImageData`.

Спецификации
------------

| Specification |
| --- |
| HTML Standard # imagedata |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* `CanvasRenderingContext2D`
* The `<canvas>` element and its associated interface, `HTMLCanvasElement`.


HTMLAudioElement - Интерфейсы веб API

HTMLAudioElement
================

**`HTMLAudioElement`** позволяет получить доступ к элементу `<audio>` и имеет DOM-элемент `HTMLMediaElement`.

Свойства
--------

*Не имеет своих свойств; наследует свойства от родителя `HTMLMediaElement` и от `HTMLElement`.*

Методы
------

*Наследует методы от родителя `HTMLMediaElement` и от `HTMLElement`.*

### Конструктор

#### Синтаксис
```

mySound = new Audio([URLString]);
```

#### Описание

Конструктор audio элемента. Свойство `preload` по умолчанию задано как `auto`, а `src` равно значению аргумента *URLString.* Перед воспроизведением, браузер асинхронно загружает объект в кеш и впоследствии берёт данные оттуда.

Параметры

`URLString` (expected type: `DOMString`; optional)

'src' для 'audio' тега. (URL , с которого должен получать mp3 файл)

### Регулярные методы

| Name & Arguments | Return | Description |
| --- | --- | --- |
| `mozCurrentSampleOffset()`
Non-standard
 | `unsigned long long` | `Отображает текущую нагрузку аудиострима, который был создан методом mozWriteAudio()`. Эта цифра отражает количество сэмплов с момента начала стрима |
| `mozSetup(in PRUint32 channels, in PRUint32 rate)`
Non-standard
 | `void` | Создаёт аудиострима для записи. Вы можете указать такие параметры, как количество каналов (`1` for mono or `2` for stereo), так и частота сэмпла (`44100` for 44.1kHz, for example). |
| `mozWriteAudio(in jsval data)`
Non-standard
 | `unsigned long` | Запускает аудио стрим на текущую частоту. Возвращает количество байтов, которые записаны в стрим |

Спецификации
------------

| Specification |
| --- |
| HTML Standard # htmlaudioelement |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* HTML element implementing this interface: `<audio>`.


Window.performance - Интерфейсы веб API

Window.performance
==================

The Web Performance API allows web pages access to certain functions for measuring the performance of web pages and web applications, including the Navigation Timing (en-US) API and high-resolution time data.

Methods
-------

`performance.mark()` (en-US)

Maps a `DOMHighResTimeStamp` to a specified name representing the amount of milliseconds elapsed since a reference instant.

`performance.now()`

Возвращает `DOMHighResTimeStamp` представляющий количество миллисекунд прошедшее с момента отсчёта.

`measure()`

This method stores the `DOMHighResTimeStamp` duration between two marks along with the associated name (a "measure").

**`getEntriesByType()`**

…

**`getEntriesByType()`**

…

**`getEntriesByName()`**

…

`clearMarks()`

If the markName argument is not specified, this method removes all marks and their associated DOMHighResTimeStamp time values.

If the markName argument is specified, this method removes all DOMHighResTimeStamp time values for the given mark name.

If the markName argument is specified but the specified markName does not exist, this method will do nothing.

Properties
----------

`performance.timing` (en-US)

Is a `PerformanceTiming` (en-US) object containing latency-related performance information.

`performance.navigation` (en-US)

Is a `PerformanceNavigation` (en-US) object representing the type of navigation that occurs in the given browsing context, like the amount of redirections needed to fetch the resource.

performance.memory

A non-standard extension added in Chrome.


HTMLDataElement - Интерфейсы веб API

HTMLDataElement
===============

Интерфейс **`HTMLDataElement`** предоставляет специальные свойства (после чего постоянный `HTMLElement` интерфейс также доступен еме по наследству) для манипуляции `<data>` элементами.

Свойства
--------

*Наследует свойства от родителя, `HTMLElement`.*

| Имя | Тип | Описание |
| --- | --- | --- |
| `value` | `DOMString` | отображает `value` HTML атрибут, содержащий машиночитаемый вид значения элемента. |

Методы
------

*Не имеет специфичных методов; наследует методы от его родителя, `HTMLElement`.*

Спецификации
------------

| Specification |
| --- |
| HTML Standard # htmldataelement |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* HTML-элемент реализующий этот интерфейс: `<data>`.


TouchList - Интерфейсы веб API

TouchList
=========

Интерфейс **`TouchList`** представляет собой список точек касаний сенсорной поверхности. Например, если пользователь коснулся сенсорной поверхности (такой как экран или трекпад) тремя пальцами, соответствующий объект `TouchList` будет содержать по одному объекту `Touch` для каждого пальца, всего три объекта.

Свойства
--------

`TouchList.length` (en-US) Только для чтения

Количество объектов `Touch` в `TouchList`.

Методы
------

`TouchList.identifiedTouch()`

Возвращает первый объект `Touch` из списка, чей идентификатор соответствует заданному значению.

`TouchList.item()` (en-US)

Возвращает объект `Touch`, находящийся в списке по указанному индексу

Пример
------

С примером можно ознакомиться в основной статье про События касаний (тач-события)

Спецификации
------------

| Specification |
| --- |
| Touch Events # touchlist-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* События касаний (тач-события)
* `Document.createTouchList()` (en-US)


CanvasPattern - Интерфейсы веб API

CanvasPattern
=============

**`CanvasPattern`** представляет собой интерфейс непрозрачного объекта, описывающего шаблон, который может быть представлен как картинка, canvas или видео.

**`CanvasPattern`** создаётся с помощью метода `CanvasRenderingContext2D.createPattern()` (en-US).

Может быть использован как `fillStyle` или `strokeStyle`.

Свойства
--------

*Не имеет доступных свойств.*

Методы
------

*Не имеет унаследованных методов.*

`CanvasPattern.setTransform()` (en-US)
Экспериментальная возможность

Используется в качестве `SVGMatrix` (en-US) представления линейной трансформации.

Спецификации
------------

| Specification |
| --- |
| HTML Standard # canvaspattern |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* `CanvasRenderingContext2D.createPattern()` (en-US)
* `<canvas>` тег и связанный с ним интерфейс - `HTMLCanvasElement`


StorageManager - Интерфейсы веб API

StorageManager
==============

**Secure context:** This feature is available only in secure contexts (en-US) (HTTPS), in some or all supporting browsers.

**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

**`StorageManager`** является частью Storage API (en-US) и предоставляет интерфейс для управления правами на хранение данных и для получения объёма данных, доступного для хранения. Доступ к интерфейсу можно получить через `navigator.storage` (en-US) или через `WorkerNavigator.storage` (en-US).

Методы
------

`StorageManager.estimate()` Secure context

Возвращает объект `StorageEstimate` (en-US), который содержит используемый и максимальный объем данных (квоту) для вашего сайта.

`StorageManager.persist()` (en-US) Secure context

Возвращает `Promise`, который принимает значение `true` в случае, когда браузер имеет возможность хранить данные вашего сайта.

`StorageManager.persisted()` (en-US) Secure context

Возвращает `Promise`, который принимает значение `true` в случае, когда сайт получил возможность хранить данные в браузере.

Спецификация
------------

| Specification |
| --- |
| Storage Standard # storagemanager |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


Response - Интерфейсы веб API

Response
========

Интерфейс **`Response`** из Fetch API представляет собой ответ на запрос.

Вы можете создать новый экземпляр объекта `Response` используя конструктор `Response.Response()`, но скорее всего вы столкнётесь с объектом `Response`, как результат какой-нибудь API операции — например, service worker `Fetchevent.respondWith` (en-US), или `fetch()`.

Конструктор
-----------

`Response()`

Создаёт новый экземпляр объекта `Response`.

Свойства
--------

`Response.headers` (en-US) Только для чтения

Объект `Headers` (en-US), который описывает заголовок ответа.

`Response.ok` (en-US) Только для чтения

Булевское значение, которое указывает, выполнился ли запрос успешно или нет (то есть находится ли код ответа в диапазоне `200`–`299`).

`Response.redirected` (en-US) Только для чтения

Указывает, является ли результат запроса перенаправлением.

`Response.status` (en-US) Только для чтения

Код ответа.

`Response.statusText` (en-US) Только для чтения

Строка, соответствующая коду ответа (например, `OK` для кода `200`).

`Response.trailers`

A `Promise` (en-US) resolving to a `Headers` (en-US) object, associated with the response with `Response.headers` (en-US) for values of the HTTP `Trailer` (en-US) header.

`Response.type` (en-US) Только для чтения

The type of the response (e.g., `basic`, `cors`).

`Response.url` (en-US) Только для чтения

The URL of the response.

`Response.useFinalURL`

A boolean indicating whether this is the final URL of the response.

### Body Interface Properties

`Response` implements `Body`, so it also has the following properties available to it:

`Body.body` (en-US) Только для чтения

A simple getter exposing a `ReadableStream` (en-US) of the body contents.

`Body.bodyUsed` (en-US) Только для чтения

Stores a `Boolean` (en-US) that declares whether the body has been used in a response yet.

Методы
------

`Response.clone()` (en-US)

Creates a clone of a `Response` object.

`Response.error()` (en-US)

Returns a new `Response` object associated with a network error.

`Response.redirect()` (en-US)

Creates a new response with a different URL.

### Body Interface Methods

`Response` implements `Body`, so it also has the following methods available to it:

`Body.arrayBuffer()` (en-US)

Takes a `Response` stream and reads it to completion. It returns a promise that resolves with an `ArrayBuffer`.

`Body.blob()` (en-US)

Takes a `Response` stream and reads it to completion. It returns a promise that resolves with a `Blob`.

`Body.formData()` (en-US)

Takes a `Response` stream and reads it to completion. It returns a promise that resolves with a `FormData` object.

`Body.json()` (en-US)

Takes a `Response` stream and reads it to completion. It returns a promise that resolves with the result of parsing the body text as `JSON`, which is a JavaScript value of datatype object, string, etc.

`Body.text()` (en-US)

Takes a `Response` stream and reads it to completion. It returns a promise that resolves with a `USVString` (en-US) (text).

Примеры
-------

### Fetching an image

In our basic fetch example (run example live) we use a simple `fetch()` call to grab an image and display it in an `<img>` element. The `fetch()` call returns a promise, which resolves to the `Response` object associated with the resource fetch operation.

You'll notice that since we are requesting an image, we need to run `Body.blob` (en-US) (`Response` implements Body) to give the response its correct MIME type.

```js
const image = document.querySelector(".my-image");
fetch("flowers.jpg")
  .then(function (response) {
    return response.blob();
  })
  .then(function (blob) {
    const objectURL = URL.createObjectURL(blob);
    image.src = objectURL;
  });
```

You can also use the `Response.Response()` constructor to create your own custom `Response` object:

```js
const response = new Response();
```

### Ajax запрос

Здесь мы с помощью функции doAjax вызываем PHP скрипт, который генерирует JSON строку, и возвращает распарсенный JSON в виде JavaScript объекта. Также реализована простая обработка ошибок.

```js
// Функция, которая делает Ajax запрос
const doAjax = async () => {
    const response = await fetch('Ajax.php'); // Генерируем объект Response
    if (response.ok) {
        const jVal = await response.json(); // Парсим тело ответа
        return Promise.resolve(jVal);
        }
    else
        return Promise.reject('\*\*\* PHP file not found');
    }
}

// Вызываем doAjax и выводим результат в консоль
doAjax().then(console.log).catch(console.log);
```

Specifications
--------------

| Specification |
| --- |
| Fetch Standard # response-class |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* ServiceWorker API (en-US)
* HTTP access control (CORS) (en-US)
* HTTP


PaymentRequest - Интерфейсы веб API

PaymentRequest
==============

**Secure context:** This feature is available only in secure contexts (en-US) (HTTPS), in some or all supporting browsers.

The Payment Request API's (en-US) **`PaymentRequest`** interface the primary access point into the API, and lets web content and apps accept payments from the end user on behalf of the operator of the site or the publisher of the app.

Конструктор
-----------

`PaymentRequest()` (en-US) Secure context

Создаёт новый `PaymentRequest` объект.

Свойства
--------

`PaymentRequest.id` (en-US) Только для чтения Secure context

Уникальный идентификатор для конкретного запроса `PaymentRequest`, который можно задать через `details.id`. Если ничего не задано, по умолчанию используется UUID.

`PaymentRequest.shippingAddress` (en-US) Только для чтения  Secure context

If requested via payment options, returns the shipping address chosen by the user for the purposes of calculating shipping. This property is only populated if the constructor is called with the `requestShipping` flag set to true. Additionally, in some browsers, the parts of the address will be redacted for privacy until the user indicates they are ready to complete the transaction (i.e., they hit "Pay").

`PaymentRequest.shippingOption` (en-US) Только для чтения  Secure context

Возвращает идентификатор выбранного варианта доставки. Это свойство заполняется только в том случае, если конструктор вызывается с флагом `requestShipping`, установленным в значение true.

`PaymentRequest.shippingType` (en-US) Только для чтения  Secure context

Returns the type of shipping used to fulfill the transaction. This will be one of `shipping`, `delivery`, `pickup`, or `null` if a value was not provided in the constructor.

Методы
------

`PaymentRequest.canMakePayment()` (en-US) Secure context

Indicates whether the `PaymentRequest` object can make a payment before calling `show()`.

`PaymentRequest.show()` (en-US) Secure context

Causes the user agent to begin the user interaction for the payment request.

`PaymentRequest.abort()` (en-US) Secure context

Causes the user agent to end the payment request and to remove any user interface that might be shown.

События
-------

`merchantvalidation` (en-US) Secure context

 With some payment handlers (e.g., Apple Pay), this event handler is called to handle the `merchantvalidation` event, which is dispatched when the user agent requires that the merchant validate that the merchant or vendor requesting payment is legitimate.
 Also available using the `onmerchantvalidation` (en-US) event handler property.

`paymentmethodchange` (en-US) Secure context

 With some payment handlers (e.g., Apple Pay), dispatched whenever the user changes payment instrument, like switching from a credit card to a debit card.
 Also available using the `onpaymentmethodchange` (en-US) event handler property.

`shippingaddresschange` (en-US) Secure context

 Срабатывает каждый раз, когда пользователь меняет вариант доставки.
 Также доступно с использованием HTML атрибута `onshippingaddresschange` (en-US).

`shippingoptionchange` (en-US) Secure context

 Срабатывает каждый раз, когда пользователь меняет вариант доставки.
 Также доступно с использованием HTML атрибута `onshippingoptionchange` (en-US).

Спецификации
------------

| Specification |
| --- |
| Payment Request API 1.1 # paymentrequest-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


Web Workers API - Интерфейсы веб API

Web Workers API
===============

**Web Workers** это механизм, который позволяет скрипту выполняться в фоновом потоке, который отделен от основного потока веб-приложения. Преимущество заключается в том, что ресурсоёмкие вычисления могут выполняться в отдельном потоке, позволяя запустить основной (обычно пользовательский) поток без блокировки и замедления.

Концепции и использование Web воркеров
--------------------------------------

Worker (работник, воркер) - это объект созданный при помощи конструктора (например, `Worker()`), который запускает именованный файл JavaScript - этот файл содержит код, который будет запускаться в потоке воркера; воркеры запускаются в другом глобальном контексте отличном от текущего контекста `window`. Этот контекст представлен объектом `DedicatedWorkerGlobalScope` (en-US) в случае специализированных воркеров (стандартные воркеры, которые используются одним скриптом, общие воркеры используют `SharedWorkerGlobalScope` (en-US)).

Вы можете запустить любой код, который вам нравится внутри потока воркера, за некоторыми исключениями. Например, вы не можете напрямую манипулировать DOM внутри воркера или использовать некоторые методы и свойства по умолчанию объекта `window`. Но вы можете использовать большое количество свойств и методов, доступных в `window`, включая WebSockets, и механизм хранения данных такой, как IndexedDB или Data Store API, который доступен только в ОС Firefox. За дополнительной информацией смотрите Функции и классы доступные воркерам. (en-US)

Данные отправляются между потоком воркера и основным потоком через систему сообщений - обе стороны отправляют свои сообщения с помощью метода `postMessage ()` и отвечают на сообщения через обработчик события `onmessage` (сообщение содержится в атрибуте данных события `Message`. Данные копируются, а не используются совместно.

Воркеры могут, в свою очередь, создавать новых воркеров, в этом случае они должны иметь одно и то же происхождение - родительскую страницу. Кроме того, воркеры могут использовать `XMLHttpRequest` для сетевого ввода-вывода, за исключением того, что атрибуты `responseXML` и `channel` на XMLHttpRequest всегда возвращают значение `null`.

В дополнение к специализированным существуют и другие виды воркеров:

* Совместные воркеры - это воркеры, которые могут использоваться несколькими скриптами совместно, работающими в разных окнах, IFrames и т.д. в пределах одного домена, что и воркер. Они немного сложнее, чем специализированные воркеры - скрипты должны связываться через активный порт. Подробнее см. `SharedWorker`.
* ServiceWorkers (en-US) по сути действуют как прокси-серверы, которые находятся между веб-приложениями, а также браузером и сетью (если доступны). Помимо прочего они предназначены для создания эффективного автономного взаимодействия, перехвата сетевых запросов и принятия соответствующих мер на основе доступности сети и обновления данных на сервере. Они также позволят доступ к push-уведомлениям и API-интерфейсам фоновой синхронизации.
* Воркеры в Chrome - это воркеры специального типа Firefox, которые вы можете использовать, если вы разрабатываете надстройки и хотите использовать воркеры в расширениях и иметь доступ к js-ctypes в вашем воркере. Смотрите также `ChromeWorker`.
* Audio Workers(аудио воркеры) обеспечивают возможность прямой обработки аудиозаписей в рамках веб-контекста воркера.

**Примечание:** В соответствии с Web workers Spec, события ошибок воркеров не должны "всплывать" (смотрите Firefox bug 1188141. Такое поведение было реализовано в Firefox 42.

Интерфейсы Web воркера
----------------------

`AbstractWorker` (en-US)

Абстрактные свойства и методы общие для всех типов воркеров (т.е. `Worker` или `SharedWorker`).

`Worker`

Представляет поток исполнения воркера, позволяющий передавать сообщения текущему коду воркера.

`SharedWorker`

Представляет конкретный вид воркера, к которому можно получить доступ из нескольких контекстов, будь то несколько окон, iframe или даже воркеров.

`WorkerGlobalScope` (en-US)

Represents the generic scope of any worker (doing the same job as `Window` does for normal web content). Different types of worker have scope objects that inherit from this interface and add more specific features.

`DedicatedWorkerGlobalScope` (en-US)

Represents the scope of a dedicated worker, inheriting from `WorkerGlobalScope` (en-US) and adding some dedicated features.

`SharedWorkerGlobalScope` (en-US)

Represents the scope of a shared worker, inheriting from `WorkerGlobalScope` (en-US) and adding some dedicated features.

`WorkerNavigator` (en-US)

Представляет идентификатор и состояние пользовательского агента (клиента).

Примеры
-------

Мы создали пару простых демонстрационных программ чтобы показать основы использования:

* Базовый пример отдельного воркера (запускает отдельного воркера).
* Базовый пример разделяемого воркера (запускает разделяемого воркера).

Больше информации о том, как работают эти демонстрационные программы, вы можете найти в статье Использование Web воркеров.

Спецификации
------------

| Specification |
| --- |
| HTML Living Standard # workers |

Смотрите также
--------------

* Использование Web воркеров (en-US)
* Worker Interface
* Интерфейс SharedWorker
* ServiceWorker API (en-US)
* Функции и классы доступные воркерам (en-US)
* Продвинутые концепции и примеры (en-US)
* ChromeWorker: для использования воркеров в привелегированном/chrome коде


Web Speech API - Интерфейсы веб API

Web Speech API
==============

Web Speech API позволяет взаимодействовать с голосовыми интерфейсами в ваших веб приложениях. Web Speech API состоит из двух частей: SpeechSynthesis (Текст-в-Речь), и SpeechRecognition (Асинхронное распознавание речи)

Концепции и использование Web Speech
------------------------------------

Web Speech API позволяет веб приложениям управлять голосовыми данными. Существует два компонента к этому API:

* Распознавание голоса. Доступ обеспечивается через `SpeechRecognition` интерфейс, который в свою очередь обеспечивает возможность распознавать текст из входящего аудио потока (обычно через устройство распознавания речи в устройстве по умолчанию) и отвечать соответственно. Воспользовавшись конструктором интерфейса вы можете создать новый `SpeechRecognition` объект, у которого есть ряд событий для обнаружения начала речи через микрофон устройства. `SpeechGrammar` интерфейс предоставляет контейнер для определённого набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью JSpeech Grammar Format (**JSGF**.)
* Доступ к синтезу речи осуществляется с помощью `SpeechSynthesis` (en-US) интерфейса, компонент text-to-speech позволяет приложениям прочесть свой текстовый контент (обычно через дефолтный синтезатор речи устройства). В `SpeechSynthesisVoice` (en-US) объектах есть различные типы голоса, и различным частям текста можно назначать `SpeechSynthesisUtterance` объекты. Можно начать воспроизведение передав их методу `SpeechSynthesis.speak()` (en-US).

Для большей информации по использованию этих фич, смотрите Using the Web Speech API.

Интерфейсы Web Speech API
-------------------------

### Распознавание речи

`SpeechRecognition`

The controller interface for the recognition service; this also handles the `SpeechRecognitionEvent` (en-US) sent from the recognition service.

`SpeechRecognitionAlternative` (en-US)

Представляет одно слово которое было распознано службой распознавания голоса.

`SpeechRecognitionError` (en-US)

Представляет сообщения об ошибках из службы распознавания.

`SpeechRecognitionEvent` (en-US)

The event object for the `result` and `nomatch` events, and contains all the data associated with an interim or final speech recognition result.

`SpeechGrammar`

Слова или шаблоны слов которые мы хотим чтобы служба распознавания распознала.

`SpeechGrammarList` (en-US)

Представляет список объектов `SpeechGrammar`.

`SpeechRecognitionResult` (en-US)

Представляет одно распознанное совпадение, которое может содержать несколько объектов `SpeechRecognitionAlternative` (en-US).

`SpeechRecognitionResultList` (en-US)

Represents a list of `SpeechRecognitionResult` (en-US) objects, or a single one if results are being captured in `continuous` (en-US) mode.

### Синтезирование речи

`SpeechSynthesis` (en-US)

The controller interface for the speech service; this can be used to retrieve information about the synthesis voices available on the device, start and pause speech, and other commands besides.

`SpeechSynthesisErrorEvent` (en-US)

Contains information about any errors that occur while processing `SpeechSynthesisUtterance` objects in the speech service.

`SpeechSynthesisEvent` (en-US)

Contains information about the current state of `SpeechSynthesisUtterance` objects that have been processed in the speech service.

`SpeechSynthesisUtterance`

Represents a speech request. It contains the content the speech service should read and information about how to read it (e.g. language, pitch and volume.)

`SpeechSynthesisVoice` (en-US)

Represents a voice that the system supports. Every `SpeechSynthesisVoice` has its own relative speech service including information about language, name and URI.

`Window.speechSynthesis` (en-US)

Specced out as part of a `[NoInterfaceObject]` interface called `SpeechSynthesisGetter`, and Implemented by the `Window` object, the `speechSynthesis` property provides access to the `SpeechSynthesis` (en-US) controller, and therefore the entry point to speech synthesis functionality.

Примеры
-------

Web Speech API репозиторий на GitHub содержит примеры, показывающие распознавание и синтез речи.

Спецификации
------------

| Specification |
| --- |
| Web Speech API |

Совместимость с браузерами
--------------------------

### api.SpeechRecognition

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.SpeechSynthesis

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Using the Web Speech API
* SitePoint article
* HTML5Rocks article
* Demo [aurelio.audero.it]


Navigator - Интерфейсы веб API

Navigator
=========

Интерфейс `Navigator` представляет состояние и особенности пользовательского агента. Он позволяет скриптам запрашивать их и самостоятельно регистрироваться для выполнения некоторых действий.

Объект `Navigator` можно получить с помощью доступного только для чтения свойства `window.navigator`.

Свойства экземпляра
-------------------

*Не наследует свойства.*

### Стандартизированные

`Navigator.appCodeName` Только для чтения
Экспериментальная возможность

Возвращает внутренний "код" текущего браузера. Не полагайтесь на это свойство для получения правильного значения.

`Navigator.appName` Только для чтения
Экспериментальная возможность

Возвращает `DOMString` с официальным названием браузера. Не полагайтесь на это свойство для получения правильного значения.

`Navigator.appVersion` Только для чтения
Экспериментальная возможность

Возвращает версию браузера как `DOMString`. Не полагайтесь на это свойство для получения правильного значения.

`Navigator.getBattery` Только для чтения

Возвращает `BatteryManager` объект, который вы можете использовать для получения информации о статусе заряда аккумулятора.

`Navigator.connection` Только для чтения
Экспериментальная возможность

Предоставляет `Connection` (en-US) с информацией о сетевом подключении устройства.

`NavigatorGeolocation.geolocation` (en-US) Только для чтения

Возвращает `Geolocation` объект, позволяющий получить доступ к местоположению устройства.

`Navigator.javaEnabled()`
Устарело

Возвращает всегда `false`.

`Navigator.language` Только для чтения

Возвращает `DOMString`, представляющий предпочитаемый пользователем язык, как правило это язык пользовательского интерфейса браузера. Значение `null` возвращается, когда язык неизвестен.

`Navigator.languages` Только для чтения

Возвращает массив `DOMString`, представляющий собой языки, известные пользователю, в порядке предпочтения.

`Navigator.mimeTypes` Только для чтения
Экспериментальная возможность

Возвращает `MimeTypeArray` (en-US) листинг MIME типов, поддерживаемых браузером.

`Navigator.onLine` (en-US) Только для чтения

Возвращает булево значение, показывающее имеет ли браузер подключение к сети.

`Navigator.oscpu`

Возвращает строку, показывающую имеющуюся операционную систему.

`Navigator.platform` Только для чтения
Экспериментальная возможность

Возвращает строку, показывающую платформу браузера. Не полагайтесь на эту функцию, чтобы получить нужное значение.

`Navigator.plugins` Только для чтения
Экспериментальная возможность

Возвращает `PluginArray` (en-US) листинг плагинов, установленных в браузере.

`Navigator.product` Только для чтения
Экспериментальная возможность

Всегда возвращает `'Gecko'`, в любом браузере. Это свойство сохраняется только для целей совместимости.

`Navigator.userAgent` (en-US) Только для чтения

Возвращает строку агента пользователя для данного браузера.

`Navigator.serviceWorker` Только для чтения

Возвращает `ServiceWorkerContainer` объект, который обеспечивает доступ к регистрации, удалению, обновлению и связи с `ServiceWorker` объектами для соответствующего документа.

### Не стандартизированные

`navigator.buildID`
Non-standard

Возвращает идентификатор сборки браузера(например: "2006090803").

`Navigator.cookieEnabled`
Non-standard

Возвращает логическое значение (boolean), показывающее включены ли куки в браузере или нет.

`navigator.doNotTrack`
Non-standard

Значение сообщает о предпочтении пользователя не отслеживать его действия. Когда это значение "да", ваш веб сайт или приложение не должны отслеживать действия пользователя.

`navigator.productSub`
Non-standard

Возвращает номер сборки текущего браузера(например: "20060909" ).

`navigator.securitypolicy`
Non-standard

Возвращает пустую строку. В Netscape 4.7x, возвращает "US & CA domestic policy" или "Export policy".

`navigator.standalone`
Non-standard

Возвращает логическое значение (boolean), показывающее работает ли браузер в автономном режиме. Доступно только в IOS Safari от Apple.

`navigator.vendor`
Non-standard

Возвращает имя поставщика текущего браузера (например, "Netscape6").

`navigator.vendorSub`
Non-standard

Возвращает номер версии поставщика (например, "6.1").

Методы экземпляра
-----------------

*Не наследует методы.*

### Стандартизированные

`NavigatorUserMedia.getUserMedia()`

После запроса разрешения у пользователя возвращает аудио или видео поток, взаимодействующий с камерой или микрофоном на локальном компьютере.

`navigator.registerProtocolHandler`

Разрешает веб-сайту зарегистрировать себя в качестве возможного обработчика для данного протокола.

`Navigator.taintEnabled()`
Устарело

Экспериментальная возможность

Возвращает `false`. JavaScript taint/untaint функции отключены в JavaScript 1.2.

`Navigator.vibrate()`

Причина вибрации устройства с поддержкой её. Не делает ничего, если нет поддержки вибрации.

### Не стандартизированные

`navigator.mozIsLocallyAvailable`
Non-standard

Позволяет коду проверить, есть ли документ в данном URI без использования сети.

`navigator.mozPay`
Non-standard

Разрешает оплату в приложении.

`navigator.preference`
Non-standard

Устанавливает предпочтение пользователя. Этот метод доступен только для привилегированного кода и является устаревшим; вы должны использовать вместо него XPCOM Preferences API.

`navigator.requestWakeLock`
Non-standard

Запрос установки блокировки пробуждения для ресурса. Блокировка пробуждения препятствует определённой части устройства включится автоматически.

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-navigator-object |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


BackgroundFetchRecord - Интерфейсы веб API

BackgroundFetchRecord
=====================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Интерфейс **`BackgroundFetchRecord`** Background Fetch API представляет отдельный запрос и ответ.

`BackgroundFetchRecord` создаётся методом `BackgroundFetchManager.fetch()`, поэтому для этого интерфейса нет конструктора.

Существует только один `BackgroundFetchRecord` для каждого ресурса, запрошенного функцией `fetch()`.

Свойства
--------

`request` Только для чтения
Экспериментальная возможность

Возвращает `Request`.

`responseReady` Только для чтения
Экспериментальная возможность

Возвращает промис, результатом обработки которого будет `Response`.

Примеры
-------

В этом примере отдельный `BackgroundFetchRecord` возвращается с использованием `BackgroundFetchManager.fetch()`. `BackgroundFetchRecord.request` и `BackgroundFetchRecord.responseReady` выводятся в консоль.

```js
bgFetch.match("/ep-5.mp3").then(async (record) => {
  if (!record) {
    console.log("No record found");
    return;
  }

  console.log(`Запрос`, record.request);
  const response = await record.responseReady;
  console.log(`Ответ`, response);
});
```

Спецификации
------------

| Specification |
| --- |
| Background Fetch # background-fetch-record-interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


GeolocationPosition - Интерфейсы веб API

GeolocationPosition
===================

**Secure context:** This feature is available only in secure contexts (en-US) (HTTPS), in some or all supporting browsers.

Интерфейс **`GeolocationPosition`** представляет положение соответствующего устройства в данный момент времени. Положение, представленное объектом `GeolocationCoordinates`, отражает двумерное положение устройства на сфероиде, представляющем землю, а также его высоту и скорость..

Свойства
--------

*Интерфейс `GeolocationPosition` не наследует свойства*.

`GeolocationPosition.coords` (en-US) Только для чтения  Secure context

Возвращает объект `GeolocationCoordinates` определяющий текущую локацию.

`GeolocationPosition.timestamp` (en-US) Только для чтения  Secure context

Возвращает `DOMTimeStamp` (en-US), представляющий время, в которое была получена локация.

Методы
------

**Интерфейс *`GeolocationPosition`*** не имеет и не наследует методы.

Спецификации
------------

| Specification |
| --- |
| Geolocation API # position\_interface |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Using the Geolocation API (en-US)
* `Geolocation`


Push API - Интерфейсы веб API

Push API
========

**Push API** предоставляет веб-приложениям возможность принимать сообщения с сервера независимо от того, запущено веб-приложение прямо сейчас или нет. Что в свою очередь позволяет разработчикам оперативно уведомлять пользователей, которые разрешили присылать себе уведомления о новом контенте.

Об использовании Push API
-------------------------

>
> **Обратите внимание:** При использовании PushManager-подписок жизненно важно защищать запросы от CSRF/XSRF-атак в вашем приложении. Подробнее читайте по ссылкам:
>
>
> * Cross-Site Request Forgery (CSRF) Prevention Cheat Sheet
> * Preventing CSRF and XSRF Attacks
>
>
>

Для получения сообщений от сервера у приложения должен быть активированный сервис-воркер. После активации у сервис-воркера появится возможность подписаться на канал для получения сообщений, используя `PushManager.subscribe()`.

В результате подписки будет получен объект `PushSubscription` (en-US) со всей необходимой информацией, которая может потребоваться приложению для обращения за сообщениями на сервер: URL-адрес и ключ шифрования.

После подписки сервис-воркеру можно добавить обработчик `ServiceWorkerGlobalScope.onpush` для получения сообщений от сервера. В качестве реакции на сообщение можно, например, обращаться к серверу за данными и показывать пользователю уведомление с помощью метода `ServiceWorkerRegistration.showNotification()`.

Для сервис-воркера каждая подписка уникальна, а её URL-адрес — уникальная специальная ссылка. Поскольку это всё, что нужно для обращения к серверу, данную ссылку нужно держать в секрете, иначе любое другое приложение сможет воспользоваться вашим сервером.

Для получения push-сообщений сервис-воркеру требуются ресурсы, что может влиять, например, на расход батареи. Во всех браузерах эти проблемы решаются по-разному, какого-то единого стандарта на этот счёт нет. Например, браузер Firefox ограничивает количество сообщений, которое можно отправить приложению, однако сообщения с показом уведомления в этот лимит не попадают. В Chrome таких ограничений нет.

Интерфейсы
----------

`PushEvent` (en-US)

Описывает действие, направленное в глобальную область видимости (en-US) `сервис-воркера`. Включает информацию, переданную сервером `подписчикам` (en-US).

`PushManager`

Предоставляет возможность подписаться на сообщения от сторонних серверов и получить URL-адрес для отправки push-уведомлений.

`PushMessageData` (en-US)

Содержит данные, отправленные сервером, и методы для управления ими.

`PushSubscription` (en-US)

Предоставляет возможность получить URL-адрес подписки, а также содержит метод для отписки.

`PushSubscriptionOptions` (en-US)

Описывает параметры конкретной подписки.

Методы сервис-воркера для работы c Push API
-------------------------------------------

Спецификация Push API расширяет возможности сервис-воркеров для работы с push-сообщениями: позволяет отслеживать и реагировать на такие сообщения, а также следить за изменениями в подписках.

`ServiceWorkerRegistration.pushManager` Только для чтения

Позволяет обратиться к интерфейсу по управлению подписками `PushManager`, в том числе для добавления подписки, получения информации о текущей подписке, а также позволяет узнать о возможности отправки сообщений. Работа с push-сообщениями начинается с этого свойства сервис-воркера.

`ServiceWorkerGlobalScope.onpush`

Обработчик событий, срабатывает всякий раз, когда происходит событие `push`; то есть при получении push-сообщений от сервера.

`ServiceWorkerGlobalScope.onpushsubscriptionchange`

Обработчик событий, срабатывает всякий раз, когда происходит событие `pushsubscriptionchange`; будет полезен в ситуациях, когда подписка была просрочена или вот-вот будет просрочена (при условии, что для подписки был указан срок действия).

Примеры
-------

На сайте-инструкции по работе с сервис-воркерами от Mozilla вы найдёте множество примеров использования **Push API**.

Спецификации
------------

| Спецификация |
| --- |
| Push API |

Совместимость с браузерами
--------------------------

### api.PushEvent

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.PushMessageData

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Sending VAPID identified WebPush Notifications via Mozilla's Push Service
* Web Push Notifications: Timely, Relevant, and Precise, Joseph Medley
* Service Worker API


SVGAElement - Интерфейсы веб API

SVGAElement
===========

**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Интерфейс **`SVGAElement`**`предоставляет доступ к свойствам``<a>` элемента а также к методам манипулирования ими.

Интерфейс наследует следующие интерфейсы: `SVGElement` (en-US), `SVGURIReference` (en-US), `SVGTests`, `SVGLangSpace`, `SVGExternalResourcesRequired`, `SVGStylable` (en-US), `SVGTransformable`.

Свойства
--------

*Этот интерфейс также наследует свойства от его родителя, `SVGGraphicsElement` и реализует свойства из `SVGURIReference` (en-US) и `HTMLHyperlinkElementUtils`.*

`SVGAElement.download`

См. `HTMLAnchorElement.download` (en-US).

`SVGAElement.href`

См. `HTMLAnchorElement.href`.

`SVGAElement.hreflang`

Является `DOMString`, который отражает атрибут `hreflang`, указывающий язык связанного ресурса.

`SVGAElement.ping`

Является `DOMString`, отражая атрибут ping, содержащий список URL-адресов, разделённых пробелами, к которым, когда выполняется гиперссылка, `POST` запрос с телом `PING` будет отправлен браузером (в фоновом режиме). Обычно используется для отслеживания.

`SVGAElement.referrerPolicy`

См. `HTMLAnchorElement.referrerPolicy` (en-US).

`SVGAElement.rel`

См. `HTMLAnchorElement.rel` (en-US).

`SVGAElement.relList`

См. `HTMLAnchorElement.relList` (en-US).

`SVGAElement.target` Только для чтения

соответствует атрибуту `target (en-US)` данного элемента.

`SVGAElement.text`

Является `DOMString` синонимом свойства `Node.textContent`.

`SVGAElement.type`

 Is a that reflects theattribute, indicating the MIME type of the linked resource.
 Является `DOMString`, который отражает атрибут `type` , указывающий тип MIME связанного ресурса.

Методы
------

*Этот интерфейс не имеет методов, но наследует методы от его родителя, `SVGGraphicsElement`.*

Пример
------

В примере ниже, атрибуту `target (en-US)` элемента `<a>` присвоено значение *\_blank* и при клике по ссылке, при соблюдении условий, выведется сообщение в модальном окне.

```js
var linkRef = document.querySelector("a");
linkRef.target = "\_self";

linkRef.onclick = function () {
  if (linkRef.target == "\_blank") {
    alert("BLANK !");
    linkRef.target = "\_self";
  } else alert("SORRY! not \_blank");
};
```

Спецификации
------------

| Specification |
| --- |
| Scalable Vector Graphics (SVG) 2 # InterfaceSVGAElement |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* SVG `<a>` элемент


Background Fetch API - Интерфейсы веб API

Background Fetch API
====================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

**Background Fetch API** предоставляет способ управления загрузками, которые могут занимать продолжительное время, например фильмы, аудиофайлы и программное обеспечение.

Концепт и использование
-----------------------

Довольно часто, когда веб-приложение требует от пользователя скачивания больших файлов, это создаёт проблему, поскольку пользователю необходимо оставаться подключённым к странице до завершения скачивания. Если же соединение пропадает, например пользователь закрывает вкладку или уходит со страницы, то скачивание прерывается.

`Background Synchronization API` (en-US) даёт сервис-воркерам возможность отложить обработку до тех пор, пока пользователь не подключится; однако такой подход не может быть использован для длительных задач, таких как скачивание больших файлов. Background Sync требует чтобы сервис-воркер оставался активным до завершения запроса, но для экономии заряда батареи и предотвращения возникновения нежелательных задач, выполняемых в фоновом режиме, браузер в какой-то момент завершит задачу.

Background Fetch API решает это проблему. Он позволяет веб-разработчику сообщать браузеру, что некоторые запросы нужно выполнять в фоновом режиме, например, когда пользователь нажимает на кнопку "скачать видеофайл". Затем браузер выполняет запрос "видимым" для пользователя способом, отображая прогресс и предоставляя способ отменить скачивание. После завершения загрузки браузер открывает сервис-воркер, и ваше приложение может, по необходимости, сделать что-то с ответом.

Background Fetch API позволит выполнить запрос, если пользователь начал процесс в автономном режиме. Как только соединение будет установлено, Background Fetch API начнёт скачивание. Если пользователь переходит в автономный режим, процесс приостанавливается до тех пор, пока пользователь не подключится к сети снова.

Интерфейсы
----------

`BackgroundFetchManager`

Коллекция пар ключ-значение, где ключи это идентификаторы фоновых запросов, а значения - объекты `BackgroundFetchRegistration`.

`BackgroundFetchRegistration`

Представляет фоновый запрос.

`BackgroundFetchRecord`

Представляет отдельный запрос и ответ.

`BackgroundFetchEvent`

Тип события, который передаётся в `onbackgroundfetchabort` и `onbackgroundfetchclick`.

`BackgroundFetchUpdateUIEvent`

Тип события, который передаётся в `onbackgroundfetchsuccess` и `onbackgroundfetchfail`.

Примеры
-------

Перед использованием Background Fetch проверьте совместимость с браузерами.

```css
if (!("BackgroundFetchManager" in self)) {
  // Обеспечьте резервный способ загрузки
}
```

Использование Background Fetch требует зарегистрированного сервис-воркера. Затем вызов `backgroundFetch.fetch()` инициирует запрос. Этот вызов возвращает промис, результатом обработки которого будет `BackgroundFetchRegistration`.

Background Fetch может запрашивать несколько файлов. В нашем примере происходит запрос MP3 и JPEG файлов. Это позволяет скачать сразу пакет файлов, которые пользователь видит как один элемент (например, подкаст и обложку).

```js
navigator.serviceWorker.ready.then(async (swReg) => {
  const bgFetch = await swReg.backgroundFetch.fetch(
    "my-fetch",
    ["/ep-5.mp3", "ep-5-artwork.jpg"],
    {
      title: "Эпизод 5: Интересные дела.",
      icons: [
        {
          sizes: "300x300",
          src: "/ep-5-icon.png",
          type: "image/png",
        },
      ],
      downloadTotal: 60 \* 1024 \* 1024,
    },
  );
});
```

Вы можете найти демонстрационное приложение, которое реализует Background Fetch здесь.

Спецификации
------------

| Specification |
| --- |
| Background Fetch  |

Совместимость с браузерами
--------------------------

### api.BackgroundFetchManager

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.BackgroundFetchRegistration

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.BackgroundFetchRecord

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Представляем Background Fetch (англ.)
* Background Fetch - HTTP 203 (англ.)


Глобальное свойство caches - Интерфейсы веб API

Глобальное свойство caches
==========================

**Примечание:** Эта возможность доступна в Web Workers

 Доступное только для чтения глобальное свойство **`caches`** возвращает объект `CacheStorage` связанный с текущим контекстом.
 С помощью этого объекта можно реализовать хранение ресурсов в автономном режиме и генерацию индивидуальных ответов на запросы.

**Secure context:** This feature is available only in secure contexts (en-US) (HTTPS), in some or all supporting browsers.

Значение
--------

Объект `CacheStorage`.

Примеры
-------

Данный пример показывает как использовать кеш в контексте service worker для хранения в автономном режиме.

```js
this.addEventListener("install", (event) => {
  event.waitUntil(
    caches
      .open("v1")
      .then((cache) =>
        cache.addAll([
          "/",
          "/index.html",
          "/style.css",
          "/app.js",
          "/image-list.js",
          "/star-wars-logo.jpg",
          "/gallery/",
          "/gallery/bountyHunters.jpg",
          "/gallery/myLittleVader.jpg",
          "/gallery/snowTroopers.jpg",
        ]),
      ),
  );
});
```

Спецификации
------------

| Specification |
| --- |
| Service Workers # self-caches |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Также смотрите
--------------

* Service Workers (en-US)
* Web Workers
* `CacheStorage`
* `Cache`