javascript - Ajax 处理订单

Question

这个问题已经有答案了:

How do I return the response from an asynchronous call? (42 个回答)

已关闭 4 年前。

在这个项目中，我尝试在主 php 中使用 Javascript 中的 url 来 Ajax 到后端 php 调用 getWeather.php。它会从 url 获取数据并将其返回给 Javascript然而，在 Ajax 发布后我不断丢失变量(未定义)。于是我把结果打印出来看看，当我尝试将php返回结果赋给Javascript变量时，我发现Ajax返回值还没有完成。

在我的脚本中，单击按钮时:

 function post (inputString) {
        var result;
        var url ="http://api.openweathermap.org/data/2.5/weather?lat=42.5559287&lon=-92.84954249999998&lang=en&units=metric&appid=MY_API_KEY";

        $.post("getWeather.php",
        {
            postData: url,
        },
        function(data, status){
            alert("Data: " + data + "\nStatus: " + status);
            // console.log("Data: " + data + "\nStatus: " + status);
            //CONSOLE #1
            console.log("url Input: \n" + url + " \n\ndata : \n" + data);
            result = data;
        });
        //CONSOLE #2
        console.log("url Input: \n" + url + " \n\nResult : \n" + result);
    }

在 PHP 中，postData 是 get 的:

    $s = $_REQUEST['postData'];
echo getWeather_PHP($s);

function getWeather_PHP($url) {
    $contents = file_get_contents($url);
    $clima=json_decode($contents);
    $temp_max=$clima->main->temp_max;
    $temp_min=$clima->main->temp_min;
    $icon=$clima->weather[0]->icon.".png";
    //how get today date time PHP :P
    $today = date("F j, Y, g:i a");
    $cityname = $clima->name; 
    $date =  $cityname . " - " .$today . "<br>";
    $max = "Temp Max: " . $temp_max ."&deg;C<br>";
    $min =  "Temp Min: " . $temp_min ."&deg;C<br>";
    $output = $date." ".$max." ".$min;
    $output = (string)$output;
    // echo $output;
    return $output;
}

最终结果是:最后的结果是:~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~//控制台#2网址输入:http:/............

结果:未定义

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

//控制台 #1ajaxTest.php:24 url​​ 输入:http:/............

数据:阿普灵顿 - 2018 年 10 月 1 日晚上 8:12 最高气温:13.9 摄氏度 最低气温:12 摄氏度

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

因此 CONSOLE #2 早于 CONSOLE #1 完成所以看来我无法正确得到结果的错误？？？我该如何解决这个问题？或者有什么流行的方法可以做同样的事情吗？

感谢您的帮助

Answer 1

Ajax 是异步的。这意味着代码执行将继续，无需等待响应，因此 CONSOLE #2 在 CONSOLE #1 之前触发的预期行为。传递给 $.post 的回调函数将在请求完成后被触发，您应该根据应该从请求接收的数据使用它来执行任何操作。此外，最好添加一些错误处理，以防请求因任何原因失败。此外，您现在还可以将 Promise 与 $.post 一起使用，这可能会帮助您链接多个请求并轻松处理所有错误。更多详细信息 -> https://api.jquery.com/jquery.post/