Блог

Я использую WebdriverIO версии 7 и axios, чтобы попытаться войти в систему через API, вместо того, чтобы делать это с помощью пользовательского интерфейса.
Это мой код:

 getAuthToken({ email, password }) {

    // axios
    //   .post('https://my-app.com/login', {
    //     j_username: email,
    //     j_password: password,
    //     CSRFToken: 'some-token',
    //   })
    //   .then((response) => {
    //     console.log('XXX');
    //     console.log(response);
    //   });

    const data = {
      j_username: email,
      j_password: password,
      CSRFToken: 'some-token',
    };
    axios({
      method: 'POST',
      headers: { 'content-type': 'application/x-www-form-urlencoded' },
      data: qs.stringify(data),
      url: 'https://my-app.com/login',
    }).then((response) => {
      console.log('XXX');
      console.log(response);
    });
  }  
 

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

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

Это Необработанные данные запроса Почтальона:

 POST https://my-app.com/j_spring_security_check HTTP/1.1
User-Agent: PostmanRuntime/7.28.0
Accept: */*
Cache-Control: no-cache
Postman-Token: 39311680-b11c-4a65-8ff7-2f03b97bf5eb
Host: my-app.com
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Content-Type: multipart/form-data; boundary=--------------------------619522728182415185770824
Cookie: anonymous-consents=[]; cookie-notification=NOT_ACCEPTED
Content-Length: 436

----------------------------619522728182415185770824
Content-Disposition: form-data; name="j_username"

email@test.com
----------------------------619522728182415185770824
Content-Disposition: form-data; name="j_password"

123456
----------------------------619522728182415185770824
Content-Disposition: form-data; name="CSRFToken"

some-token
----------------------------619522728182415185770824--
 

Это необработанный запрос, когда я делаю это через Chrome

 POST https://my-app.com/j_spring_security_check HTTP/1.1
Host: my-app.com
Connection: keep-alive
Content-Length: 90
Cache-Control: max-age=0
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="90", "Google Chrome";v="90"
sec-ch-ua-mobile: ?0
Upgrade-Insecure-Requests: 1
Origin: https://my-app.com
Content-Type: application/x-www-form-urlencoded
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.212 Safari/537.36
Accept: text/html,application/xhtml xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9
Sec-Fetch-Site: same-origin
Sec-Fetch-Mode: navigate
Sec-Fetch-User: ?1
Sec-Fetch-Dest: document
Referer: https://my-app.com/login
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Cookie: JSESSIONID=some_id; dtCookie=some_data; anonymous-consents=[]; cookie-notification=NOT_ACCEPTED

j_username=ecx@test.comamp;j_password=123456amp;CSRFToken=some_token
 

Что я делаю не так? Почему он никогда не регистрирует ответ, делая это через axios?
Спасибо!

Функция написана правильно. Почтальон передает также дополнительные сведения, которые вы можете изучить. Давайте рассмотрим сценарии, которые могут привести к сбою вызова API:

1. Ваша функция может быть неправильной.
2. API настроен неправильно.
3. Проблемы в сети.

Рассмотрение первого сценария:

1. Проверьте, вызывается ли функция getAuthToken() или нет.
2. Возможно, возникла проблема с CORS, которую вам необходимо исправить.
3. Поскольку вы отправляете данные JSON, серверная сторона также должна принимать данные JSON или указывать их в заголовках запросов. Нравится

 const data = {"name":"Example"}
axios.post('https://linkToApI.com', {
    headers: {
        'Content-Type': 'application/json',
        'Authorization': 'some_auth_method_like_authToken',
        specify other necessary headers
    },
    data
})     
 

Переходим ко второму сценарию:
Настройка сервера очень важна.
убедитесь, что нет никаких проблем с cors, которые мешают.
убедитесь, что сервер принимает данные запроса, которые вы отправляете.
убедитесь, что в случае сбоя запроса он отправляет ответ об ошибке.

Дополнительные изменения в коде для целей отладки: Какой бы код вы ни использовали, пожалуйста, попробуйте добавить блок catch, как будто обещание не выполняется, мы можем получить сообщение об ошибке «почему это не удается». ниже приведен пример:

 axios({
      method: 'POST',
      headers: { 'content-type': 'application/x-www-form-urlencoded' },
      data: qs.stringify(data),
      url: 'https://my-app.com/login',
    }).then((response) => {
      console.log('XXX');
      console.log(response);
    }).catch(e=>{console.log(e)}); // this will provide you with info why is it failing