使用 AJAX 发出 POST 请求不起作用答案

【问题标题】：Make a POST request using AJAX doesn't work使用 AJAX 发出 POST 请求不起作用
【发布时间】：2016-03-29 07:23:32
【问题描述】：

我有一个纯 javascript 代码，我需要发送一个 JSON（可能很大，因此超过了 GET 限制....），所以我想使用 AJAX 进行 POST 请求。

我的代码是...

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8" />
      <title>Test POST via AJAX</title>
    </head>
    <body>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
      <script>
        var waypoints = [{
                "options": {
                    "allowUTurn": false
                },
                "latLng": {
                    "lat": 44.911434,
                    "lng": 7.671602
                },
                "name": "Corso Vinovo, Carignano, TO, Piemonte, Italia",
                "_initHooksCalled": true
              }, {
                "options": {
                    "allowUTurn": false
                },
                "latLng": {
                    "lat": 44.910167,
                    "lng": 7.676274
                },
                "name": "Il Tempio del Pane, Corso Cesare Battisti, Carignano, TO, Piemonte, Italia",
                "_initHooksCalled": true
              }, {
                "options": {
                    "allowUTurn": false
                },
                "latLng": {
                    "lat": 44.908034,
                    "lng": 7.675075
                },
                "name": "Banca Intesa, Via Ferdinando Salotto, Carignano, TO, Piemonte, Italia",
                "_initHooksCalled": true
        }];

        alert ('Waypoints --> ' + JSON.stringify(waypoints));

        $.ajax({
          type: "POST",
          url: "NewPage.php",
          contentType: "application/json",
          data: JSON.stringify(waypoints),
          success: function()
           {
            alert("OK ...");
           },
          error: function()
           {
             alert("KO ...")
           }
        })

       alert('After post request ...');

    </script>
   </body>
  </html>

这里是 NewPage.php 的代码

<?php
    echo 'Waypoints ?????';
    print_r($_POST)
?>

执行代码我可以看到我的 AJAX 代码提醒我“OK”，但我看不到关于我的 NewPage.php 的任何内容

我对这些东西很陌生，很抱歉平庸....

任何建议，例如，jsfiddle，替代？

提前非常感谢！

切萨雷

【问题讨论】：

你想从你的 NewPage.php 中看到什么？
你的成功回调中没有任何返回变量。它应该从服务器端获取结果，在打印后放置骰子或退出。
现在我想看看（echo ...），从第一个html页面发送的JSON，我将把我的业务代码放在...之后。谢谢
将data 添加到您的success 中，例如：- success: function(data) 并检查data 中返回的内容。
$data = $_POST['waypoints']; echo json_encode($data); 在 php 中 $.ajax({ type: "POST", url: "NewPage.php", dataType: "json", data: { waypoints: JSON.stringify(waypoints) }, success: function(data) { alert(data); }, error: function() { alert("KO ...") } }) 在 ajax 中

标签： javascript jquery json ajax post

【解决方案1】：

你应该在 php 中使用 die。

 <?php
       echo json_encode($data_to_pass);
       die;
    ?>

在你的 javascript 文件中你应该使用

success: function(data)
           {
            alert(data);
           },

【讨论】：

【解决方案2】：

由于您使用的内容类型为 application/json，因此您应该从您的 php 页面返回结果的 json_encode。也使用 exit 否则你会想知道为什么它返回整个页面而不仅仅是 json 数据。

echo json_encode($some_data);
exit();

【讨论】：

【解决方案3】：

        $.ajax({
          type: "POST",
          url: "NewPage.php",
          dataType: "json",
          data: {'waypoints':waypoints},
          success: function(resp)
           {
            //alert("OK ...");
           },
          error: function()
           {
             //alert("KO ...")
           }
        })

NewPage.php

            <?php
                echo 'Waypoints ?????';
                print_r($_POST['waypoints']);
            ?>

【讨论】：

【解决方案4】：

尝试将 data: waypoints 更改为 data: {mydata : waypoints}。直接传递你的数组会导致 jQuery 以一种奇怪的格式传递它。http://api.jquery.com/jQuery.param/

【讨论】：

【解决方案5】：

你还没有使用ajax成功回调返回的响应

$.ajax({
          type: "POST",
          url: "NewPage.php",
          contentType: "application/json",
          data: JSON.stringify(waypoints),
          success: function(response)
           {
            alert(response);
           },
          error: function(err)
           {
             alert(err)
           }
        })

还有

alert('After post request ...');

在 ajax 调用完成后不会执行，它会在 ajax 请求完成后被调用，独立于它完成或挂起。你的东西在成功或错误中也是如此

【讨论】：

【解决方案6】：

将您的成功回调更改为：

success: function(data)
           {
            alert(data);
           },

一旦 AJAX 发布成功完成，您应该会在警报内的 PHP 页面中看到正在回显的内容。

【讨论】：