xhr что это за формат

XMLHttpRequest

XMLHttpRequest – это встроенный в браузер объект, который даёт возможность делать HTTP-запросы к серверу без перезагрузки страницы.

Несмотря на наличие слова «XML» в названии, XMLHttpRequest может работать с любыми данными, а не только с XML. Мы можем загружать/скачивать файлы, отслеживать прогресс и многое другое.

В современной веб-разработке XMLHttpRequest используется по трём причинам:

Основы

XMLHttpRequest имеет два режима работы: синхронный и асинхронный.

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

Чтобы сделать запрос, нам нужно выполнить три шага:

Этот метод устанавливает соединение и отсылает запрос к серверу. Необязательный параметр body содержит тело запроса.

Три наиболее используемых события:

Вот полный пример. Код ниже загружает /article/xmlhttprequest/example/load с сервера и сообщает о прогрессе:

После ответа сервера мы можем получить результат запроса в следующих свойствах xhr :

Мы можем также указать таймаут – промежуток времени, который мы готовы ждать ответ:

Тип ответа

К примеру, давайте получим ответ в формате JSON:

Состояния запроса

Список всех состояний, указанных в спецификации:

Изменения в состоянии объекта запроса генерируют событие readystatechange :

Вы можете наткнуться на обработчики события readystatechange в очень старом коде, так уж сложилось исторически, когда-то не было событий load и других. Сегодня из-за существования событий load/error/progress можно сказать, что событие readystatechange «морально устарело».

Отмена запроса

Если мы передумали делать запрос, можно отменить его вызовом xhr.abort() :

Синхронные запросы

Выглядит, может быть, и неплохо, но синхронные запросы используются редко, так как они блокируют выполнение JavaScript до тех пор, пока загрузка не завершена. В некоторых браузерах нельзя прокручивать страницу, пока идёт синхронный запрос. Ну а если же синхронный запрос по какой-то причине выполняется слишком долго, браузер предложит закрыть «зависшую» страницу.

Из-за всего этого синхронные запросы используют очень редко. Мы более не будем рассматривать их.

HTTP-заголовки

XMLHttpRequest умеет как указывать свои заголовки в запросе, так и читать присланные в ответ.

Для работы с HTTP-заголовками есть 3 метода:

XMLHttpRequest не разрешено изменять их ради безопасности пользователей и для обеспечения корректности HTTP-запроса.

Ещё одной особенностью XMLHttpRequest является то, что отменить setRequestHeader невозможно.

Если заголовок определён, то его нельзя снять. Повторные вызовы лишь добавляют информацию к заголовку, а не перезаписывают его.

Возвращает значение заголовка ответа name (кроме Set-Cookie и Set-Cookie2 ).

Заголовки возвращаются в виде единой строки, например:

Таким образом, если хочется получить объект с парами заголовок-значение, нам нужно задействовать немного JS.

Вот так (предполагается, что если два заголовка имеют одинаковое имя, то последний перезаписывает предыдущий):

POST, FormData

Чтобы сделать POST-запрос, мы можем использовать встроенный объект FormData.

Если нам больше нравится формат JSON, то используем JSON.stringify и отправляем данные как строку.

Прогресс отправки

Событие progress срабатывает только на стадии загрузки ответа с сервера.

Если мы отправляем что-то большое, то нас гораздо больше интересует прогресс отправки данных на сервер. Но xhr.onprogress тут не поможет.

Примеры обработчиков для этих событий:

Пример из реальной жизни: загрузка файла на сервер с индикацией прогресса:

Запросы на другой источник

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

Детали по заголовкам, которые при этом необходимы, смотрите в главе fetch.

Итого

Типичный код GET-запроса с использованием XMLHttpRequest :

Событий на самом деле больше, в современной спецификации они все перечислены в том порядке, в каком генерируются во время запроса:

Наиболее часто используют события завершения загрузки ( load ), ошибки загрузки ( error ), или мы можем использовать единый обработчик loadend для всего и смотреть в свойствах объекта запроса xhr детали произошедшего.

Источник

СОДЕРЖАНИЕ

История

Internet Explorer версий 5 и 6 не определял идентификатор объекта XMLHttpRequest на своих языках сценариев, поскольку сам идентификатор XMLHttpRequest не был стандартом на момент их выпуска. Обратная совместимость может быть достигнута за счет обнаружения объекта, если идентификатор XMLHttpRequest не существует. Microsoft добавила идентификатор объекта XMLHttpRequest к своим языкам сценариев в Internet Explorer 7.0, выпущенном в октябре 2006 года.

Стандарты

HTTP-запрос

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

Открыт метод

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

SetRequestHeader метод

