欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

nodejs根據(jù)ip數(shù)組在百度地圖中進(jìn)行定位

 更新時間:2017年03月06日 15:17:20   作者:Glitter_galaxy  
本文主要介紹了nodejs根據(jù)ip數(shù)組在百度地圖中進(jìn)行定位的方法,具有很好的參考價值。下面跟著小編一起來看下吧

利用node接收到的ip數(shù)組組裝url后對百度地圖api發(fā)送請求并返回請求結(jié)果數(shù)組給前端

1. 前端代碼部分(jquery)

重要步驟:

1> 引用百度地圖

2> 實(shí)例化百度地圖,添加相關(guān)縮放控件,設(shè)置主圖

3> 重寫http請求,設(shè)置contentType并對請求數(shù)據(jù)作轉(zhuǎn)化為json對象處理

4> 發(fā)送請求數(shù)據(jù),將請求結(jié)果轉(zhuǎn)化成可處理對象

5> 根據(jù)響應(yīng)結(jié)果的經(jīng)緯度進(jìn)行定位,添加默認(rèn)覆蓋物和iplabel

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=OxLYdFmu3YS1haMUcaBmGMBK0P7PbOqb"></script>
<body>
<div>
<input type="text" id="ipAddress"/>
</div>
<div id="allmap"></div>
</body> 
</html>
<script type="text/javascript">
var map = new BMap.Map("allmap");
// var point = new BMap.Point(116.331398,39.897445);
// map.centerAndZoom(point,12);
map.addControl(new BMap.NavigationControl()); // 添加平移縮放控件
map.addControl(new BMap.ScaleControl()); // 添加比例尺控件
map.addControl(new BMap.OverviewMapControl()); //添加縮略地圖控件
map.enableScrollWheelZoom(); //啟用滾輪放大縮小
map.addControl(new BMap.MapTypeControl()); //添加地圖類型控件
map.setMapStyle({style:'midnight'});
function http(url,method,dataObj){
var formdata = JSON.stringify(dataObj);
//異步操作
var defer = $.Deferred(); 
//發(fā)送
$.ajax({
url : url,
type : method,
data : formdata,
contentType:'application/json; charset=utf-8',
success : function(data){
defer.resolve(data);//執(zhí)行狀態(tài)從"未完成"改為"已完成"
},
error : function(data){
defer.reject(data);
}
});
return defer.promise();
}
//根據(jù)ip數(shù)組獲取位置數(shù)組
var arr = ['112.18.17.7','112.118.17.7'];
var locationArr = [];
getLocate();
function getLocate(){ 
http('http://127.0.0.1:8081/map','post',arr).then(function(data){
for (var i = 0; i < data.length; i++) {
var temp = JSON.parse(data[i]);
var obj = {
'ip': arr[i],
'x': temp.content.point.x,
'y': temp.content.point.y,
}
locationArr.push(obj);
} 
//添加標(biāo)注
addMarker();
});
}
//根據(jù)ip獲取位置
// function getLocate(){ 
// http('http://127.0.0.1:8081/map','post',{'ip':'112.13.41.2'}).then(function(data){
// console.log(data);
// var obj = {
// 'ip': '115.3.4.2',
// 'x': data.content.point.x,
// 'y': data.content.point.y,
// }; 
// //添加標(biāo)注
// addMarker(obj);
// });
// }
// 創(chuàng)建多個標(biāo)注
function addMarker(){
for (var i = 0; i < locationArr.length; i ++) {
var temp = locationArr[i];
var point = new BMap.Point(temp.x, temp.y);
map.centerAndZoom(point,8);
var marker = new BMap.Marker(point);
map.addOverlay(marker);
var label = new BMap.Label(temp.ip,{offset:new BMap.Size(20,-10)});
marker.setLabel(label);
}
}
//創(chuàng)建一個標(biāo)注
// function addMarker(temp){
// console.log(temp.x);
// var point = new BMap.Point(temp.x, temp.y);
// map.centerAndZoom(point,12);
// var marker = new BMap.Marker(point);
// map.addOverlay(marker);
// var label = new BMap.Label(temp.ip,{offset:new BMap.Size(20,-10)});
// marker.setLabel(label);
// }
</script>

2. 后端代碼(nodejs)

步驟:

1> 引入http模塊,express模塊,body-parser模塊

2> 設(shè)置允許跨域請求和請求響應(yīng)的數(shù)據(jù)類型

3>設(shè)置接口請求回調(diào)函數(shù)

4>請求回調(diào)函數(shù)中,取到獲取的數(shù)據(jù)并遍歷,向百度api發(fā)起請求

5>獲取到百度的響應(yīng)數(shù)據(jù)后push進(jìn)數(shù)組,并對前端請求作出響應(yīng)

