2

我正在创建一个基本功能,允许用户将他们的位置发送到服务器,然后服务器查询数据库并返回他们附近的位置。我正在使用下面的 jQuery .ajax 包装器将数据发布到服务器。这采用 latlon 点的形式,然后用作 MongoDB 中使用 nodejs 进行地理搜索的基础,并在后端表达。然后将搜索结果返回给客户端并由 createMapListings 函数呈现。

/find 页面最初是通过与以下代码分开的 mongodb 对数据库的 GET 请求呈现的。然而,在初始渲染之后,我想根据提供的位置返回结果。

POST 方法工作正常,位置已发布到服务器,并返回搜索结果,因为我可以通过控制台日志打印内容。

但是,我想在客户端呈现结果。如前所述,搜索结果在控制台中呈现,但是当我尝试传递到客户端时,我可以在#output div 中呈现数据本身(以对象数组的形式),但是 createMapListings 函数似乎没有捕捉到数据。

事实上,下面的函数似乎被调用,但打印出超过一千行,其中应捕获的数据描述为“未定义”。我尝试使用 res.render 和 res.redirect,但在第一种情况下,视图呈现在 div 中(我认为这是预期的)并且重定向失败。

当向服务器发出简单的 GET 请求时,createMapListings 函数可以正常工作,例如,对于集合中的所有对象,使用 ejs 模板。但是,我认为这里的问题可能是 POST 请求的组合,然后希望使用完整的回调将结果传递回 AJAX 请求。

如果以下代码有些迟钝,我深表歉意。我绝对是你所说的初学者。我很欣赏上述功能可能无法实现,所以如果有更好的方法,我当然会接受它(也许是 res.direct)。

这是相关的客户端脚本:

$(document).ready(function(){

$("#geolocate").click(function(){ 
navigator.geolocation.getCurrentPosition(geolocate, function(){

        });
     });
 });

function geolocate(pos){
     var latlonpt = [];
     var x = pos.coords.latitude;
     var y = pos.coords.longitude;
     latlonpt.push(x);
     latlonpt.push(y); 

    var obj = {
    userlocation: latitudelongitudept
    };

   $.ajax({
    url: "/find",
    type: "POST",
    contentType: "application/json",
    processData: false,
    data: JSON.stringify(obj),
    complete: function (data) {
        $('#output').html(data.responseText);
        $('#infooutput').children().remove();
        createMapListings(data.responseText); 
        }
     });
 };


 function createMapListings(maps) {
 for (var i = 0; i < maps.length; i++) {
 var url = maps[i]._id;
 var fullurl = "<a href='/show?id=" + url + "'>Route</a></div>";
 var title = "<div>" + maps[i].title + " - " + fullurl +"";
 $('#infooutput').append(title);

     };
  };

 </script>

这是基本快递应用程序中用于处理上述 .ajax 包装器发出的发布请求的相关路由。

 exports.findbylocation = function(req, res) {
 console.log(req.body.userlocation);
 var userlocation = req.body.userlocation;
 Map.ensureIndexes;
 Map.find({loc :{ $near : userlocation }}, function(err, maps) {

 if (err) { 
          console.log(err)
          }
 else {    
       var jmaps = JSON.stringify(maps);
       console.log(jmaps);
       res.send(jmaps);
      }      
   });
};
4

2 回答 2

4

按照惯例,回调签名data中的变量名$.ajax指的是已解析的 HTTP 响应正文。由于您的回调是 on complete,我们实际上通过了 XMLHttpRequestused,按照约定称为xhr. 您正确地获取了该responseText属性,但这需要解析才能有用。只要我们照顾好我们Content-Type的 's 并且不明确禁用processData,jQuery 就会为我们进行编码/取消编码——我们只是处理对象。这是一件好事,因为传输格式通常对应用程序逻辑并不特别重要。如果我们使用res.json(maps)代替res.send(jmaps),我们可以更简单地编写我们的调用:

$.ajax({
    url:  '/find',
    type: 'POST',
    data: obj,

    success: function(data) {},
    error:   function(xhr, text, err) {}
});

data是一个已经解析并可以使用的 Javascript 对象。我们还使用默认application/x-www-form-urlencoded请求而不是显式设置contentType. 就 express 而言,这是一样的:它只会被urlencoded而不是json解析。

于 2012-09-28T11:40:18.590 回答
0

假设你解决了你的客户问题。

由于您使用 express 没有必要JSON.stringfy,您可以使用res.json(maps).

于 2012-09-28T13:47:56.983 回答