После успешной инициализации запроса метод setRequestHeader объекта XMLHttpRequest может быть вызван для отправки заголовков HTTP с запросом.

Посыла метод

Чтобы отправить HTTP-запрос, необходимо вызвать метод send XMLHttpRequest. Этот метод принимает один параметр, содержащий контент, который будет отправлен с запросом.

Onreadystatechange слушатель события

Если метод open объекта XMLHttpRequest был вызван с третьим параметром, для которого задано значение true для асинхронного запроса, прослушиватель событий onreadystatechange будет автоматически вызываться для каждого из следующих действий, которые изменяют свойство readyState объекта XMLHttpRequest.

Изменения состояния работают так:

Слушатель будет реагировать только на изменения состояния, которые происходят после того, как он определен. Чтобы обнаружить состояния 1 и 2, слушатель должен быть определен до вызова метода open. Открытый метод должен быть вызван до вызова метода отправки.

HTTP-ответ

После успешного и завершенного вызова метода send XMLHttpRequest, если ответ сервера был правильно сформированным XML и заголовок Content-Type, отправленный сервером, понимается пользовательским агентом как тип Интернет-носителя для XML, свойство responseXML объекта XMLHttpRequest будет содержать объект документа DOM. Другое свойство, responseText, будет содержать ответ сервера в виде обычного текста от соответствующего пользовательского агента, независимо от того, понимается он как XML или нет.

Междоменные запросы

Получить альтернативу

Выполнение программы с использованием асинхронных обратных вызовов XHR может представлять трудности с удобочитаемостью и обслуживанием. В ECMAScript 2015 (ES6) добавлена конструкция обещания для упрощения асинхронной логики. С тех пор браузеры реализовали альтернативный fetch() интерфейс для достижения той же функциональности, что и XHR, с использованием обещаний вместо обратных вызовов.

Источник

Что такое AJAX? Создание асинхронных запросов

Урок, в котором на примерах рассмотрим создание простых асинхронных AJAX запросов к серверу. В качестве метода передачи запросов будем использовать как метод GET, так и метод POST. На сервере обработку запросов выполним с помощью скриптов PHP.

Что такое AJAX?

AJAX – это аббревиатура от « A synchronous J avaScript a nd X ML», которая дословно переводится как «асинхронный JavaScript и XML».

Что означают эти слова?

Что такое AJAX? AJAX – это стек технологий, с помощью которых можно в фоновом режиме получать данные с сервера и использовать их для обновления страницы без её перезагрузки. Это делает сайты и веб-приложения более быстрыми и отзывчивыми при взаимодействии пользователей с ними.

Какие преимущества даёт технология AJAX при использовании её на сайте?

AJAX на сайте позволяет:

Создание асинхронных запросов с помощью XHR

Что такое асинхронный запрос, мы уже разобрали выше. Т.е. это такой, который выполняется в фоне и не мешает пользователю взаимодействовать со страницей.

А это значит, что при отправке такого запроса, страница не «замораживается», с ней можно работать дальше.

1. Начинается написания запроса с создания экземпляра объекта XMLHttpRequest :

2. После этого следует инициализировать запрос с помощью метода open() :

3. Следующий шаг – это назначить обработчик на событие readystatechange объекта xhr :

readyState – это свойство, содержащее числовой код, по которому можно определить в какой сейчас стадии находится запрос.

Статусы кодов readyState :

Из всех этих статусов нам интересен только 4. Он будет означать, что ответ от сервера получен и его можно обработать. Остальные коды на практике практически не используются.

Таким образом напишем проверку на равенство значения readyState числу 4:

Если запрос был успешно выполнен сервером, то его статус будет 200. Другие ответы нам в большинстве случаев не интересны. Например, если status равен 404 (запрашиваемый URL не найден), то в этом случае запрашиваемых данных нет и мы можем только как-то обработать это ошибку.

Добавим ещё одно условие в код: проверку status на равенство 200.

Теперь, если всё в порядке, мы можем получить данные и делать с ними всё, то угодно.

Получить данные (ответ от сервера) можно в виде строки ( xhr.responseText ) или объекта XML Document ( xhr.responseXML ).

Например, выведем полученный ответ от севера в консоль:

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

Пример AJAX GET запроса

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

1. Для генерации некоторых данных на сервере создадим простой php-файл, который будет возвращать массив из 3 элементов в формате JSON.

В качестве сервера можно использовать «Open Server Panel», встроенный в PHP веб-сервер или любой другой.

2. Создадим HTML файл и поместим в следующее содержимое:

Пример AJAX POST запроса

Создание асинхронного AJAX запроса (метод POST)

