API RESTful не получает кнопку POST от AJAX

Question

У меня есть кнопка AJAX для публикации поста, которая отправляет JSON в RESTful API для выполнения всего моего внутреннего кода.Из моего устранения неполадок кажется, что кнопка AJAX даже не отправляет запрос POST в API, но я могу ошибаться.Я попробовал несколько вещей, чтобы получить ответ на запрос AJAX ... но я никогда ничего не получаю в своем console.log.

Я слежу за серией руководств YouTube и даже пытался копировать и вставлять учебникикод из GitHub, но я все еще ничего не получаю в console.log.

---

Так что моя кнопка «Мне нравится» имеет поле идентификатора данных, которое прослушивает AJAX.Код кнопки: ...

<div><button class="btn btn-primary"  data-id="'+posts[index].PostID+'" type="button" id="InteractButt" style="background-image: url(&quot;assets/img/Thumbs%20Up.png&quot;);"></button> // Code for displaying amount

Мой AJAX-запрос прослушивает кнопки с идентификаторами данных ...

<script type="text/javascript">
        $('[data-id]').click(function() {
             var buttonid = $(this).attr('data-id');
                $.ajax({
                        type: "POST",
                        url: "api/likes?id=" + $(this).attr('data-id'),
                        processData: false,
                        contentType: "application/json",
                        data: '',
                        success: function(r) {
                        var res = JSON.parse(r)
                        console.log(r)
                        // $("[data-id='"+buttonid+"']").html(' <i class="glyphicon glyphicon-heart" data-aos="flip-right"></i><span> '+res.Likes+' Likes</span>')
                       },
                        error: function(r) {
                        console.log(r)
                                            }
                        });
                    }); 
     </script>

И мой API ожидает действия этого кода;

        else if ($_GET['url'] == "likes") {
        $postId = $_GET['id'];
                $likerId = Login::isLoggedIn();
                // code to sort out liked.. then reply with the count in JSON
                echo "{";
                echo '"Likes":';
                echo $db->query('SELECT likes FROM posts WHERE id=:postid', array(':postid'=>$postId))[0]['likes'];
                echo "}";
        }

Answer 1

Вы отправляете почтовый запрос AJAX. Вам не нужно отправлять id сообщения с параметром GET. Вы можете просто получить идентификатор на стороне API с помощью $ _POST.

Используйте FormData Jquery для отправки идентификатора вашему API в виде данных , как это.

var formData = new FormData();
formData.append('id', $(this).attr('data-id'))

$.ajax({
    method: "POST",
    url: "api/likes",
    data: formData,
    processData: false,
    contentType: false,
    dataType: 'json',
    success: function(r) {
        var res = JSON.parse(r)
        console.log(r)
    },
    error: function(r) {
        console.log(r)
    });
}); 

И захватите данные в конце API следующим образом.

$postId = $_POST['id']

Answer 2

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

Мой AJAX-слушатель должен был находиться в цикле foreach при создании сообщений.У меня это было как отдельный скрипт внизу страницы ...

Я учусь ...

Answer 3

Во-первых, отправка запроса POST на ваш сервер препятствует доступу к строкам запроса через GET в php. Просто измените ваш тип на GET, и вы в порядке. Если он все еще не работает, измените тип контента на «application / x-www-form-urlencoded» вместо «application / json»:

<script type="text/javascript">
    $('#InteractButt').click(function() {
         // console.log('hello'); just to make sure somethin happens when you click...
         var buttonid = $(this).attr('data-id');
            $.ajax({
                    type: "GET",
                    url: "api/likes?id=" + $(this).attr('data-id'),
                    processData: false,
                    contentType: "application/json",
                    data: '',
                    success: function(r) {
                    var res = JSON.parse(r)
                    console.log(r)
                    // $("[data-id='"+buttonid+"']").html(' <i class="glyphicon glyphicon-heart" data-aos="flip-right"></i><span> '+res.Likes+' Likes</span>')
                   },
                    error: function(r) {
                    console.log(r)
                                        }
                    });
                }); 
 </script>

Надеюсь, это сработает ...!

UPDATE

Я просто реализую то, что пытался бы сделать

<div>
  <button class="btn btn-primary"  data-id="posts[index].PostID" type="button" id="InteractButt" style="background-image: url(&quot;assets/img/Thumbs%20Up.png&quot;);"></button>
</div>
<script>
$('#InteractButt').on('click', function(){
  var buttonid = $(this).attr('data-id');
  $.post('api/likes', { 'buttonid': buttonid }, function(data, xhr, status){
    console.log(JSON.parse(data));
  }
}
</script>

и мой php будет выглядеть так ...

$postid = $_POST['buttonid'];