Question Puis-je utiliser jQuery avec Node.js?


Est-il possible d'utiliser des sélecteurs jQuery / manipulation DOM sur le serveur en utilisant Node.js?


510
2017-11-26 01:54


origine


Réponses:


Mise à jour (27 juin 18): Il semble qu'il y avait une mise à jour majeure à jsdom Cela fait que la réponse originale ne fonctionne plus. j'ai trouvé ce répondre qui explique comment utiliser jsdom à présent. J'ai copié le code pertinent ci-dessous.

var jsdom = require("jsdom");
const { JSDOM } = jsdom;
const { window } = new JSDOM();
const { document } = (new JSDOM('')).window;
global.document = document;

var $ = jQuery = require('jquery')(window);

Remarque: La réponse originale ne mentionne pas que vous aurez besoin d'installer jsdom en utilisant npm install jsdom

Mise à jour (fin 2013): L’équipe officielle de jQuery a finalement repris la gestion de la jquery paquet sur npm:

npm install jquery

Alors:

require("jsdom").env("", function (err, window) {
    if (err) {
        console.error(err);
        return;
    }
    var $ = require("jquery")(window);
});


511
2017-11-08 23:11



Oui, vous pouvez, en utilisant une bibliothèque que j'ai créée appelée nodeQuery https://github.com/tblobaum/nodeQuery

var Express = require('express')
    , dnode = require('dnode')
    , nQuery = require('nodeQuery')
    , express = Express.createServer();

var app = function ($) {
    $.on('ready', function () {
        // do some stuff to the dom in real-time
        $('body').append('Hello World');
        $('body').append('<input type="text" />');
        $('input').live('click', function () {
            console.log('input clicked');
            // ...
        });
    });
};

nQuery
    .use(app);

express
    .use(nQuery.middleware)
    .use(Express.static(__dirname + '/public'))
    .listen(3000);

dnode(nQuery.middleware).listen(express);

52
2017-11-04 19:12



Au moment de la rédaction, il y a aussi le maintien Cheerio.

Implémentation rapide, flexible et allégée du core jQuery conçu   spécifiquement pour le serveur.


48
2017-11-29 08:54



En utilisant jsdom vous pouvez maintenant Regardez simplement leur exemple de jquery dans le répertoire des exemples.


36
2017-08-23 03:23



Un crawler simple utilisant Cheerio

Ceci est ma formule pour créer un simple robot dans Node.js. C'est la principale raison de vouloir faire de la manipulation DOM du côté serveur et c'est probablement la raison pour laquelle vous êtes arrivé ici.

Première utilisation request pour télécharger la page à analyser. Lorsque le téléchargement est terminé, gérez-le cheerio et commencez la manipulation DOM comme si vous utilisiez jQuery.

Exemple de travail:

var
    request = require('request'),
    cheerio = require('cheerio');

function parse(url) {
    request(url, function (error, response, body) {
        var
            $ = cheerio.load(body);

        $('.question-summary .question-hyperlink').each(function () {
            console.info($(this).text());
        });
    })
}

parse('http://stackoverflow.com/');

Cet exemple imprimera sur la console toutes les questions principales figurant sur la page d'accueil de SO. C'est pourquoi j'aime Node.js et sa communauté. Ça ne pouvait pas être plus simple que ça :-)

Installez les dépendances:

npm demande d'installation cheerio

Et exécutez (en supposant que le script ci-dessus est dans le fichier crawler.js):

node crawler.js


Codage

