将HTML5地理位置结果发送回Node / Express Server

查理

我正在使用HTML5地理位置来检索用户经纬度,并想将其传递回服务器,以与商店经纬度坐标列表进行比较,并返回最接近的五位纬度。地理位置API返回lat / lng坐标客户端完全没有问题,我只是找不到找到将信息返回到服务器并同时渲染新页面的方法。我尝试使用$ .post方法,将坐标附加到data:对象。

客户端Javascript

function sendToServer(lat,lng){
     $.ajax({
          type: "POST",
          url: "/search",
          data: {lat: lat, lng: lng},
          success: function(data){
               alert('Successful');
          },
     });
}

从console.log呼叫服务器端可以看到,坐标已成功传递。server.js

app.post('/search', function(req,res){
     console.log(req.body);                           <-- does show lat/lng coords
     res.render('./pages/search' , {
          shops: coords.getNearestFive(req.body)      <-- just to give idea 
     });
});

我只将shops对象与渲染一起传递给您关于我打算如何处理数据的想法,但我还没有尝试过。

'./pages/search'不会呈现给客户端,我读过其他文章,建议使用$ .ajax并不是尝试执行此操作的好方法,但是我找不到解决方案。我尝试使用'GET'方法,但是即使页面确实正确加载,我也无法从服务器端检索lat / lng坐标。奇怪的是我已经使用Google联网工具检查了请求/响应,并且响应确实显示了呈现的“ ./pages/search”,尽管这没有反映在浏览器中。

这是我的锚点,用作获取坐标的按钮

<a href="/search" class="geoSearch"> Find My Location! </a>

有谁知道,我如何传递和获取坐标以及能够加载所选页面?谢谢

**** 更新 ****

我已经设法通过使用req.query从服务器端获取经纬度详细信息,并将res.render()调用包装在setTimeout函数中,该函数的确确实很hacky。

app.get('/search', function(req,res){
     console.log(req.query);             <-- logs passed lat/lng
     res.render('./pages/search');
});

客户端点击处理程序

$('.geoSearch').on('click', function(){
     getCoords();
});

客户端Ajax请求

function sendToServer(lat,lng){
     $.ajax({
          type: "GET",
          url: "/search",
          contentType: "application/json",
          data: JSON.stringify({lat: lat, lng: lng}),
          success: function(data){
               alert('Successful');
          },
     });
}

服务器端

app.get('/search', function(req,res){
     var beQuick = req.query;
     console.log(beQuick);
     setTimeout(function(){              
          res.render('./pages/search');
     },1000);
});

有没有更好的方法允许req.query填充变量服务器端,而不必在渲染新页面时通过setTimeout添加延迟?谢谢

查理

如果有人遇到这种问题,我发现了一种相对简单的方法,可以使用websockets来回传递数据。为此,您需要将socket.io作为项目中的依赖项以及一些额外的代码。

服务器端JS

//allow socket IO to latch onto HTTP server
var server = http.createServer(NYise);
var io = require('socket.io').listen(server);

//reacts to an event emitted on the client side 
io.on('connection', function(socket){
     socket.on('coords', function(yourDataPassed){
          //whatever you intened to do with your data
     });
});

客户端JS

<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>


     //emit back to server  <-- my code is held in another function. 
     var socket = io();
     socket.emit('coords', {lat: lat, lng: lng});

我的代码保存在其他函数中,因此可能会造成混淆。链接SocketIO文档进一步信息- http://socket.io/docs/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

HTML5地理位置与Google Maps地理位置api

来自分类Dev

使用html5地理位置api创建地理围栏

来自分类Dev

Javascript和HTML5地理位置-如何存储位置?

来自分类Dev

HTML5地理位置,点击时将经/纬度传递给PHP变量

来自分类Dev

SQL Server Express维护

来自分类Dev

SQL Server Express备份

来自分类Dev

sql server express权限

来自分类Dev

SQL Server Express 复制

来自分类Dev

不使用回调时的结果不确定。Nodejs,Express和SQL Server Express

来自分类Dev

不使用回调时的结果不确定。Nodejs,Express和SQL Server Express

来自分类Dev

Visual Studio MVC 5和SQL Server Express查询

来自分类Dev

HTML5地理位置watchPosition仅被调用一次

来自分类Dev

HTML5地理位置不等待用户输入

来自分类Dev

各种浏览器中的HTML5地理位置API

来自分类Dev

在Rails中发布表单时使用HTML5地理位置

来自分类Dev

HTML5地理位置不正确

来自分类Dev

HTML5地理位置不同步

来自分类Dev

需要HTML5地理位置+ javascript帮助

来自分类Dev

Google Maps API中的HTML5地理位置

来自分类Dev

Symfony2:IvoryGoogleMapBundle中的HTML5地理位置API

来自分类Dev

HTML5地理位置不正确

来自分类Dev

HTML5地理位置跟踪未返回正确的坐标

来自分类Dev

使用HTML5地理位置在这里映射

来自分类Dev

html5地理位置是否存在“ GPS状态已更改”事件?

来自分类Dev

无法获取html5地理位置坐标

来自分类Dev

如何将Bak文件导入SQL Server Express

来自分类Dev

将VB.net连接到SQL Server Express MDF

来自分类Dev

How to create a simple html server using express js

来自分类Dev

如何使用HTML5地理位置javascript使用地理位置(用户的当前位置)初始化Google Maps API

Related 相关文章

热门标签

归档