从远程响应中检索 JSON 数据

Posted 2023-05-08

【中文标题】从远程响应中检索 JSON 数据

【英文标题】：JSON Data retrieval from Remote Response

【发布时间】：2017-08-10 14:01:35

【问题描述】：

我正在做一个项目，我需要获取 JSON 响应并在 Google 地图中显示标记。当我尝试从 .json 测试文件中获取 JSON 响应时，它工作正常（代码如下）。但是当我尝试类似的代码从远程 URL 获取 JSON 响应时，它不起作用。我不确定我错过了哪里。

带有 geoLocationDataSet.json 测试文件的代码。

getPetsLocations: function (lat, lng, max) 

            return $.getJSON("data/geoLocationDataSet.json") ;

           ,

geoLocationDataSet.json 文件中的输入数据集：

[
    
        "type":"LOST",
        "alertID":"320",
        "petID":"11534",
        "dateTime":"03\/14\/2017",
        "petName":"Samson",
        "ownerName":"TEMP_Haywood",
        "reward":"100",
        "distance":"7",
        "latitude":"27.9506",
        "longitude":"-82.3672",
        "place":"Greater Palm River Point CDC 33619",
        "image":null
    ,
    
        "type":"LOST",
        "alertID":"328",
        "petID":"11132",
        "dateTime":"03\/14\/2017",
        "petName":"Tucker",
        "ownerName":"TEMP_Phyliss",
        "reward":"0",
        "distance":"12",
        "latitude":"27.9506",
        "longitude":"-82.2872",
        "place":"Villa Place 33510",
        "image":"https:\/\/s3.amazonaws.com\/petimage\/58c857b9c7ee8"
        
]

现在，这是无效的远程 URL 的代码，我得到了响应，但是当我尝试返回数据时，它无法像上面的示例一样返回预期的数据集，无法在 Google 地图中显示标记。

getPetsLocations: function (lat, lng, max) 
            //alert('Before call..');
            $.getJSON("http://dev.mywaggintales.com/pets/d_lostfound.php?mce=27.939224,-82.462295&mra=25&mem=[e-mail]&mac=1234", function(data)
                alert(JSON.stringify(data.ds_petAlert[1]));
                return data.ds_petAlert[1]; 
           );  
,

我不确定我在哪里失踪。如果您在我解析 JSON 数据并返回它时请看一下并告诉我上面代码的问题，那就太好了。

【问题讨论】：

要么将响应返回到函数中，要么查看承诺

How do I return the response from an asynchronous call?的可能重复

谢谢。您能否更改代码并与我分享？我对 JS 还很陌生，跟不上。

不重复，我尝试了这些方法，不幸的是对我不起作用。

你至少需要尝试一下，这个问题足以帮助你

【参考方案1】：

这是您在远程 URL 中传递的 callback 函数。你不能只返回数据，因为回调函数实际上并没有被你调用。

使用回调函数的一个简单方法是在外部创建一个新函数：

function onReceiveData(data) 
 // you will get your data here.


// your code.
getPetsLocations: function (lat, lng, max) 
            //alert('Before call..');
            $.getJSON("http://dev.mywaggintales.com/pets/d_lostfound.php?mce=27.939224,-82.462295&mra=25&mem=[e-mail]&mac=1234", function(data)
                alert(JSON.stringify(data.ds_petAlert[1]));
                onReceiveData(data.ds_petAlert[1]); 
           );  
,

【参考方案2】：

回调函数对我不起作用。但找到了解决办法。我没有调用 getPetsLocations 函数，而是在 initMap 函数中添加了一个 Ajax 调用。下面提供了代码。 - 谢谢。

initMap: function (position) 
            //Delcare function variables
            var myOptions,
                mapObj = _mapObj,
                mapElem = _mapElem,
                pin,
                locations = [],
                latlng;

            _mapElem = mapElem; //Cache DOM element

            // Use Google API to get the location data for the current coordinates
            //latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
            latlng = new google.maps.LatLng(27.9506, -82.4572);

            myOptions = 
                zoom: 11,
                center: latlng,
                mapTypeControl: false,
                navigationControlOptions:  style: google.maps.NavigationControlStyle.SMALL ,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            ;


            mapObj = new google.maps.Map(mapElem, myOptions);
            _mapObj = mapObj; //Cache at app level

            pin = [
                
                    position: latlng,
                    title: "New York"
                
            ];

            _private.addMarkers(pin, mapObj);
            // Get stores nearby
            $.ajax(
                type: "GET",
                url: "http://dev.mywaggintales.com/pets/d_lostfound.php?mce=27.939224,-82.462295&mra=25&mem=[e-mail]&mac=1234",
                success: function (data) 
                    setTimeout(function () 
                        //do what you need here
                        var result1 = JSON.parse(data);
                        var result = result1.ds_petAlert[1];
                        //options.success(lostPets);

                        var len = result.length,
                            pinImage = new google.maps.MarkerImage(
                                "images/lostPet.png",
                                new google.maps.Size(49, 49),
                                new google.maps.Point(0, 202));

                        for (var i = 0; i < len; i++) 
                            locations.push(
                                title: result[i].petName + ", " + result[i].place,
                                position: new google.maps.LatLng(result[i].latitude, result[i].longitude),
                                icon: pinImage,
                                animation: google.maps.Animation.DROP
                            );
                        
                    _private.addMarkers(locations, mapObj);
                    , 1500);
                ,
                error: function (err) 
                    alert("Error reading the data");
                    options.error(err);
                
            );
        ,