Изменим вышеприведённый пример. Теперь AJAX запрос к серверу будет выполняться после нажатию на кнопку. Он будет получать имя, которое ввёл пользователь в элемент input и отправлять его посредством метода POST на сервер. После получения ответа с сервера, заменим им содержимое элемента div на странице.

Источник

Как скачать потоковое видео xhr с сайта, где нужно логиниться, чтобы его посмотреть?

Или вы хотите, чтобы для вашего удобства был инструмент, нарушающий лицензию сервиса и подносящий всё на блюдечке?

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

Мне доводилось писать малюсенький скрипт, скачивающий и слепляющий xhr для интересующих меня пары десятков видео.

Я знаю как это в общем-то не сложно.
Потому и обращаю внимание, что вы предлагаете крайне неподходящий инструмент.

В главе:
Как скачать защищенное видео с Геткурса
Getcourse — популярная платформа для вебинаров, тренингов, онлайн-курсов и пр. Часто хочется иметь запись урока, чтобы посмотреть его без интернета. Здесь на помощь придет хакерская смекалка и VLC media player.

Подробная инструкция по скачиванию видео с getcourse.

Откройте страницу с уроком, еоторый вы хотите скачать и запустите воспроизведение видео. Правой кнопкой мышки щелкните по свободному месту на странице и выберите в меню пункт «Посмотреть код (Ctrl+Shift+I)», Откроется вот такое окно:

Важно — адрес должен заканчиваться символами m3u8
В следующем окне:

Выберите Профиль, как на картинке внизу.
Перейдите в настройки (значок гаечного ключа), и поставьте галочки:
Видеокодек — Сохранять исходную видеодорожку.
Аудиокодек — Сохранять исходную аудиодорожку.
Нажмите Обзор для выбора названия и места сохранения файла, и кликните Начать.

Если в скачанном файле звук и видео не сопадают, выберите профиль H.264 + MP3 (TS)
Начнется скачивание файла. Время скачивания зависит от длины видео, но все равно происходит быстрее, чем воспроизведение. Когда синяя полоска дойдет до конца и исчезнет — поздравляю, вы скачали защищенное видео с геткурса.

Совет — для контроля скачивания в разделе Вид установите отображение Поверх всех окон, уменьшите размер окна плеера, и перенесите его в ту часть экрана, где он не будет мешать.

Как скачивать видео с других сайтов
С помощью VLC media player можно скачивать видеофайлы и с других сайтов. Проблема — найти и вытащить нужную ссылку. Она может выглядеть по разному. Для примера — вот так выглядит ссылка на сайте Киного.

Источник

Xmlhttprequest

XMLHTTP (XMLHttpRequest, XHR) — набор API, используемый в языках JScript, VBScript и им подобных для пересылки различных данных (XHTML, HTTP-протоколу между браузером и веб-сервером. Позволяет осуществлять HTTP-запросы к удаленному серверу без необходимости перезагружать страницу.

XMLHTTP является важной составляющей технологии XML), используется многими сайтами для создания динамичных, быстро реагирующих на запросы пользователя приложений. Например XMLHTTP используется такими сайтами как Google Suggest, MSN Virtual Earth. XMLHTTP работает только с файлами, находящимися на том же домене, что и использующая XMLHTTP страница. Как и в случае JavaScript, это сделано в целях безопасности (cross-site scripting).

Кроме пересылки XML, через XMLHTTP можно обмениваться данными формы и просто текстовыми строками.

Содержание

История

Впервые был реализован компанией Internet Explorer 5.0 в виде объекта ActiveX, доступного через VBScript, или другие скриптовые языки, поддерживающиеся браузером. Программисты проекта Mozilla затем разработали совместимую версию, называющуюся XMLHttpRequest в Mozilla 1.0. В дальнейшем эта возможность также была реализована компаниями Safari 1.2, родственным браузером Opera Software начиная с

Методы класса XMLHttpRequest

Свойства класса XMLHttpRequest

Ошибки, вызываемые классом XMLHttpRequest

Пример использования

План работы с объектом XMLHttpRequest можно представить следующим образом:

Создание экземпляра объекта XMLHttpRequest.

Вызов для ранних версий Internet Explorer выглядит так:

В более поздних версиях Internet Explorer (до IE7) рекомендуется использовать:

В остальных браузерах:

То есть, для обеспечения кросс-браузерности кода, нужно лишь проверять наличие объектов window.XMLHttpRequest и window.ActiveXObject, и, в зависимости от того, какой есть, тот и применять.

В качестве универсального решения предлагается использование такой функции:

Установка обработчика событий, открытие соединения и отправка запросов

Эти вызовы выглядят так:

