這幾天把自己常用的獲取數據的方式整理了下。因自己也是菜鳥一個，還有好多都不知道，所以不是太好，但自己一直用着，就拿出來分享。也為以后自己方便查找。這幾天一直用着anguler，就用anguler寫吧!里面用到了node,所以在使用的時候要看下自己的電腦是否有node 環境。如果還有別的更簡單的方法希望賜教，嘻嘻！
HTML:
<html ng-app="myApp"> <head> <meta charset="UTF-8"> <title>獲取數據</title> </head> <body> <div ng-controller="myController"> <button ng-click="getDataAction()">獲取數據</button> </div> </body> </html> <script src="../lib/angular.js"></script> <script> // http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html var app = angular.module("myApp" , []) .controller("myController" , function($scope , $http){ $scope.getDataAction = function(){ console.log("開始獲取數據"); // #http() // .success() // .error() var url="http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html"; url = encodeURIComponent(url); url = "http://localhost:3000?myUrl=" + url; // $http({ // url:url, // method:"get" // }) // .then(function(res){ // console.log(res); // }),function(err){ // console.log(err); // }; //jsonp //json 通過動態創建script元素來訪問服務器 //把回調函數名作為參數傳遞跟服務器 //服務器請求得到數據以后 把數據放回回調函數中 //前端通過回調函數的實現部分 得到數據 // var script = document.createElement("script"); // url = url + "&callback=xxx"; // script.src = url; // document.documentElement.appendChild(script); //anguler $http服務中 自帶有JSON的請求方式 這樣就不用動態的創建腳本 //$http服務中 callback參數 必須寫成JSON_CALLBACK //意思是告訴angular自己去創建一個回調函數 // var myUrl = "http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html"; // $http({ // method:"jsonp", // url:"http://localhost:3000?myUrl=" + myUrl + "&callback=JSON_CALLBACK" // }) // .then(function (res) { // console.log(res); // },function (err) { // console.log(err); // }); //$http post請求 // $http({ // method:"post", // url:"http://localhost:3010", // headers:{ // "Content-Type":"application/x-www-form-urlencoded" // }, // data:{ // myUrl:"http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html" // } // }) // // .then(function (res) { // console.log(res); // },function (err) { // console.log(err); // }) //promise請求 var promise = $http({ method:"post", url:"http://localhost:3010", headers:{ "Content-Type":"application/x-www-form-urlencoded" }, data:{ myUrl:"http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html" } }); // // promise.success(function (res) { // console.log(res); // }); // // promise.error(function (err) { // console.log(err); // }); promise.then(function (res) { console.log(res); },function (err) { console.log(err); }) } }) function xxx(res) { console.log(res); } </script>
js:
var http = require("http");
var url = require("url");
var qs = require("querystring");
http.createServer(function (req , res) {
res.setHeader("Access-Control-Allow-Origin" , "*");
req.setEncoding("utf-8");
//
var postData = "";
//
req.addListener("data" , function (data) {
postData += data;
});
req.addListener("end" , function () {
// 把接收到的data轉化成對象方式
var postDataObj = JSON.parse(postData);
var myUrl = postDataObj.myUrl;
var resultData = "";
http.get(myUrl ,function (request) {
request.on("data" , function (data) {
resultData += data;
} );
request.on("end" , function () {
res.end(resultData);
} );
}).on("error" , function (err) {
console.log(err);
});
});
})
.listen(3010 , function () {
console.log("3010")
});
js2:
var http = require("http");
var url = require("url");
var qs = require("querystring");
http.createServer(function( req , res){
res.setHeader("Access-Control-Allow-Origin" , "*");
//對請求對象的url進行解析 拿到？后面的查詢參數
var query = url.parse(req.url).query;
//把key=value
var queryObj = qs.parse(query);
var result = "";
http.get(queryObj.myUrl , function (request) {
request.on("data" , function (data) {
result += data;
});
request.on("end" , function () {
if(queryObj.callback){
var fn = queryObj.callback;
var resultStr = JSON.stringify(result);
var str = fn + "("+ result + ")";
res.end(str);
}else {
res.end(result);
}
})
}).on("error" , function (err) {
res.end(err);
});
// res.end("helloWorld");
})
.listen(3000 , function(){
console.log("監聽3000")
});