var http = require('http');
var express = require('express');
var app = express(); //實(shí)例化
var key = 'OxLYdFmu3YS1haMUcaBmGMBK0P7PbOqb'; //百度api的key
var bodyParser = require('body-parser');
// 創(chuàng)建 application/x-www-form-urlencoded 編碼解析
// var urlencodedParser = bodyParser.urlencoded({ extended: false })
app.use(bodyParser.json()); //json編碼
//設(shè)置跨域訪問
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With,Content-Type");
res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE");
res.header("X-Powered-By",' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
//post請求,url/map
app.post('/map',function(req,res){
var ipArr = req.body;
var result = Array();
for (var i = 0; i < ipArr.length; i++) {
var tree = '';
var options = { 
hostname: 'api.map.baidu.com', 
port: 80, 
path: '/location/ip?ak=' + key + "&coor=bd09ll&ip=" + ipArr[i], 
method: 'GET' 
}; 
// 向遠(yuǎn)程服務(wù)器端發(fā)送請求
var getLocation = http.request(options, function(response){
response.on('data', function(data) {
tree += data;
result.push(tree); 
//避免緩存
tree = ''; 
}); 
}); 
getLocation.end(); 
}
//延后發(fā)送請求響應(yīng)
setTimeout(function(){
res.status(200).send(result);
}, 500);
})
//監(jiān)聽8081接口打印請求域名和端口
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("應(yīng)用實(shí)例,訪問地址為 http://%s:%s", host, port)
})

以上就是本文的全部內(nèi)容,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助,同時也希望多多支持腳本之家!

相關(guān)文章

  • IDEA中配置運(yùn)行node.js的完整過程

    IDEA中配置運(yùn)行node.js的完整過程

    為了使在終端使用npm,我們可以配置環(huán)境變量,這篇文章主要給大家介紹了關(guān)于IDEA中配置運(yùn)行node.js的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
    2022-10-10
  • 淺談HTTP 緩存的那些事兒

    淺談HTTP 緩存的那些事兒

    HTTP 緩存機(jī)制作為 Web 應(yīng)用性能優(yōu)化的重要手段,是想要成為前端架構(gòu)的必備技能。這篇文章主要介紹了淺談HTTP 緩存并用node實(shí)現(xiàn)緩存,非常具有實(shí)用價值,需要的朋友可以參考下
    2018-10-10
  • node版本沖突問題的解決方案

    node版本沖突問題的解決方案

    因?yàn)轫?xiàng)目用的依賴和要運(yùn)行環(huán)境的node.js版本起了沖突,下面這篇文章主要給大家介紹了關(guān)于node版本沖突問題的解決方案,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
    2023-06-06
  • 搭建基于express框架運(yùn)行環(huán)境的方法步驟

    搭建基于express框架運(yùn)行環(huán)境的方法步驟

    Express提供了一個輕量級模塊,把Node.js的http模塊功能封裝在一個簡單易用的接口中,這篇文章主要介紹了搭建基于express框架運(yùn)行環(huán)境的方法步驟,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2018-11-11
  • 基于模板引擎Jade的應(yīng)用(詳解)

    基于模板引擎Jade的應(yīng)用(詳解)

    下面小編就為大家分享一篇基于模板引擎Jade的應(yīng)用詳解,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2017-12-12
  • 淺談Express異步進(jìn)化史

    淺談Express異步進(jìn)化史

    本篇文章主要介紹了淺談Express異步進(jìn)化史 ,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-09-09
  • Nodejs實(shí)現(xiàn)的一個簡單udp廣播服務(wù)器、客戶端

    Nodejs實(shí)現(xiàn)的一個簡單udp廣播服務(wù)器、客戶端

    這篇文章主要介紹了Nodejs實(shí)現(xiàn)的一個簡單udp廣播服務(wù)器、客戶端,本文直接給出實(shí)現(xiàn)代碼,需要的朋友可以參考下
    2014-09-09
  • nodejs取得當(dāng)前執(zhí)行路徑的方法

    nodejs取得當(dāng)前執(zhí)行路徑的方法

    今天小編就為大家分享一篇nodejs取得當(dāng)前執(zhí)行路徑的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2018-05-05
  • Node.js 利用cheerio制作簡單的網(wǎng)頁爬蟲示例

    Node.js 利用cheerio制作簡單的網(wǎng)頁爬蟲示例

    本篇文章主要介紹了Node.js 利用cheerio制作簡單的網(wǎng)頁爬蟲示例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-03-03
  • 淺談Node Inspector 代理實(shí)現(xiàn)

    淺談Node Inspector 代理實(shí)現(xiàn)

    這篇文章主要介紹了淺談Node Inspector 代理實(shí)現(xiàn),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-10-10

最新評論