После определения всех параметров запроса его остается только отправить. Делается это функцией send(). Если необходимо передать на сервер POST-данные, их надо подставить в качестве параметра для этой функции. POST-данные должны быть свернуты в URL-escaped строку (кодировка UTF-8) и добавлен заголовок req.setRequestHeader («Content-Type», «application/x-www-form-urlencoded»);. Другими словами эта строка будет иметь вид, который мы привыкли видеть в командной строке браузера, при передаче данных методом GET. При отправке GET-запроса для версии без ActiveX необходимо указать параметр null, в остальных случаях можно не указывать никаких параметров. Не будет ошибкой, если для GET всегда будет указан параметр null:

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

Известные проблемы

Проблема с кешированием в Microsoft Internet Explorer

Internet Explorer кеширует GET-запросы. Те авторы, которые не знакомы с кешированием HTTP, ожидают, что GET-запросы не кешируются, или что кеш может быть обойдён, как в случае нажатия кнопки обновления. В некоторых ситуациях избегание кеширования действительно является ошибкой. Одним из решений является использование метода POST, который никогда не кешируется; однако он предназначен для других операций. Другим решением является использование метода запроса GET, включающего уникальную строку запроса с каждым вызовом, как показано на примере ниже.

Следует помнить, что такой способ сильно забивает кеш. Лучше воспользоваться установкой заголовка Expires на прошедшую дату в вашем скрипте, который генерирует содержимое XML. В

Иначе можно заставить объект XMLHttpRequest всегда вытаскивать новое содержимое, не используя кеш.

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

См. также

Ссылки

Реализация в браузерах

Учебные руководства

Стандарты

Литература

Полезное

Смотреть что такое «Xmlhttprequest» в других словарях:

XMLHttpRequest — (XMLHTTP, XHR) API, доступное в скриптовых языках браузеров, таких как JavaScript. Использует запросы HTTP или HTTPS напрямую к веб серверу и загружает данные ответа сервера напрямую в вызывающий скрипт.[1] Информация может передаваться в… … Википедия

Xmlhttprequest — ist eine API zum Transfer von beliebigen Daten über das Protokoll HTTP. Dabei können sämtliche HTTP Anfragemethoden (unter anderem GET, POST, HEAD, PUT) verwendet werden. Wenn eine Anfrage XML Daten liefert, kann XMLHttpRequest diese alternativ… … Deutsch Wikipedia

XMLHttpRequest — (XHR) ist eine API zum Transfer von beliebigen Daten über das Protokoll HTTP. Dabei können sämtliche HTTP Anfragemethoden (unter anderem GET, POST, HEAD, PUT) verwendet werden. Wenn eine Anfrage XML Daten liefert, kann XMLHttpRequest diese… … Deutsch Wikipedia

XMLHTTPRequest — est un objet ActiveX ou Javascript qui permet d obtenir des données au format XML, JSON, mais aussi HTML, ou encore texte simple à l aide de requêtes HTTP. On explique le succès récent de l objet et la très grande utilisation qui en est faite… … Wikipédia en Français

XMLHttpRequest — est un objet ActiveX ou Javascript qui permet d obtenir des données au format XML, JSON, mais aussi HTML, ou encore texte simple à l aide de requêtes HTTP. On explique le succès récent de l objet et la très grande utilisation qui en est faite… … Wikipédia en Français

XMLHttpRequest — (XHR), también referida como XMLHTTP (Extensible Markup Language / Hypertext Transfer Protocol), es una interfaz empleada para realizar peticiones HTTP y HTTPS a servidores Web. Para los datos transferidos se usa cualquier codificación basada en… … Wikipedia Español

XMLHttpRequest — HTTP Persistence · Compression · HTTPS Request methods OPTIONS · GET · HEAD · POST · PUT · DELETE · TRACE · CONNECT Header fields Cookie · ETag · Location · Referer DNT · … Wikipedia

XHR — XMLHttpRequest ist eine API zum Transfer von beliebigen Daten über das Protokoll HTTP. Dabei können sämtliche HTTP Anfragemethoden (unter anderem GET, POST, HEAD, PUT) verwendet werden. Wenn eine Anfrage XML Daten liefert, kann XMLHttpRequest… … Deutsch Wikipedia

XHR — XMLHttpRequest XMLHttpRequest est un objet ActiveX ou Javascript qui permet d obtenir des données au format XML, JSON, mais aussi HTML, ou encore texte simple à l aide de requêtes HTTP. On explique le succès récent de l objet et la très grande… … Wikipédia en Français

XMLHttp — XMLHttpRequest XMLHttpRequest est un objet ActiveX ou Javascript qui permet d obtenir des données au format XML, JSON, mais aussi HTML, ou encore texte simple à l aide de requêtes HTTP. On explique le succès récent de l objet et la très grande… … Wikipédia en Français

Источник