Certaines pages auront un contenu non-anglais dans un certain encodage et vous devrez le décoder UTF-8. Par exemple, une page en portugais brésilien (ou toute autre langue d'origine latine) sera probablement encodée en ISO-8859-1 (alias "latin1"). Lorsque le décodage est nécessaire, je dis request ne pas interpréter le contenu de quelque façon que ce soit et utiliser iconv-lite faire le travail

Exemple de travail:

var
    request = require('request'),
    iconv = require('iconv-lite'),
    cheerio = require('cheerio');

var
    PAGE_ENCODING = 'utf-8'; // change to match page encoding

function parse(url) {
    request({
        url: url,
        encoding: null  // do not interpret content yet
    }, function (error, response, body) {
        var
            $ = cheerio.load(iconv.decode(body, PAGE_ENCODING));

        $('.question-summary .question-hyperlink').each(function () {
            console.info($(this).text());
        });
    })
}

parse('http://stackoverflow.com/');

Avant d'exécuter, installez les dépendances:

npm demande d'installation iconv-lite cheerio

Et puis finalement:

node crawler.js


Liens suivant

L'étape suivante consisterait à suivre les liens. Supposons que vous souhaitiez lister tous les posters de chaque question principale sur SO. Vous devez d'abord répertorier toutes les questions principales (exemple ci-dessus), puis entrer chaque lien, en analysant chaque page de la question pour obtenir la liste des utilisateurs concernés.

Lorsque vous commencez à suivre des liens, un callback hell peut commencer. Pour éviter cela, vous devriez utiliser des promesses, des contrats à terme ou autre. Je garde toujours async dans ma ceinture d'outils. Donc, voici un exemple complet d'un robot utilisant async:

var
    url = require('url'),
    request = require('request'),
    async = require('async'),
    cheerio = require('cheerio');

var
    baseUrl = 'http://stackoverflow.com/';

// Gets a page and returns a callback with a $ object
function getPage(url, parseFn) {
    request({
        url: url
    }, function (error, response, body) {
        parseFn(cheerio.load(body))
    });
}

getPage(baseUrl, function ($) {
    var
        questions;

    // Get list of questions
    questions = $('.question-summary .question-hyperlink').map(function () {
        return {
            title: $(this).text(),
            url: url.resolve(baseUrl, $(this).attr('href'))
        };
    }).get().slice(0, 5); // limit to the top 5 questions

    // For each question
    async.map(questions, function (question, questionDone) {

        getPage(question.url, function ($$) {

            // Get list of users
            question.users = $$('.post-signature .user-details a').map(function () {
                return $$(this).text();
            }).get();

            questionDone(null, question);
        });

    }, function (err, questionsWithPosters) {

        // This function is called by async when all questions have been parsed

        questionsWithPosters.forEach(function (question) {

            // Prints each question along with its user list
            console.info(question.title);
            question.users.forEach(function (user) {
                console.info('\t%s', user);
            });
        });
    });
});

Avant de courir:

npm demande d'installation async cheerio

Exécuter un test:

node crawler.js

Sortie de l'échantillon:

Is it possible to pause a Docker image build?
    conradk
    Thomasleveil
PHP Image Crop Issue
    Elyor
    Houston Molinar
Add two object in rails
    user1670773
    Makoto
    max
Asymmetric encryption discrepancy - Android vs Java
    Cookie Monster
    Wand Maker
Objective-C: Adding 10 seconds to timer in SpriteKit
    Christian K Rider

Et c'est la base que vous devez savoir pour commencer à créer vos propres robots :-)


Bibliothèques utilisées


27
2017-07-11 19:36



en 2016, les choses sont beaucoup plus faciles. installez jquery sur node.js avec votre console:

npm install jquery

lier à la variable $ (par exemple - je suis habitué) dans votre code node.js:

var $ = require("jquery");

faire des choses:

$.ajax({
    url: 'gimme_json.php',
    dataType: 'json',
    method: 'GET',
    data: { "now" : true }
});

fonctionne aussi pour gulp car il est basé sur node.js.


18
2017-11-17 13:57



Je crois que la réponse à cette question est maintenant oui.
https://github.com/tmpvar/jsdom

var navigator = { userAgent: "node-js" };  
var jQuery = require("./node-jquery").jQueryInit(window, navigator);

16
2018-04-27 09:15



Le module jQuery peut être installé en utilisant:

npm install jquery

Exemple:

var $ = require('jquery');
var http = require('http');

var options = {
    host: 'jquery.com',
    port: 80,
    path: '/'
};

var html = '';
http.get(options, function(res) {
res.on('data', function(data) {
    // collect the data chunks to the variable named "html"
    html += data;
}).on('end', function() {
    // the whole of webpage data has been collected. parsing time!
    var title = $(html).find('title').text();
    console.log(title);
 });
});

Références de jQuery dans Node.js **:


8
2018-06-21 07:37



npm install jquery --save  # note ALL LOWERCASE

npm install jsdom --save

const jsdom = require("jsdom");
const dom = new jsdom.JSDOM(`<!DOCTYPE html>`);
var $ = require("jquery")(dom.window);


$.getJSON('https://api.github.com/users/nhambayi',function(data) {
  console.log(data);
});

7
2018-06-13 00:07



Mon code de travail est:

npm install jquery

et alors:

global.jQuery   = require('jquery');
global.$        = global.jQuery;

ou si la fenêtre est présente, alors:

typeof window !== "undefined" ? window : this;
window.jQuery   = require('jquery');
window.$        = window.jQuery;

3
2017-07-27 12:08



Vous devez obtenir la fenêtre en utilisant la nouvelle API JSDOM.

const jsdom = require("jsdom");
const { window } = new jsdom.JSDOM(`...`);
var $ = require("jquery")(window);

3
2017-11-24 16:54