Доброго времени суток.
Решил попробовать Node.js в качестве сервера для парсинга страниц.
В Node я полный ламер. Все делал из кусков свободно выложенных примеров.
Пробовал написать на php станичку и с нее делать ajax запросы на "сервер-парсер".
С точки зрения программирования )) тут все просто - есть поле ввода, есть кнопка.
В поле ввели url, нажали кнопку по ajax отправили на сервер этот url и в ответ получили распарсеренные как json. Функция на станице должна данные добавить в div.
Но особо похвастаться ничем. С первого заход стало ясно, что непонятно почему сцепка клиент-сервер делает по два запроса к url прежде чем вернуть данные на страницу. При смене url-а для запроса старый запрос еще раз выводится на страницу.
Помогите разобраться что не так. Или подскажите где можно посмотреть))
Собственно это сервер ))))
var express = require('express');
var http = require("http");
var url = require("url");
var request = require('request');
var cheerio = require('cheerio');
var cors = require('cors');
var app = express();
var titlejson, h1json;
app.use(cors());
app.get('/', function (req, res) {
var url_parts = url.parse(req.url, true);
var urlpars = url_parts.query.url;
console.log(urlpars);
var headers = {
'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.131 Safari/537.36'
};
var options = {
url: urlpars,
headers: headers
};
request(options, function (err, res, body) {
if (err) {
console.log(err);
} else {
$ = cheerio.load(body);
titlejson = $('title').text();
h1json = $('h1').text();
console.log('title:: ' + titlejson);
console.log('h1:: ' + h1json);
}
});
res.json({title: titlejson, h1: h1json});
});
app.listen(8008);
console.log("Server is listening")
А это страница с которой отправляется по ajax-су запрос и ждется ответ.
<!DOCTYPE html>
<html lang="en">
<head>
<title>parser</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//fonts.googleapis.com/css?family=Lato:100" rel="stylesheet" type="text/css">
<link href="css/bootstrap.css" media="screen" rel="stylesheet" type="text/css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-3"></div>
<div class="col-lg-6">
<h2>Hello, Parser!</h2>
<div class="col-md-12">
<div class="well-lg" style="border: 1px #31708f solid; border-radius: 5px; height: 200px;">
<div id="pars" class="col-md-12"></div>
</div>
<input id="parsurl" type="text" placeholder="http://example.com" class="col-md-9"
style="margin-top: 10px;">
<button id="add" class="btn btn-default btn-sm col-md-3" style="margin-top: 10px;">add</button>
</div>
</div>
<div class="col-md-3"></div>
</div>
</div>
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/bootstrap.js"></script>
<script>
$(document).ready(function () {
$('#add').click(function () {
$.get("http://XXX.XXX.XXX.XXX:8008/?url=" + $('#parsurl').val(), function (data) {
$("#pars").empty();
$("#pars").append("<h2 style='margin: -7px;'>" + data.title + "<h2/>");
if(data.h1 != 'noneh1none'){
$("#pars").append("<h4>" + data.h1 + "<h4/>");
}
});
});
});
</script>
</body>
</html>
За ранее спасибо.