Это все о междоменном

внешний интерфейс сервер Безопасность JavaScript

В этой статье в основном представлены знания о междоменных ресурсах.

Прежде чем говорить о междоменном взаимодействии, давайте поговорим о политике одного и того же источника. Политика одного и того же источника — это соглашение, которому следуют почти все современные браузеры. быть запрошены по желанию, тем самым обеспечивая безопасность веб-сайта. Гомологичный должен гарантировать, что протокол, доменное имя и порт одинаковы.Пока есть одно различие, они не гомологичны. Хотя политика одного и того же источника обеспечивает безопасность, иногда нам нужен взаимный доступ из разных источников, например, в проекте, где внешний и внутренний интерфейс разделены, адреса внешнего и внутреннего соответственноhttps://xwchris.meа такжеhttps://api.xwchris.me. Междоменный метод CORS используется для междоменного доступа между разными источниками. Полное название КОРСCross Origin Resource SharingТо есть междоменное совместное использование ресурсов.

Междоменные заголовки CORS

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

  • Access-Control-Allow-Headers (заголовок запроса, заголовок ответа, предварительный запрос) (не может быть * при переносе файлов cookie)
  • Access-Control-Allow-Methods (заголовок запроса, заголовок ответа, предварительный запрос) (не *)
  • Access-Control-Allow-Origin (заголовок ответа, предварительный запрос/обычный запрос) (не может быть * при наличии файлов cookie)
  • Access-Control-Allow-Credentials (заголовок ответа, предварительный запрос/обычный запрос) (установите значение true при переносе файлов cookie)
  • Access-Control-Max-Age (заголовок ответа, предварительный запрос) (единицы с)

CORS для простых запросов

Простой запрос должен соответствовать следующим условиям:

  1. Метод запроса должен бытьGET,HEADа такжеPOSTодин из них
  2. Информация HTTP не может превышать следующие поляAccept,Accept-Language,Content-Language,Last-Event-IDа такжеContent-Typeа такжеContent-TypeЗначение ограниченоapplication/x-www-form-urlencoded,multipart/form-dataа такжеtext/plain.

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

Для поддержки доступа CORS требуется, чтобы сервер добавил в заголовок ответаAccess-Control-Allow-Origin,можно использовать*чтобы указать, что междоменный доступ разрешен для всех доменов.

CORS для непростых запросов

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

предварительный запрос

предварительный запросOPTIONSзапрос, браузер автоматически добавитAccess-Control-Allow-Headersа такжеAccess-Control-Allow-Methods.

Заголовки ответов, которые должны быть возвращены сервером, включаютAccess-Control-Allow-Headers,Access-Control-Allow-Methodsа такжеAccess-Control-Allow-Origin.

КромеAccess-Control-Allow-OriginВ дополнение к необходимости, два других должны быть добавлены сервером только в том случае, если они не соответствуют потребностям простого запроса, например, настройка заголовка запроса на основе простого запроса.X-xx-name: chris, то серверу просто нужно добавить в заголовок ответаAccess-Control-Allow-Headers. Каждый заголовок ответа может быть использован*Подстановочные знаки для представления всех.

нормальный запрос

После того, как предварительный запрос завершен, вы можете отправить обычный запрос.Этапы обычного запроса такие же, как и в простом запросе, и вам также нужно добавитьAccess-Control-Allow-Originзаголовок ответа.

Уменьшите количество предварительных запросов

может быть установленAccess-Control-Max-AageЧтобы уменьшить количество презапросов, его нужно включить в заголовок ответа презапроса, указав, что проверка презапроса действительна в течение этого времени, и каждый раз презапрос делать не нужно. единицаs. Такие какAccess-Control-Max-Age: 1728000, который действителен в течение 20 дней.

Запросы с куки

По умолчанию междоменные запросы не содержат файлы cookie. Если вы хотите использовать файлы cookie для междоменных запросов, это должны поддерживать и отправитель, и получатель. Чтобы поддерживать перенос файлов cookie, разработчику необходимо вручную указать объект запроса при запросе.xhr.withCredentials=true. Заголовки ответа сервера должны содержатьAccess-Control-Allow-Credentials: true, если это непростой запрос, предварительный запрос также должен включать этот заголовок.

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

Другие междоменные методы

В дополнение к CORS мы также можем использоватьJSONPтехнологии междоменного, это очень старый хак. мы все знаемscriptТеги могут обращаться к сценариям в любом домене, поэтому этот метод можно использовать для междоменного доступа, что требует взаимодействия с сервером. Возьмите каштан 🌰:

<script type="text/javascript">
	function getName(name) {
		console.log(name);
	}
</script>
<script src="http://api.xxx.com?callback=getName"></script>

После запроса сервер должен получитьcallbackЗначение поля, затем превратите возвращаемое значение в JSON, поместитеgetNameсередина. Окончательное возвращаемое значение x имеет форму;getName({"name": "chris"}), чтобы функция getName могла получить соответствующее значение.

По сравнению с CORS, JSONP может делать только запросы GET, но совместимость лучше. Тем не менее, современные браузеры в основном поддерживают запросы CORS и могут быть съедены с уверенностью. Оригинальный адрес:портал

Категории