成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

nodejs抓取別人家的頁面的始末

開發 前端
2015年9月份全國研究生數學建模競賽的F題,旅游線路規劃問題。其中需要自己去查很多數據。例如所給201個5A級景區的位置,以及景區距離所 在省會距離等等~開始隊友小伙伴準備從百度手動去一個一個查詢,但是效率極低,在這么短的時間內,需要收集這么多數據是多么的耗時,并且也不能把大把時間 花費在查資料上,雖然說查資料是必須的,題目也鼓勵我們從網上查詢相關數據,因此在團隊中的我就想到了讓計算機幫我們去做這件事。

內容:分析并獲取頁面調取數據的API(接口),并跨域獲取數據保存在文檔中(nodejs做代理-CORS)

事由以及動機

2015年9月份全國研究生數學建模競賽的F題,旅游線路規劃問題。其中需要自己去查很多數據。例如所給201個***級景區的位置,以及景區距離所 在省會距離等等~開始隊友小伙伴準備從百度手動去一個一個查詢,但是效率極低,在這么短的時間內,需要收集這么多數據是多么的耗時,并且也不能把大把時間 花費在查資料上,雖然說查資料是必須的,題目也鼓勵我們從網上查詢相關數據,因此在團隊中的我就想到了讓計算機幫我們去做這件事。

***步,確定想要抓取的信息,獲取數據服務api

以查詢個兩地的行車時間為例,我們以百度地圖為例,見下圖

先打開需要去請求數據的網頁,打開開發人員工具(我用的是chrome),選擇Network選項卡,輸入需要查詢的內容(tips:先清除掉之前的網絡獲取紀錄,以方便接下來的借接口分析)。

點擊“查詢”,并監控網絡數據流,會發現網頁發起了很多的http請求,并返回了結果。

 通過分析所有請求,拿到想要的請求接口(一般情況下,都不會是Type為圖片類型的,并且耗時較長的)。

點擊某個請求時能看到該請求的詳細信息

查看請求的頭部信息Headers

拿到請求的地 址:requestURL,例如:http://map.baidu.com/?newmap=1&reqflag=pcmap& biz=1&pcevaname=pc2&da_par=direct&from=webmap&qt=nav&da_src=pcmappg.searchBox.button&c=289&sn=2$$$$$$%E4%B8%8A%E6%B5%B7%E5%B8%82$$0$$$$&en=2$$$$$$%E5%8C%97%E4%BA%AC%E5%B8%82$$0$$$$&sc=289&ec=289&rn=5&extinfo=63&tn=B_NORMAL_MAP&nn=0&ie=utf-8&l=12&b=(13503777.31,3639994.64;13542753.31,3642234.64)&t=1443022534161

并分析,一般我們要看的是URL中的querey部分,也就是?后面的內容,一般來說由很多(字母+百分號)構成的為中文字符,是漢字被url轉碼獲得。可以把該地址拿到地址欄查詢一下,漢字的內容

那我們的數據服務API就拿到了

編寫數據訪問頁面

接下來就是利用XMLHTTPRequerst來調取他人的服務了

 

  1. <!DOCTYPE html> 
  2. <html lang="en"
  3. <head> 
  4.     <meta charset="UTF-8"
  5.     <title>getData</title> 
  6. </head> 
  7. <body> 
  8.     <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script> 
  9.     <script> 
  10.         var sn="北京市"
  11.         var en="上海市"
  12.         var url="http://map.baidu.com/?newmap=1&reqflag=pcmap&biz=1&pcevaname=pc2&da_par=direct&from=webmap&qt=nav&da_src=pcmappg.searchBox.button&c=289&sn=2$$$$$$"
  13.         sn+"$$0$$$$&en=2$$$$$$"
  14.         en+"$$0$$$$&sc=289&ec=289&rn=5&extinfo=63&tn=B_NORMAL_MAP&nn=0&ie=utf-8&l=12&b=(13503777.31,3639994.64;13542753.31,3642234.64)&t=1443022534161"
  15.  
  16.         $.ajax({ 
  17.             url:url, 
  18.             type:"get"
  19.             success:function(res){ 
  20.                 console.log(res) 
  21.             }, 
  22.             error:function(e){ 
  23.                 console.log(e) 
  24.             } 
  25.         }) 
  26.     </script> 
  27. </body> 
  28. </html> 
  29.  
  30. html 

