Почему токен не приходит на API?

Question

[pshevnin]

Всем привет, у меня есть API написанное на C# ASP .Net. На этом апи происходит получение токена пользователя из заголовка тким образом:

string? token = context.Request.Headers["Authorization"].FirstOrDefault()?.Replace("Bearer ", "");

По непонятной мне причине, при запросе через программу POSTMAN с таким заголовком токена: Authorization Bearer {{accessToken}} (где accessToken - переменная в которой записан токен) всё работает корректно, на бэке в логи выводится правильный токен, однако когда я произвожу такой же (на мой непрофессиональный взгляд) запрос с моего фронт-энда, вот пример кода:

export async function requestToAPI(data: any, requestType: string, requestURL: string, token: string | null = null) {

    let options;
    console.log("requestUrl: " + requestURL);
    let headers: Record<string, string> = {
        'Content-Type': 'application/json',
    };

    console.log(token + " token in requestToAPI");

    if (token != null) {
        headers['Authorization'] = `Bearer ${token}`;
    }

    if (requestType === "GET") {
        options = {
            method: requestType,
            headers: headers,
        };
    } else {
        options = {
            method: requestType,
            headers: headers,
            body: JSON.stringify(data)
        };
    }

    console.log("Request Headers:", options.headers);

    console.log("Start sending a request to API");

    const response = await fetch(requestURL, options); ...

Запрос доходит до сервера, но часть заголовка с токеном пуста. Тип запроса Get, это вроде не должно влиять на заголовки. Так же я пробовал вставить просто строку "token" вместо токена на фронтенде, в логи на сервере всё равно выводится Token: (пустой токен). Запрос на сервер, точно доходит, кроме того, запросы не требующие токена работают. Резюме: Бэкенд + Postman полностью работает; Фронтенд + Бэкенд не работает только тогда, когда пересылается токен (не пересылается даже просто строка текста, то есть проблема не в самом токене на фронте). Кроме того, политики CORS на бэке настроены так, что сейчас они принимают запросы со всех доменов, и в браузере ошибок по CORS не возникает. Я допускаю, что мог где-то не там поставить кавычки, но вроде всё что приходило в голову уже проверил

Comments

[V Sh.]

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

[pshevnin]

V Sh., Я открыл network в браузере, и в запросе получения пользователей, заголовок Authorization отсутствует, при этом, я вывожу в консоль заголовки запроса перед тем, как его отправить, и там всё правильно, не подскажете, в чём может быть причина?

[V Sh.]

pshevnin, ну надо смотреть. что у вас возвращает ваш код "console.log("Request Headers:", options);"?

[pshevnin]

V Sh., Вот скрин, как я понимаю тут заголовки выглядят именно так, как и должны.

[V Sh.]

pshevnin, даже не знаю... уберите проверку if (token != null) и посмотрите отправляется ли хоть какая-то строка в заголовках в Authorization. Если отправляется, значит что-то не так с передачей токена в функцию саму. Если не отправляется - значит что-то не так внутри функции и можно попробовать упростить функцию так и посмотреть в средствах разработчика:

let r = await fetch('url', {
  headers: {Authorization: 'Bearer {token}'}
})

[Роман]

pshevnin, отладчиком посмотреть, что в options до отправки запроса находится, а не консоль выводится.

заменить Record на

const headers = new Headers();
      headers.append('Content-Type', 'application/json');

Answer 1

[Sergey В.]

Обычно в Headers между парметром и значение ставится двоеточие. Здесь:
Authorization Bearer {{accessToken}}
всё идёт одной строкой. И это у Вас работает.

Поставьте двоеточие, в этом случае обработка будет корректной, т.к. здесь:
context.Request.Headers["Authorization"].
у Вас идёт поиск заголовка "Authorization", а так как его нет, то и выражение:
string? token = context.Request.Headers["Authorization"].FirstOrDefault()?.Replace("Bearer ", "");
возвращает null