Поле Content-Type заголовка HTTP-запроса

HTTP

Content-Type в запросе

В запросах (таких как POST или PUT) поле Content-Type используется клиентом, чтобы сообщить серверу, какой тип данных был фактически отправлен. Когда вы отправляете запрос HTTP POST, вам необходимо установить поле Content-Type в заголовке запроса, чтобы сообщить серверу, какой тип данных вы отправляете.

Установите Content-Type в заголовке запроса

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

Установите Content-Type заголовка запроса в форме

Задумывались ли вы когда-нибудь, помимо использования объекта XMLHttpRequest, предоставляемого браузером для инициирования HTTP-запросов, того, как чистый HTML инициирует HTTP-запросы, вы должны думать о формах, да, в HTML-тегах вы можете настроить GET или POST Тег HTTP-запрос, только тег формы. Когда вы устанавливаете его как POST-запрос и нажимаете кнопку отправки, будет инициирован HTTP-запрос POST.Это, конечно, не удивительно и не знакомо, но вы редко можете подумать, что раз это POST-запрос, то я отправляю HTTP-запрос. , Как устанавливается Content-Type?

Ниже приведена обычная форма.После нажатия кнопки «Отправить» просмотрите NetWork консоли и просмотрите запрос, выданный формой.

 <form action="./login" method="POST">
    <input type="text" name="user-name">
    <input type="tel" name="user-tel">
    <input type="submit">
 </form>

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

POST / HTTP/1.1
Host: 127.0.0.1
Content-Type: application/x-www-form-urlencoded
Content-Length: 13

say=Hi&to=Mom

Вы обнаружите, что даже если вы вручную не установите Content-Type в заголовке запроса, запрос будет иметь его по умолчанию. Почему это? Поскольку атрибут enctype тега формы используется для указания этого Content-Type, его значение по умолчанию: application/x-www-form-urlencoded.

Итак, есть ли в форме какой-либо другой тип enctype, кроме этого значения, конечно, потому что как только один тип данных может удовлетворить фактические потребности? Атрибут enctype формы имеет всего три значения:

  1. application/x-www-form-urlencoded
  2. multipart/form-data
  3. text/plain

Давайте поговорим об этих трех типах использования:

  • приложение/x-www-форма-urlencoded:

Данные формы используются для обычных полей, данные формы будут в теле запроса, а данные будут отправлены на сервер в определенном формате (то есть в формате application/x-www-form-urlencoded, который на самом деле не ерунда).Что касается конкретно этого Что за формат,можно узнать заглянув в MDN.Короче не в этом дело,потому что это всего лишь формат.

  • multipart/form-data

Для файлов или бинарных данных данные будут в определенном формате (то есть в формате multipart/form-data, это действительно не ерунда), если хотите узнать, что это за формат, посмотрите на MDN, потому что это Дело не в том, что это просто формат.

  • text/plain

Никогда не используйте это значение, так как оно не будет надежно проанализировано.

резюме:Выше показано, как установить Content-Type запроса POST в форме, который задается через атрибут enctype формы.

Установка Content-Type заголовка запроса POST в AJAX

AJAX реализуется не только XMLHtppRequest, нет, нет, нет и Fetch

Как объект XMLHttpRequest устанавливает Content-Type

Мы часто используем AJAX для отправки HTTP-запросов, так как же установить Content-Type заголовка запроса в HTTP-запросе, отправляемом AJAX? Это очень просто, вы можете установить его с помощью API XMLHttpRequest, а именно:XMLHttpRequest.setRequest.header(), этот метод используется для установки заголовка запроса, Content-Type можно установить так:xhr.setRequest.header("Content-Type","application/x-www-form-urlencoded ")

Например, отправка данных JSON

var xhr = new XMLHttpRequest()
xhr.open('POST','./index.php')
xhr.setRequestHeader('Content-Type','application/json')
xhr.onreadystatechange = function() {
    xxx
}
xhr.send(JSON.stringfy(data))

резюме:через AJAXXMLHttpRequest.setRequest.header()Установите поле Content-Type.

Как Feth устанавливает Content-Type

Раньше AJAX реализовывался объектом XMLHttpRequest, предоставляемым браузером, позже эту же функцию реализовывал и Ferch API, так как же в таком случае установить Content-Type в запросе? Используйте API заголовков, предоставленный Fethc, чтобы установить, конкретные настройки следующие:

var myHeaders = new Headers();
myHeaders.append("Content-Type", "application/json");

резюме:Поле Content-Type устанавливается через API заголовков в Fetch.