web-dev-qa-db-fra.com

Raclage d'écran simple à l'aide de jQuery

J’ai joué avec l’idée d’utiliser un simple grattoir avec jQuery et je me demande si ce qui suit est possible.

J'ai une simple page HTML et je tente (si cela est possible) de récupérer le contenu de tous les éléments de la liste d'une autre page, comme ceci:

Page d'accueil: 

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

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

  });
});
</script>

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

Autre Page: 

//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>

Alors, est-il possible d'utiliser jQuery pour extraire tout le contenu de l'élément de la liste à partir d'une page externe et les ajouter à l'intérieur d'un div?

javascriptjqueryscreen-scraping
41
Rion Williams

Utilisez $.ajax pour charger l'autre page dans une variable, puis créez un élément temporaire et utilisez .html() pour définir le contenu avec la valeur renvoyée. Parcourez les enfants de l'élément de nodeType 1 et conservez les premiers nodeValues ​​de leurs enfants. Si la page externe ne se trouve pas sur votre serveur Web, vous devrez utiliser un proxy pour le fichier avec votre propre serveur Web.

Quelque chose comme ça:

$.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
          }
     }
});
35
Ry-
$.get("/path/to/other/page",function(data){
  $('#data').append($('li',data));
}
6
Fareesh Vijayarangam

Si c'est pour le même domaine alors pas de problème - la solution jQuery est bonne.

Mais sinon, vous ne pouvez pas accéder au contenu d'un site Web arbitraire, car cela est considéré comme un risque pour la sécurité. Voir même politique d'origine . 

Il existe bien sûr des solutions de contournement côté serveur, telles qu'un proxy Web ou les en-têtes CORS . Si vous êtes chanceux, ils prendront en charge jsonp.

Mais si vous souhaitez qu'une solution côté client fonctionne avec un site Web et un navigateur Web arbitraires, vous n'avez pas de chance. Il existe une proposition pour assouplir cette politique , mais cela n’affectera pas les navigateurs Web actuels.

5
hoju

Vous voudrez peut-être envisager pjscrape:

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

Cela vous permet de le faire depuis la ligne de commande, en utilisant javascript et jQuery. Pour ce faire, il utilise PhantomJS, un navigateur Web sans tête (il n’a pas de fenêtre et il n’existe que pour l’utilisation de votre script. Vous pouvez donc charger des sites Web complexes qui utilisent AJAX. un vrai navigateur).

Les exemples sont explicites et je pense que cela fonctionne sur toutes les plateformes (y compris Windows).

5
Camilo Martin

Raclage simple avec 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

    } )

} );
4
shramee

Utilisez les tubes YQL ou Yahoo pour effectuer la demande interdomaine pour le contenu HTML de page brute. Le tuyau yahoo ou la requête YQL le crache en tant que JSON pouvant être traité par jQuery pour extraire et afficher les données requises.

Inconvénient: YQL et Yahoo pipes OBEY le fichier robots.txt du domaine cible Et si la page est trop longue, les commandes de regex de Yahoo Pipes ne seront pas exécutées.

1
Skizz

Je suis sûr que vous rencontrerez souvent le problème de la SCRO avec des demandes ..__ De ici essayez de résoudre le problème de la SCRO.

var name = "kk";
var url = "http://anyorigin.com/go?url=" + encodeURIComponent("https://www.yoursite.xyz/") + name + "&callback=?";
$.get(url, function(response) {
  console.log(response);
});
0
Kurkula