運行察看結果:

跨域提示錯誤,跨域(見為什么瀏覽器不能跨域http://www.cnblogs.com/alvinwei1024/p/4626054.html)是瀏覽器的行為。

方法1: 通過jsonp的方法

 

  1. <!DOCTYPE html> 
  2. <html lang="en"
  3. <head> 
  4.     <meta charset="UTF-8"
  5.     <title>getData</title> 
  6. </head> 
  7. <body> 
  8.     <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script> 
  9.     <script> 
  10.         var sn="北京市"
  11.         var en="上海市"
  12.         var url="http://map.baidu.com/?newmap=1&reqflag=pcmap&biz=1&pcevaname=pc2&da_par=direct&from=webmap&qt=nav&da_src=pcmappg.searchBox.button&c=289&sn=2$$$$$$"
  13.         sn+"$$0$$$$&en=2$$$$$$"
  14.         en+"$$0$$$$&sc=289&ec=289&rn=5&extinfo=63&tn=B_NORMAL_MAP&nn=0&ie=utf-8&l=12&b=(13503777.31,3639994.64;13542753.31,3642234.64)&t=1443022534161"
  15.  
  16.         $.ajax({ 
  17.             url:url, 
  18.             type:"get"
  19.             dataType:"jsonp"
  20.              jsonp:"callback"
  21.             success:function(res){ 
  22.                 console.log(res) 
  23.             }, 
  24.             error:function(e){ 
  25.                 console.log(e) 
  26.             } 
  27.         }) 
  28.     </script> 
  29. </body> 
  30. </html> 
  31.  
  32. html 

運行結果:獲取到想要的數據

可以拿到,北京到上海的距離1208548,時間48617以及距離等。

  1. dis1208548

  2. kpsArray[38]

  3. rssArray[38]

  4. taxiObject

  5. time48617

  6. toll580

#p#

方法二:CORS

 除了方法以利用jsonp跨域外,還可以通過服務器做一個代理,通過cors繞過原來資源不允許跨域的限制。

本文利用node來做服務器,原因很簡單,最方便,幾句代碼就能搞定,方便又快捷。

  1. var http = require('http'); 
  2. var request_ = require('request'); 
  3. var urlencode2=require("urlencode2"); 
  4. var url=require('url'
  5. http.createServer(function (request, response) { 
  6.      var arg1 = url.parse(request.url, true).query;  
  7.     var sn=arg1.sn; 
  8.     var en=arg1.en; 
  9.     var req_url="http://api.map.baidu.com/?qt=nav&c=131&sn=2%24%24%24%24%24%24%20"
  10.           urlencode2(sn,'gbk')+"%24%240%24%24%24%24&en=2%24%24%24%24%24%24"
  11.           urlencode2(en,'gbk')+"%24%240%24%24%24%24&sy=0&ie=utf-8&oue=1&fromproduct=jsapi&res=api&callback=BMap._rd._cbk54249"
  12.       request_.get({ 
  13.             url:req_url, 
  14.             json:true 
  15.         }, 
  16.         function(error, response_, body) { 
  17.           if (!error && response_.statusCode == 200) { 
  18.             var res=-1
  19.             if(body){ 
  20.               res=body.split(',"toll":')[0];//time  s 
  21.               res=res.split('"time":')[2]; 
  22.               console.log(res) 
  23.               if(!res){ 
  24.                 res=-1
  25.               } 
  26.               else
  27.                 res=res/60
  28.               } 
  29.             } 
  30.             response.writeHead(200, { 
  31.                 "Content-Type""text/html; charset=UTF-8"
  32.                 'Access-Control-Allow-Origin':request.headers.origin 
  33.             }); 
  34.             response.end(res+'\n'); 
  35.           } 
  36.           else
  37.             // console.log(error) 
  38.           } 
  39.         } 
  40.     ) 
  41. }).listen(8888); 
  42. // 終端打印如下信息 
  43. console.log('Server running at http://127.0.0.1:8888/'); 
  44.  
  45. nodejs 

 其中,本文用到了request(用于發起http請求)模塊和urlencode2(主要用于URLEncode)模塊

