Конденсатор на iOS: сбой запроса POST - PullRequest
Новая
       5

Конденсатор на iOS: сбой запроса POST

0 голосов
/ 25 марта 2020

Я использую Ioni c (v5) + React + Capacitor для создания приложения для iOS, и недавно я застрял с действительно странной ошибкой: fetch () и ax ios успешно выполняют запросы GET к бэкэнд, в то время как POST-запросы всегда терпят неудачу.

fetch () возвращает "cancelled", что говорит только о сбое, в то время как ax ios генерирует более описательную ошибку: 

{
  "message": "Network Error",
  "name": "Error",
  "stack": "capacitor://localhost/static/js/8.98344607.chunk.js:2:168604\ncapacitor://localhost/static/js/8.98344607.chunk.js:2:167548",
  "config": {
    "url": "auth",
    "method": "post",
    "data": "{\"email\":\"email-here\",\"password\":\"111111\"}",
    "headers": {
      "Accept": "application/json",
      "Content-Type": "application/json"
    },
    "baseURL": "https://website.com/api/1.3/",
    "transformRequest": [
      null
    ],
    "transformResponse": [
      null
    ],
    "timeout": 0,
    "xsrfCookieName": "XSRF-TOKEN",
    "xsrfHeaderName": "X-XSRF-TOKEN",
    "maxContentLength": -1
  }
}

Уже проверил Apache настройки CORS, все должно быть в порядке. Кто-нибудь может предложить исправить это?

Upd.1: часть моего кода, которая выполняет все запросы API 

const axConf: AxiosRequestConfig = {
    url: query, // string
    method: m, // string
    baseURL: global.base_uri + 'api/' + global.api_version + '/',
    headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json'
    },
    data: r, // object
    validateStatus: function (status) { return status >= 200 && status < 300; }
};
return new Promise(resolve => {
    axios(axConf)
        .then(response => resolve(successRes(r, i, response.data)))
        .catch(function (error) {
                console.log(error);
                if (error.response) {
                    resolve(errorRes(i, error.response));
                } else if (error.request) {
                    resolve(errorRes(i, error.request));
                } else {
                    resolve(errorRes(i, error.message));
                }
            }
        );
});

1 Ответ

1 голос
/ 29 марта 2020

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

Эта ошибка возникает, когда вы пытаетесь выполнить HTTP-запрос, а затем что-то в вашем коде нарушает этот запрос. В моем случае это была форма: мой запрос fetch () был вызван действием кнопки onClick с установленным на нем type="submit", и отправка самой формы не вызвала ничего, кроме обновления состояния, которое отменяло мой запрос.

Я переключал свое приложение с Ioni c v4 & Angular на Ioni c v5 & React, и раньше форма не вызывала такого поведения, поэтому я даже не думал, что это может быть вещь.

Я просто удалил действие onClick из своей кнопки и установил onSubmit={handleLogin} для самой формы. Затем измените код следующим образом: 

const handleLogin = (e: FormEvent) => {
    fnGetUserToken(loginData).then(...);
    e.preventDefault();
};

Обратите внимание на e.preventDefault(); в конце.

Если вы не можете изменить свой код таким образом, я думаю, вы можете попытаться удалить свойство type="submit" от вашей кнопки.

Еще один ответ , который привел меня к этому решению.

...