Как отправлять и получать файлы cookie с помощью react js на сервер SAP?

#reactjs #postman #setcookie #http-proxy-middleware

#reactjs #почтальон #setcookie #http-прокси-промежуточное ПРОГРАММНОЕ обеспечение

Вопрос:

Позвольте мне попытаться немного объяснить мою текущую ситуацию:

Я должен использовать api rest из SAP, который мне нужен, чтобы получить токен и X-CSRF-токен, оба работают хорошо, я получил их и сеансовые файлы cookie из SAP, до этого момента все в порядке. Чтобы использовать api rest, я должен отправить по заголовкам как токены, так и файлы cookie сеанса.

Проблема в том, что браузер блокирует файлы cookie, потому что они не соответствуют некоторым критериям, таким как:

  • Этот установленный файл cookie был заблокирован, поскольку он имеет атрибут secure, но не был получен по защищенному соединению
  • Этот установленный файл cookie был заблокирован, поскольку его атрибут домена был недействительным в отношении

Вначале я не мог подключиться к SAP из-за политики CORS того же происхождения, я уже решил это с помощью http-proxy-middleware, я выполняю вызовы с помощью axios (я активировал withCredentials: true, чтобы сообщить ему, что мне нужны файлы cookie). Но теперь проблема, похоже, все еще связана с файлами cookie, потому что результат, который я получаю после вызова api, запрещен 403.

Я уже провел тест с помощью postman, и все работало хорошо, я мог получать токены в виде файлов cookie и использовать сервис из SAP, проблема на стороне клиента (браузер).

Кроме того, у меня нет доступа к серверной части для настройки cors и файлов cookie, поэтому решение на стороне сервера — это не то, что я ищу. Кроме того, для создания прокси-сервера с помощью node.js это мой последний вариант, перед этим я хочу знать, могу ли я контролировать эту ситуацию только с помощью клиента, для этого я использую react JS.

Это часть моего кода, обусловленного:

Прокси

 const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
    app.use("/oauth2/token",
        createProxyMiddleware( {
            target: "https://sapConnectionOauth.com",
            changeOrigin: true,
            secure:true,
            cookieDomainRewrite: {
                "*": "sapConnectionOauth.com"
            }
        })
    );
    app.use("/http/serviceIWannaUse",
        createProxyMiddleware( {
            target: "https://sapConnection.com",
            changeOrigin: true,
            secure:true,
            cookieDomainRewrite: {
                "*": "sapConnection.com" 
            }
        })
    );
};
  

Сервис, который я хочу использовать

 export const serviceIWannaUse = async (token, xcsrf) => {
    console.log('entra a serviceIWannaUse')

    let config= {
        url:
            "/http/serviceIWannaUse",
        method: "POST",
        withCredentials: true,
        headers: {
            Accept: "application/json",
            "Content-Type": "application/json",
            "X-CSRF-Token": xcsrf,
            Authorization: `Bearer ${token}`,
        },
    };
    return await axios(config)
};
  

Это изображение примера того, как setCookies отображаются в браузере (это не мое)

введите описание изображения здесь

Также я изменял флаги Google для файлов cookie, и это не сработало. Ссылка только: chrome://flags/

Если кто-нибудь сможет мне в этом помочь, я буду очень благодарен.