request安裝:

npm install request

詳見:https://github.com/request/request

urlencode2安裝:

詳見:https://github.com/node-modules/urlencode

1 var http = require('http');
2 http.createServer(function (request, response) {
3 //...
4 response.end('welcome baby');
5 }).listen(8888);

這幾句簡單的代碼就搭建了一個web服務,端口號是8888

$ node 文件名.js

在終端輸入以上指令即可允許該服務。

1 var arg1 = url.parse(request.url, true).query;
2     var sn=arg1.sn;
3     var en=arg1.en;
4     var req_url="http://api.map.baidu.com/?qt=nav&c=131&sn=2%24%24%24%24%24%24%20"+ 5 urlencode2(sn,'gbk')+"%24%240%24%24%24%24&en=2%24%24%24%24%24%24"+ 6           urlencode2(en,'gbk')+"%24%240%24%24%24%24&sy=0&ie=utf-8&oue=1&fromproduct=jsapi&res=api&callback=BMap._rd._cbk54249";

以上是獲取查詢參數并拼接請求字符串

然后利用request向目標服務器發送請求,并解析出需要的信息

最重要的是以下代碼:

1  response.writeHead(200, {
2 "Content-Type": "text/html; charset=UTF-8", 3 'Access-Control-Allow-Origin':request.headers.origin 4 }); 5 response.end(res+'\n');

允許所有用戶跨域訪問,因此我們就能訪問自己搭建的web服務了。

我在前端頁面只需,請求我們的地址http://localhost:8888

并且指定sn(start node)與 en(end node)一并發送到服務器即可。

相關代碼:https://github.com/AlvinWei1024/blog-resources/tree/master/20150923 

作者:AlvinWei  文章出處:韋躐晟的博客 http://www.cnblogs.com/alvinwei1024/p/4834045.html

責任編輯:王雪燕 來源: 韋躐晟的博客
相關推薦

2024-11-12 08:20:31

2017-09-22 13:22:59

大數據南京大學宿舍

2025-05-30 08:20:54

2017-11-12 21:32:52

戴爾

2025-04-08 08:20:33

2024-10-24 08:21:33

2016-01-08 09:49:19

DockerDocker案例云應用開發

2021-07-14 06:31:08

京東互聯網加薪

2022-12-12 08:14:47

2025-04-22 08:20:51

2024-12-02 00:59:30

Spring

2025-03-06 08:21:02

判空entity對象

2025-02-28 08:21:00

2025-03-11 08:20:58

2021-01-20 05:42:27

RabbitMQMQ vhost

2019-06-11 09:35:50

戴爾

2017-12-25 11:24:57

程序員代碼編程

2017-06-13 14:15:51

戴爾協同計算汽車神話

2017-12-27 09:21:31

程序員華為年終獎

2024-02-20 12:53:41

點贊
收藏

51CTO技術棧公眾號

主站蜘蛛池模板: 久久亚洲一区二区三 | 国产精品一区二区三区99 | 性欧美精品一区二区三区在线播放 | 欧美日韩国产精品一区二区 | 国产成人精品网站 | 日韩在线播放一区 | 成人亚洲一区 | 91精品国产综合久久香蕉麻豆 | 一区二区三区欧美 | 精品欧美在线观看 | 黄色片免费看视频 | 国产色婷婷精品综合在线手机播放 | 色网站入口 | 中文字幕日韩欧美一区二区三区 | 伊人热久久 | 欧美精品一区在线发布 | 亚洲一区二区三区观看 | 欧美二区在线 | 精品国产欧美 | 日韩有码在线观看 | 中文字幕乱码亚洲精品一区 | caoporn免费 | 成人在线精品 | 色偷偷噜噜噜亚洲男人 | 亚洲激情一区二区 | 福利在线看| 在线看成人av | 在线一区| 久久精品这里精品 | 看一级黄色毛片 | www.伊人.com | 一级黄色生活视频 | 久久天堂 | 成人国产精品免费观看 | 亚洲日产精品 | 最新午夜综合福利视频 | 久久国产精品久久 | 国产乱肥老妇国产一区二 | 青青久在线视频 | 福利久久 | 国产精品射 |