Подтверждение электронной почты Laravel с использованием js blur с ajax и jquery

Question

Я хочу проверить свою форму, не нажимая кнопку отправки в laravel. У меня есть некоторые коды здесь, но работает только email format is invalid. Может кто-нибудь сказать мне, что мне делать? Я просто новичок в ajax

PS: сообщение, которое я получаю при вводе действительного адреса электронной почты {readyState: 4, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}

Blade

  <input  type="email" class="form-control" id="inputEmail" name="inputEmail" placeholder="Email" required value="{{ old('inputEmail') }}">

Ajax

   $(document).ready(function () {
    const emailValidation = document.querySelector('#inputEmail');
    const mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/; 
    emailValidation.addEventListener('blur', e => { 
      if (emailValidation.value.match(mailformat)) {

        $.ajax({
          type: 'get',
          url: '/emailValidation', 
          _token: "{{ csrf_token() }}",
          data: {
            'emailValidation': emailValidation.value, 
          },
          success: function (data) {
            if (data.validOrNot === "not taken"){
              console.log("it works!");
            } else {
              console.log("email taken!");

            }
          },
          error: function (error) {
            console.log(error);
          }
        });
      } else {

        console.log("Email format is invalid!");

      }
    });
  });

Контроллер

 public function emailValidation(Request $request){
        // $user = new User;
        $user = User::where('email', '=', Input::get('inputEmail'))->first();
        $emailPassed = $request->emailValidation;

        if ($user===null)
          return response()->json(['validOrNot' => 1]);
        else
          return response()->json(['validOrNot' => 0]);


      }

Маршрут

    Route::get('/emailValidation', 'TeachersController@emailValidation');

Answer 1

Если вы посмотрите официальную документацию, у Laravel есть свое email правило проверки , а также unique правило проверки и, на мой взгляд, оно всегдалучше сделать проверку входных данных на стороне сервера.

Существует множество причин, по которым валидация веб-интерфейса представляет собой риск. Посмотрите на этот вопрос в качестве примера.

Кроме того, ваше регулярное выражение неверно. Я не проверял это РЕДАКТИРОВАТЬ: я пробовал это на regexr.com, и он не работает , но есть много тем, а также этот вопрос, который может дать вам гораздо более точное регулярное выражение.

В любом случае, поскольку вы делаете Ajax-вызов к бэкэнду для проверки, вы должны изменить свой код следующим образом:

$(document).ready(function() {
  const emailValidation = document.querySelector('#inputEmail');

  emailValidation.addEventListener('blur', e => {
    // Let the backend do all the validation magic on blur
    $.ajax({
      type: 'get',
      url: '/emailValidation',
      _token: "{{ csrf_token() }}",
      data: {
        'email': emailValidation.value,
      },
      success: function(data) {
        // No need to check the data since it's a valid e-mail
      },
      error: function(error) {
        console.log(error);
      }
    });
  });
});

и в функции вашего контроллера:

public function emailValidation(Request $request) {
  // Validation
  $this->validate($request, [
    'email' => 'required|email|unique:users'
  ]);

  // Validation passes. Just send an empty response with 200 status code
  return new Response;
}