@sonofjesus

Почему не отправляется запрос на сервер?

Есть небольшое приложение на React, функционал: регистрация новых пользователей и восстановление пароля. С регистрацией все ок (на локальном и удаленном сервере), но вот сброс пароля не работает.

На локальном сервере при сабмите формы происходит следующее:

Получаю сначала 404:
POST https://api.com/v3/users/recovery-password 404 ()

Затем алерт со таким содержимым (при условии, что данные введены корректные):
{"code":113,"message":"User not found"}
Если говорить про то же самое приложение на удаленном сервере, то при сабмите формы просто ничего не происходит. Вкладка network пустая, консоль тоже.

Собственно часть кода, которая отвечает за отправку:
onSubmit(ev) {
ev.preventDefault()

let vals = this.state.vals

for ( let key in vals) {
  if ( vals.hasOwnProperty(key) && vals[key] === null ) {
    $( "form input:visible" ).each( function() {
        if (!$(this).val()){
          $(this).addClass( 'has-error' )
        }
    } )
    if ( ( !( key === 'name' || key === 'password' ) ) && ( $( 'body' ).hasClass( 'recover-page' ) ) ) {
      return false
    }
  }
}

if ( Object.keys( vals ).some( key => vals[ key ] === null ) ) return

this.setState( { class: "form loading" } )

let bThis = this

if ( $( 'body' ).hasClass( 'recover-page' ) ) {

  const data = {
    email: vals.email,
    platformName: vals.domain
  };

  const boundary = String(Math.random()).slice(2);
  const boundaryMiddle = '--' + boundary + '\r\n';
  const boundaryLast = '--' + boundary + '--\r\n'

  let body = ['\r\n']

  Object.keys( data ).forEach( key => {
    body.push( 'Content-Disposition: form-data; name="' + key + '"\r\n\r\n' + data[key] + '\r\n' );
  } )

  body = body.join( boundaryMiddle ) + boundaryLast

  const xhr = new XMLHttpRequest()

  xhr.open('POST', 'https://api.com/v3/users/recovery-password', true)

  xhr.setRequestHeader('Content-Type', 'multipart/form-data; boundary=' + boundary)

  xhr.onreadystatechange = function() {
    if ( this.readyState !== 4 ) return

    if( this.responseText === 'null' ){

      bThis.setState({class: "form recoverSuccess"} )

    } else {
      alert(this.responseText)
    }
  }

  xhr.send(body);

  return false
}

this.sendReq(vals)

}

Так же попытка пропинговать хостинг с апи — скриншот терминала
5b05cb8291f74099648504.png
  • Вопрос задан
  • 769 просмотров
Пригласить эксперта
Ответы на вопрос 1
maxfarseer
@maxfarseer
https://maxpfrontend.ru, обучаю реакту и компании
По ошибке: раз вы получили 404, то стоит начать с проверки существования такого роута на сервере. Пока у вас не будет рабочего запроса через консоль / postman - нет смысла на клиенте пытаться.

p.s. Зачем в коде намешан подход jQuery и работы с DOM + React? Просто какой-то костыль по необходимости или это кажется нормальным?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы