Могу ли я использовать jQuery с Node.js? - PullRequest
542 голосов
/ 26 ноября 2009

Можно ли использовать селекторы jQuery / манипулирование DOM на стороне сервера с помощью Node.js?

Ответы [ 19 ]

541 голосов
/ 09 ноября 2010

Обновление (27-июн-18) : Похоже, что произошло значительное обновление до jsdom, из-за которого исходный ответ больше не работает. Я нашел этот ответ, который объясняет, как использовать jsdom сейчас. Я скопировал соответствующий код ниже.

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

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

Примечание: В первоначальном ответе не упоминается, что вам также потребуется установить jsdom, используя npm install jsdom

Обновление (конец 2013 г.) : Официальная команда jQuery наконец-то взяла на себя управление пакетом jquery в npm:

npm install jquery

Тогда:

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

54 голосов
/ 04 ноября 2011

Да, вы можете, используя созданную мной библиотеку под названием 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);
51 голосов
/ 29 ноября 2012

На момент написания статьи также поддерживается Cheerio .

Быстрая, гибкая и бережная реализация ядра, разработанного в jQuery. специально для сервера.

38 голосов
/ 23 августа 2010

Используя jsdom , вы теперь можете. Просто посмотрите на их пример jquery в каталоге примеров.

32 голосов
/ 11 июля 2015

Простой гусеничный ход, использующий Cheerio

Это моя формула сделать простой сканер в Node.js. Это основная причина желания манипулировать DOM на стороне сервера и, возможно, именно поэтому вы сюда попали.

Сначала используйте request, чтобы загрузить страницу для анализа. Когда загрузка будет завершена, обработайте ее до cheerio и начните манипулирование DOM так же, как с использованием jQuery.

Рабочий пример:

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/');

Этот пример выведет на консоль все главные вопросы, отображаемые на домашней странице SO. Вот почему я люблю Node.js и его сообщество. Это не могло быть легче, чем это: -)

Установить зависимости:

npm запрос на установку cheerio

И запустить (при условии, что приведенный выше скрипт находится в файле crawler.js):

узел crawler.js


Кодирование

Некоторые страницы будут содержать неанглийский контент в определенной кодировке, и вам нужно будет расшифровать его до UTF-8. Например, страница на бразильском португальском (или любом другом языке латинского происхождения), вероятно, будет закодирована в ISO-8859-1 (a.k.a. "latin1"). Когда требуется декодирование, я говорю request не интерпретировать содержимое каким-либо образом и вместо этого использую iconv-lite для выполнения работы.

Рабочий пример:

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/');

Перед запуском установите зависимости:

npm запрос на установку iconv-lite cheerio

И наконец:

node crawler.js


по ссылкам

Следующим шагом будет переход по ссылкам. Скажем, вы хотите перечислить все постеры с каждого главного вопроса на SO. Вы должны сначала перечислить все главные вопросы (пример выше), а затем ввести каждую ссылку, анализируя страницу каждого вопроса, чтобы получить список вовлеченных пользователей.

Когда вы начинаете переходить по ссылкам, может начаться обратный вызов ада . Чтобы избежать этого, вы должны использовать какие-то обещания, фьючерсы или что-то еще. Я всегда держу async в своем инструментальном поясе. Итак, вот полный пример сканера, использующего 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);
            });
        });
    });
});

Перед запуском:

npm запрос на установку async cheerio

Запустить тест:

узел crawler.js

Пример вывода:

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

И вот что вы должны знать, чтобы начать создавать свои собственные сканеры: -)


используемые библиотеки

19 голосов
/ 17 ноября 2016

в 2016 году все намного проще. установите jquery в node.js с вашей консоли:

npm install jquery

привязать его к переменной $ (например - я к этому привык) в вашем коде node.js:

var $ = require("jquery");

делать вещи:

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

также работает для gulp, так как он основан на node.js.

17 голосов
/ 27 апреля 2010

Я думаю, что ответ на этот вопрос теперь да.
https://github.com/tmpvar/jsdom

var navigator = { userAgent: "node-js" };  
var jQuery = require("./node-jquery").jQueryInit(window, navigator);
11 голосов
/ 13 июня 2017

npm install jquery --save # note ВСЕ НИЖНЯЯ ЧАСТЬ

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);
});
8 голосов
/ 21 июня 2016

Модуль jQuery можно установить с помощью:

npm install jquery

Пример:

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);
 });
});

Ссылки jQuery в Node.js **:

5 голосов
/ 24 ноября 2017

Вы должны получить окно, используя новый API JSDOM.

const jsdom = require("jsdom");
const { window } = new jsdom.JSDOM(`...`);
var $ = require("jquery")(window);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...