Простой скрипинг экрана с использованием jQuery

Я играл с идеей использования простого скрепера экрана с использованием jQuery, и мне интересно, возможно ли следующее.

У меня есть простая HTML-страница, и я делаю попытку (если это возможно), чтобы захватить содержимое всех элементов списка с другой страницы, например:

Главная страница:

<!-- jQuery -->
<script type='text/javascript'>
$(document).ready(function(){
$.getJSON("[URL to other page]",
  function(data){

    //Iterate through the <li> inside of the URL data
    $.each(data.items, function(item){
      $("<li/>").value().appendTo("#data");
    });

  });
});
</script>

<!-- HTML -->
<html>
    <body>
       <div id='data'></div>
    </body>
</html>

Другая страница:

//Html
<body>
    <p><b>Items to Scrape</b></p>   
    <ul>
        <li>I want to scrape what is here</li>
        <li>and what is here</li>
        <li>and here as well</li>
        <li>and append it in the main page</li>
    </ul>
</body>

Итак, возможно ли, используя jQuery, вытащить все содержимое элементов списка с внешней страницы и добавить их в div?

Ответы

Ответ 1

Используйте $.ajax, чтобы загрузить другую страницу в переменную, затем создайте временный элемент и используйте .html(), чтобы установить содержимое в возвращаемое значение. Пропустите через дочерние элементы элемента nodeType 1 и сохраните их первые дочерние узлы. Если внешняя страница не находится на вашем веб-сервере, вам необходимо проксировать файл с помощью собственного веб-сервера.

Что-то вроде этого:

$.ajax({
     url: "/thePageToScrape.html",
     dataType: 'text',
     success: function(data) {
          var elements = $("<div>").html(data)[0].getElementsByTagName("ul")[0].getElementsByTagName("li");
          for(var i = 0; i < elements.length; i++) {
               var theText = elements[i].firstChild.nodeValue;
               // Do something here
          }
     }
});

Ответ 2

$.get("/path/to/other/page",function(data){
  $('#data').append($('li',data));
}

Ответ 3

Если это для одного и того же домена, тогда проблем нет - решение jQuery хорошее.

Но в противном случае вы не можете получить доступ к контенту с произвольного веб-сайта, поскольку это считается угрозой безопасности. См. та же самая политика происхождения.

Есть, конечно, обходные пути на стороне сервера, такие как веб-прокси или заголовки CORS. Если вам повезет, они поддержат jsonp.

Но если вы хотите, чтобы клиентское решение работало с произвольным веб-сайтом и веб-браузером, вам не повезло. Существует предложение для смягчения этой политики, но это не повлияет на текущие веб-браузеры.

Ответ 4

Вы можете рассмотреть pjscrape:

http://nrabinowitz.github.io/pjscrape/

Это позволяет вам сделать это из командной строки, используя javascript и jQuery. Это делается с помощью PhantomJS, который является браузером без браузера (он не имеет окна и существует только для вашего использования script, поэтому вы можете загружать сложные веб-сайты, которые используют AJAX, и он будет работать так, как если бы он был реальным браузер).

Примеры не требуют пояснений, и я считаю, что это работает на всех платформах (включая Windows).

Ответ 5

Простая очистка с помощью jQuery...

// Get HTML from page
$.get( 'http://example.com/', function( html ) {

    // Loop through elements you want to scrape content from
    $(html).find("ul").find("li").each( function(){

        var text = $(this).text();
        // Do something with content

    } )

} );

Ответ 6

Используйте каналы YQL или Yahoo, чтобы сделать запрос кросс-домена для содержимого страницы html. Трубка yahoo или запрос YQL вернут это обратно как JSON, который может быть обработан jquery для извлечения и отображения требуемых данных.

С другой стороны: YQL и Yahoo связывают OBEY файл robots.txt для целевого домена и если страница длинна, то команды регулярного выражения Yahoo Pipes не будут выполняться.