開始nodejs+express的學習+實踐（9）

時間 2019-11-11

標籤開始 nodejs+express nodejs express 學習實踐简体版

原文原文鏈接

1.爬蟲抓取css

爬蟲抓取就是獲取他人也面的內容，顯示在本身的頁面裏，咱們抓取https://cnodejs.org/getstart的：html

顯示在本身頁面裏。node

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "express": "~3.4.8",
    "static-favicon": "~1.0.0",
    "morgan": "~1.0.0",
    "cookie-parser": "~1.0.1",
    "body-parser": "~1.0.0",
    "debug": "~0.7.4",
    "ejs": "~0.8.5",
    "formidable": "*",
    "mongodb":"*",
    "mongoskin":"*",
    "express-session":"*",
    "superagent":"*",
    "cheerio":"*"
  }
}

依賴加入，一個superagent一個cheerio，前面是獲取頁面內容，後面是篩選內容。mongodb

咱們npm install下載依賴。數據庫

index.js引入：express

var superagent = require('superagent');
var cheerio = require('cheerio');

咱們把內容顯示在list頁面裏，改變/list路由處理。npm

    app.get('/list',  function(req, res){
        var targetUrl = 'https://cnodejs.org/getstart';
        superagent.get(targetUrl)
            .end(function (err, ares) {
                console.log(ares.text);
                res.render('list', { text: ares.text });
            });
    });

地址輸入：http://localhost:1234/listmarkdown

顯示了html頁面源碼：cookie

此時若是咱們有jq相似工具，$(".xx").html()就能夠拿到內容了，cheerio就是相似實現，返回的html咱們當作dom樹處理就能夠了。session

咱們在/list加入cheerio的處理：

    app.get('/list',  function(req, res){
        var targetUrl = 'https://cnodejs.org/getstart';
        superagent.get(targetUrl)
            .end(function (err, ares) {
                console.log(ares.text);
                var $ = cheerio.load(ares.text);
                //經過CSS selector來篩選數據
                var arr=[];
                $('.markdown-text p strong').each(function (idx, element) {
                    console.log($(element).html());
                    arr.push($(element).html());
                });
                res.render('list', { text: arr });
            });
    });

list.html頁面：

<!DOCTYPE html>
<html>
  <head>
    <title>list</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <ul>
        <% for(var i=0; i<text.length; i++) {%>
        <li><%= text[i] %></li>
        <% } %>
    </ul>
  </body>
</html>

顯示：

好像有點問題，選的不是全是須要的內容，要獲取看來只能一部分一部分的拿會正確顯示。

2.登陸邏輯

登陸其實使用的就是查詢處理，