Apakah mungkin untuk menggunakan penyeleksi jQuery / manipulasi DOM di sisi server menggunakan Node.js?

Pembaruan (27-Juni-18) : Sepertinya ada pembaruan besar jsdomyang menyebabkan jawaban asli tidak lagi berfungsi. Saya menemukan jawaban ini yang menjelaskan cara menggunakan jsdomsekarang. Saya telah menyalin kode yang relevan di bawah ini.

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

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

Catatan: Jawaban awal gagal menyebutkan bahwa Anda perlu menginstal jsdom juganpm install jsdom

Pembaruan (akhir 2013) : Tim jQuery resmi akhirnya mengambil alih pengelolaan jquerypaket pada npm:

npm install jquery

Kemudian:

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

Ya Anda bisa, menggunakan perpustakaan yang saya buat bernama 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);

Pada saat penulisan juga ada Cheerio yang dipelihara .

Implementasi inti jQuery cepat, fleksibel, dan ramping yang dirancang khusus untuk server.

Menggunakan jsdom sekarang Anda bisa. Lihat saja contoh jquery mereka di direktori contoh.

Perayap sederhana menggunakan Cheerio

Ini adalah rumus saya untuk membuat perayap sederhana di Node.js. Ini adalah alasan utama untuk ingin melakukan manipulasi DOM di sisi server dan mungkin itulah alasan mengapa Anda sampai di sini.

Pertama, gunakan requestuntuk mengunduh halaman yang akan diuraikan. Saat unduhan selesai, tangani untukcheerio dan mulai manipulasi DOM seperti menggunakan jQuery.

Contoh kerja:

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

Contoh ini akan mencetak ke konsol semua pertanyaan teratas yang ditampilkan di halaman beranda SO. Inilah sebabnya saya suka Node.js dan komunitasnya. Tidak bisa lebih mudah dari itu :-)

Instal dependensi:

npm instal permintaan cheerio

Dan jalankan (dengan asumsi skrip di atas ada dalam file crawler.js):

node crawler.js

Pengkodean

Beberapa halaman akan memiliki konten non-Inggris dalam penyandian tertentu dan Anda harus mendekodekannya UTF-8. Misalnya, halaman dalam bahasa Portugis Brasil (atau bahasa latin lainnya) kemungkinan akan dikodekan dalam ISO-8859-1(alias "latin1"). Ketika decoding diperlukan, saya katakan requestuntuk tidak menafsirkan konten dengan cara apa pun dan alih-alih menggunakannyaiconv-lite untuk melakukan pekerjaan itu.

Contoh kerja:

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

Sebelum berjalan, instal dependensi:

npm instal request iconv-lite cheerio

Dan akhirnya:

node crawler.js

Tautan berikut

Langkah selanjutnya adalah mengikuti tautan. Katakanlah Anda ingin mendaftar semua poster dari setiap pertanyaan teratas di SO. Anda harus terlebih dahulu mendaftar semua pertanyaan teratas (contoh di atas) dan kemudian memasukkan setiap tautan, mem-parsing setiap halaman pertanyaan untuk mendapatkan daftar pengguna yang terlibat.

Ketika Anda mulai mengikuti tautan, neraka panggilan balik dapat dimulai. Untuk menghindarinya, Anda harus menggunakan semacam janji, masa depan atau apa pun. Saya selalu menyimpan async di sabuk alat saya. Jadi, berikut adalah contoh lengkap perayap menggunakan 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);
            });
        });
    });
});

Sebelum berjalan:

npm instal request async cheerio

Jalankan tes:

node crawler.js

Output sampel:

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

Dan itulah dasar yang harus Anda ketahui untuk mulai membuat crawler Anda sendiri :-)

Perpustakaan digunakan

• permintaan
• iconv-lite
• cheerio
• async

di 2016 segalanya lebih mudah. instal jquery ke node.js dengan konsol Anda:

npm install jquery

ikat ke variabel $(misalnya - saya sudah terbiasa) dalam kode node.js Anda:

var $ = require("jquery");

lakukan hal-hal:

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

juga bekerja untuk tegukan karena didasarkan pada node.js.

Saya yakin jawabannya sekarang ya.
https://github.com/tmpvar/jsdom

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

npm install jquery --save #catat SEMUA RENDAH KASUS

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

Modul jQuery dapat diinstal menggunakan:

npm install jquery

Contoh:

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

Referensi jQuery di Node.js **:

• http://quaintous.com/2015/07/31/jqery-node-mystery/
• http://www.hacksparrow.com/jquery-with-node-js.html

Anda harus mendapatkan jendela menggunakan API JSDOM baru.

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

PERINGATAN

