Ajax Javascript - метод POST 'u' является недопустимым началом значения

Question

У меня есть страница html для функции входа в систему, которая постоянно возвращает мне ошибку 400 выше. Независимо от того, что я ввожу.

Мой html код:

$(document).ready(function() {
  $('#btnLogin').click(function() {
    $.ajax({
      url: '/api/User/LoginAsync',
      method: 'POST',

      contentType: 'application/json',
      data: {
        userName: $('#txtUsername').val(),
        password: $('#txtPassword').val()
      },
      success: function(response) {
        localStorage.setItem("accessToken", response);
        window.location.href = "UserAccountPage.html";
      }
    });
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="txtUsername" placeholder="Username..." /><br />
<input type="text" id="txtPassword" placeholder="Password..." /><br />
<input type="button" id="btnLogin" value="Login" />

Мой API

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

Answer 1

Вы определяете вызов AJAX с параметрами XML, но вы передаете формат JSON в тестере API

Правильный вызов AJAX должен быть:

$(document).ready(function() {
  $('#btnLogin').click(function() {
    $.ajax({
      url: '/api/User/LoginAsync',
      method: 'POST',

      contentType: 'application/json',
      data: JSON.stringify({
        userName: $('#txtUsername').val(),
        password: $('#txtPassword').val()
      }),
      success: function(response) {
        localStorage.setItem("accessToken", response);
        window.location.href = "UserAccountPage.html";
      }
    });
  });
});

ContentType включает только результаты вызова AJAX (в ответе ожидается JSON)