JavaScript XMLHttpRequest.withCredentials — куки в CORS-запиті

Властивість withCredentials каже надсилати куки й дані авторизації в запиті на інший домен.

правити

Загальний опис

За замовчуванням крос-доменний запит іде без кук — і це часта причина того, що API відповідає «не авторизовано», хоч у браузері ти залогінений.

Але однієї цієї властивості замало. Сервер має відповісти двома заголовками: Access-Control-Allow-Credentials: true і — обов'язково — Access-Control-Allow-Origin із конкретним доменом. Зірочка * разом із куками заборонена, і браузер відкине відповідь.

На запити в межах свого домену вона не впливає — там куки йдуть завжди.

правити

Нотатка

Access-Control-Allow-Origin: * несумісний із куками. Сервер мусить назвати конкретний домен, інакше браузер відкине відповідь — навіть якщо сервер її надіслав.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
withCredentials	3+	3.5+	4+	12+	12+	10+

Підтримка: мобільні переглядачі

Переглядач
withCredentials	4.4+	yes	yes	4+

Приклади

+ запропонувати свій приклад у пісочниці

const xhr = new XMLHttpRequest();

xhr.open('GET', 'https://api.example.com/me');

// без цього куки НЕ підуть
xhr.withCredentials = true;

xhr.onload = () => console.log(xhr.response);
xhr.send();

// сервер має відповісти:
//   Access-Control-Allow-Credentials: true
//   Access-Control-Allow-Origin: https://css.in.ua  ← не «*»

// у fetch це:
// fetch(url, { credentials: 'include' });