Solusi ini, seperti yang disebutkan oleh Golo Roden tidak benar . Ini hanya perbaikan cepat untuk membantu orang agar kode jQuery mereka yang sebenarnya berjalan menggunakan struktur aplikasi Node, tetapi itu bukan filosofi Node karena jQuery masih berjalan di sisi klien alih-alih di sisi server. Saya minta maaf karena memberikan jawaban yang salah.

Anda juga dapat membuat Jade dengan simpul dan memasukkan kode jQuery Anda di dalamnya. Ini adalah kode dari file jade:

!!! 5
html(lang="en")
  head
    title Holamundo!
    script(type='text/javascript', src='http://code.jquery.com/jquery-1.9.1.js')
  body
    h1#headTitle Hello, World
    p#content This is an example of Jade.
    script
      $('#headTitle').click(function() {
        $(this).hide();
      });
      $('#content').click(function() {
        $(this).hide();
      });

Kode kerja saya adalah:

npm install jquery

lalu:

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

atau jika jendela ada, maka:

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

Modul jsdom adalah alat yang hebat. Tetapi jika Anda ingin mengevaluasi seluruh halaman dan melakukan beberapa hal funky di sisi server saya sarankan menjalankannya dalam konteks mereka sendiri:

vm.runInContext

Jadi hal-hal seperti require/ CommonJSdi situs tidak akan meledakkan proses Node Anda sendiri.

Anda dapat menemukan dokumentasi di sini . Bersulang!

Pada jsdom v10, fungsi .env () sudah tidak digunakan lagi. Saya melakukannya seperti di bawah ini setelah mencoba banyak hal yang memerlukan jquery:

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

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

Semoga ini bisa membantu Anda atau siapa saja yang pernah menghadapi masalah seperti ini.

Pertama-tama instal

npm install jquery -S

Setelah menginstalnya, Anda dapat menggunakannya seperti di bawah ini

import $ from 'jquery';
window.jQuery = window.$ = $;
$(selector).hide();

Anda dapat melihat tutorial lengkap yang saya tulis di sini: https://medium.com/fbdevclagos/how-to-use-jquery-on-node-df731bd6abc7

Tidak satu pun dari solusi ini yang membantu saya dalam Aplikasi Elektron saya.

Solusi saya (solusi):

npm install jquery

Dalam index.jsfile Anda :

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

Dalam .jsfile Anda, tuliskan fungsi jQuery Anda dengan cara ini:

jQuery(document).ready(function() {

Ya, jQuerybisa digunakan bersamaNode.js .

Langkah-langkah untuk memasukkan jQuery dalam proyek simpul: -

npm i jquery --save Sertakan jquery dalam kode

import jQuery from 'jquery';

const $ = jQuery;

Saya menggunakan jquery di proyek node.js sepanjang waktu khususnya di proyek ekstensi chrome.

mis. https://github.com/fxnoob/gesture-control-chrome-extension/blob/master/src/default_plugins/tab.js

Tidak. Ini akan menjadi upaya yang cukup besar untuk port lingkungan browser ke node.

Pendekatan lain, yang saya sedang selidiki untuk pengujian unit, adalah membuat versi "Mock" dari jQuery yang menyediakan panggilan balik setiap kali seorang pemilih dipanggil.

Dengan cara ini Anda dapat menguji unit plugin jQuery Anda tanpa benar-benar memiliki DOM. Anda masih harus menguji di peramban nyata untuk melihat apakah kode Anda berfungsi di alam bebas, tetapi jika Anda menemukan masalah khusus peramban, Anda dapat dengan mudah "mengejek" yang ada di unit test Anda juga.

Saya akan mendorong sesuatu ke github.com/felixge setelah siap untuk ditampilkan.

Anda dapat menggunakan Electron , ini memungkinkan browser hybrid dan node.

Sebelumnya, saya mencoba menggunakan canvas2d di nodejs, tetapi akhirnya saya menyerah. Ini tidak didukung oleh nodejs default, dan terlalu sulit untuk menginstalnya (banyak banyak ... dependeces). Sampai saya menggunakan Electron, saya dapat dengan mudah menggunakan semua kode browserjs saya sebelumnya, bahkan WebGL, dan meneruskan nilai hasil (mis. Data base64 hasil gambar) ke kode nodejs.

Tidak yang saya tahu. DOM adalah hal sisi klien (jQuery tidak mem-parsing HTML, tetapi DOM).

Berikut adalah beberapa proyek Node.js saat ini:

https://github.com/ry/node/wiki ( https://github.com/nodejs/node )

Dan djangode SimonW sangat keren ...

Alternatifnya adalah menggunakan Underscore.js . Itu harus memberikan apa yang Anda inginkan dari sisi server dari JQuery.