D'enregistrer et d'effectuer le rendu d'une page web avec PhantomJS et node.js

Je suis à la recherche d'un exemple de demander une page web, en attente pour le JavaScript pour le rendu (JavaScript modifie le DOM), et puis de saisir le code HTML de la page.

Cela devrait être un exemple simple avec une évidente cas d'utilisation pour PhantomJS. Je ne peux pas trouver un travail décent exemple, la documentation semble être tout au sujet de la ligne de commande utilisation.

  • Vous êtes à la recherche pour ce faire côté client ou côté serveur?
  • serverside je pense? Infoclient obligerait l'utilisateur à installer fantôme de droit? Qui ne fonctionnent pas si je comprends bien. Merci
  • De quoi êtes-vous tenter de le faire avec le html une fois que vous l'avez? Essayer d'obtenir ma tête autour de ce que vous essayez d'atteindre. Phantomjs a la manipulation dom voir code.google.com/p/phantomjs/wiki/QuickStart#DOM_Manipulation êtes-vous puis allez envoyer ce quelque part?
  • le cas d'utilisation est la création d'un cache html statique copie d'une application javascript vue pour les moteurs de recherche. Je veux être en mesure de s'exécuter par programmation via mon sitemap, et enregistrer une version html de chaque lien.
  • ouais c'page liée est le genre de chose dont j'ai besoin, j'aimerais juste un exemple de comment le faire de nœud. Merci
  • Ce faisant, ce côté client n'est pas possible?

InformationsquelleAutor Harry | 2012-04-01
  1. 42

    De vos commentaires, je suppose que vous avez 2 options

    1. Essayer de trouver un phantomjs nœud du module https://github.com/amir20/phantomjs-node
    2. Exécuter phantomjs comme un processus enfant à l'intérieur de nœud - http://nodejs.org/api/child_process.html

    Edit:

    Il semble que le processus enfant est suggéré par phantomjs comme un moyen d'interagir avec le noeud, voir faq - http://code.google.com/p/phantomjs/wiki/FAQ

    Edit:

    Exemple Phantomjs script pour obtenir les pages de balisage HTML:

    var page = require('webpage').create();  
page.open('http://www.google.com', function (status) {
    if (status !== 'success') {
        console.log('Unable to access network');
    } else {
        var p = page.evaluate(function () {
            return document.getElementsByTagName('html')[0].innerHTML
        });
        console.log(p);
    }
    phantom.exit();
});
    • Pouvez-vous me montrer un exemple? Prenez une page, javascript, get html?
    • Vous pouvez simplement utiliser la page.contenu", il n'y a pas besoin d'évaluer quoi que ce soit.
    • C'est très bien, mais... du mal à utiliser require('page') dans le script enveloppé avec noeud parce que la page du module n'est pas défini dans le nœud, il est en fantôme. Quelqu'un a des idées? Est 'page web' un module commun à la fois le nœud et le fantôme? Ou puis-je utiliser dans le fantôme le contexte d'une certaine façon?
    • l'évaluation est "bac à sable" et ne peut pas exécuter l'exigent. Vous devez passer le tout dans une fermeture à les évaluer().
    • Quelqu'un a été en mesure d'exécuter deux enfants les processus de prise de phantomjs appels en même temps?
    • Pas trouver comment évaluer ce processus enfant. Pouvez-vous faire un peu de lumière?

    InformationsquelleAutor Declan Cook
  2. 8

    Avec la v2 de phantomjs-node il est assez facile d'imprimer le code HTML après qu'il a été traité. 

    var phantom = require('phantom');

phantom.create().then(function(ph) {
  ph.createPage().then(function(page) {
    page.open('https://stackoverflow.com/').then(function(status) {
      console.log(status);
      page.property('content').then(function(content) {
        console.log(content);
        page.close();
        ph.exit();
      });
    });
  });
});

    Cela affiche la sortie comme il aurait été rendue avec le navigateur.

    Modifier 2019:

    Vous pouvez utiliser async/await:

    const phantom = require('phantom');

(async function() {
  const instance = await phantom.create();
  const page = await instance.createPage();
  await page.on('onResourceRequested', function(requestData) {
    console.info('Requesting', requestData.url);
  });

  const status = await page.open('https://stackoverflow.com/');
  const content = await page.property('content');
  console.log(content);

  await instance.exit();
})();

    Ou si vous voulez juste pour tester, vous pouvez utiliser npx

    npx phantom@latest https://stackoverflow.com/
    • permet-elle de rendre le code HTML donné une chaîne de caractères ?
    • Oui, c'est fait....
    InformationsquelleAutor Amir Raminfar
  3. 4

    J'ai utilisé de deux manières différentes dans le passé, y compris de la page.evaluate() méthode qui interroge les DOM que Declan mentionné. L'autre façon dont je l'ai transmis l'info à partir de la page web est de cracher à la console.log() à partir de là, et dans le phantomjs utiliser un script:

    page.onConsoleMessage = function (msg, line, source) {
  console.log('console [' +source +':' +line +']> ' +msg);
}

    Je pourrais aussi piège de la variable msg dans la onConsoleMessage et de recherche pour certains encapsuler les données. Dépend de comment vous voulez utiliser la sortie.

    Puis dans la Nodejs script, vous devez analyser la sortie de la Phantomjs script:

    var yourfunc = function(...params...) {
  var phantom = spawn('phantomjs', [...args]);
  phantom.stdout.setEncoding('utf8');
  phantom.stdout.on('data', function(data) {
    //parse or echo data
    var str_phantom_output = data.toString();
    //The above will get triggered one or more times, so you'll need to
    //add code to parse for whatever info you're expecting from the browser
  });
  phantom.stderr.on('data', function(data) {
    //do something with error data
  });
  phantom.on('exit', function(code) {
    if (code !== 0) {
      //console.log('phantomjs exited with code ' +code);
    } else {
      //clean exit: do something else such as a passed-in callback
    }
  });
}

    Espère que ça aide certains.

    InformationsquelleAutor ultrageek
  4. 3

    Pourquoi ne pas l'utiliser ? 

    var page = require('webpage').create();
page.open("http://example.com", function (status)
{
    if (status !== 'success') 
    {
        console.log('FAIL to load the address');            
    } 
    else 
    {
        console.log('Success in fetching the page');
        console.log(page.content);
    }
    phantom.exit();
});
    InformationsquelleAutor yossi
  5. 1

    La fin de la mise à jour au cas où quelqu'un trébuche sur cette question:

    Un projet sur GitHub développé par un de mes collègues exactement vise à vous aider à le faire: https://github.com/vmeurisse/phantomCrawl.

    Encore un peu jeune, ce n'est certainement manquant un peu de documentation, mais l'exemple fourni devrait aider à faire de base de l'analyse.

    InformationsquelleAutor Stilltorik
  6. 1

    Voici une vieille version que j'utilise le noeud en cours d'exécution, d'exprimer et de phantomjs qui enregistre la page en tant que .png. Vous pourriez ajuster assez rapidement pour obtenir le code html.

    https://github.com/wehrhaus/sitescrape.git

    • Pour info, si vous allez utiliser un lien pour fournir une réponse, il est préférable d'inclure suffisamment d'informations pour que votre réponse ne sera pas devenir inutile si le lien arrive à casser à un certain moment dans l'avenir.
    • pour enregistrer au format png que vous venez de faire la page.render('fichier.png')
    InformationsquelleAutor user2950147