Почему нельзя напрямую передать заголовки (например Authorization) при скачивании файла через обычную ссылку?

Когда пользователь кликает на обычную ссылку или вы используете window.location.href для перехода, браузер создаёт простой GET-запрос, в который он сам добавляет стандартные заголовки (User-Agent, Accept и т.д.). Добавить произвольные заголовки, такие как Authorization: Bearer <token>, в этот запрос невозможно, потому что это нарушило бы модель безопасности браузера.

Почему браузер это запрещает?

• Безопасность: Если бы любая страница могла добавлять заголовки к любым запросам (включая переходы на другие сайты), это позволило бы злоумышленникам подделывать запросы с учётными данными пользователя.
• Контроль происхождения: Браузер следует политике одного источника (Same-Origin Policy) и CORS. Заголовки вроде Authorization считаются "заголовками, требующими предварительной проверки" (preflight), и их отправка в кросс-доменном контексте требует явного разрешения сервера.
• Разделение ответственности: Обычные навигационные запросы управляются браузером от имени пользователя, а программные запросы (через API) управляются кодом страницы.

Как правильно скачать файл с заголовком Authorization?

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

async function downloadFileWithAuth(url, token) {
  const response = await fetch(url, {
    headers: {
      'Authorization': `Bearer ${token}`
    }
  });
  if (!response.ok) throw new Error('Download failed');
  const blob = await response.blob();
  const downloadUrl = window.URL.createObjectURL(blob);
  const link = document.createElement('a');
  link.href = downloadUrl;
  link.download = 'file.pdf'; // имя файла
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
  window.URL.revokeObjectURL(downloadUrl);
}

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

Где это применяется?

Такой подход необходим в современных SPA-приложениях (React, Angular, Vue), где аутентификация происходит через JWT-токены, а API требует передачи токена в заголовке Authorization для доступа к защищённым ресурсам, включая файлы.

Вывод: Используйте Fetch API (или аналоги) для скачивания файлов, требующих авторизации, так как только программные запросы позволяют полностью контролировать HTTP-заголовки, соблюдая при этом политики безопасности браузера.