前端进阶（十三）Node.js实战

最新推荐文章于 2022-04-07 18:53:32 发布

fullstack_lth

最新推荐文章于 2022-04-07 18:53:32 发布

阅读量275

点赞数

分类专栏： Node.js 文章标签： Node

本文链接：https://blog.csdn.net/u014744118/article/details/85565386

版权

Node.js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

传统意义上的 JavaScript 运行在浏览器上，这是因为浏览器内核实际上分为两个部分:渲染引擎和 JavaScript 引擎。前者负责渲染 HTML + CSS，后者则负责运行 JavaScript。Chrome 使用的 JavaScript 引擎是 V8，它的速度非常快。

Node.js 是一个运行在服务端的框架，它的底层就使用了 V8 引擎。我们知道 Apache + PHP 以及 Java 的 Servlet 都可以用来开发动态网页，Node.js 的作用与他们类似，只不过是使用 JavaScript 来开发。

从定义上介绍完后，举一个简单的例子，新建一个 app.js 文件并输入以下内容:

var http = require('http');
http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/plain'}); // HTTP Response 头部
    response.end('Hello World\n'); // 返回数据 “Hello World”
}).listen(8888); // 监听 8888 端口
// 终端打印如下信息
console.log('Server running at http://127.0.0.1:8888/');

这样，一个简单的 HTTP Server 就算是写完了，输入 node app.js 即可运行，随后访问便会看到输出结果。

为什么要用Node？

总的来说，Node.js 适合以下场景:

实时性应用，比如在线多人协作工具，网页聊天应用等。
以 I/O 为主的高并发应用，比如为客户端提供 API，读取数据库。
流式应用，比如客户端经常上传文件。
前后端分离。

实际上前两者可以归结为一种，即客户端广泛使用长连接，虽然并发数较高，但其中大部分是空闲连接。

Node.js 也有它的局限性，它并不适合 CPU 密集型的任务，比如人工智能方面的计算，视频、图片的处理等。

以下是Node的几个简单应用，供参考。

（一）爬虫

var https = require('https')

var cheerio = require('cheerio')

var baseUrl = 'https://www.imooc.com/learn/'

var url = 'https://www.imooc.com/learn/348'

var videoIds = [348, 259, 197, 134, 75]



function filterChapters(html) {

    var $ = cheerio.load(html)

    var chapters = $('.chapter')

    var title = $('hd h2').text()

    var number = parseInt($('.js-learn-num').text())

    var coursesData = {

        title: title,

        number: number,

        videos: []

    }

    chapters.each(function (item) {

        var chapter = $(this)

        var chapterTitle = chapter.find('.chapter-description').text()

        var videos = chapter.find('.video').children('li')

        var chapterData = {

            chapterTitle: chapterTitle,

            videos: []

        }

        videos.each(function (item) {

            var video = $(this).find('.J-media-item')

            var videoTitle = video.text()

            var id = video.attr('href').split('video/')[1]

            chapterData.videos.push({

                title: videoTitle,

                id: id

            })

        })

        coursesData.videos.push(chapterData)

    })

    return coursesData

}



function printCourseInfo(coursesData) {

    coursesData.forEach((courseData) => {

        console.log(courseData.number) + '人学过' + courseData.title + '\n'

    })



    coursesData.forEach(courseData => {

        console.log('###' + courseData.title + '\n')

        courseData.videos.forEach((item) => {

            var chapterTitle = item.chapterTitle

            console.log(chapterTitle + '\n')

            item.videos.forEach(video => {

                console.log('【' + video.id + '】' + video.title + '\n')

            })

        })

    });

}



function getPageAsync(url) {

    return new Promise(function (resolve, reject) {

        console.log("正在爬取" + url)

        https.get(url, function (res) {

            var html = ''

            res.on('data', function (data) {

                html += data

            })

            res.on('end', function () {

                resolve(html)

            })

        }).on('error', function () {

            console.log('获取出错')

            reject(e)

        })

    })

}

var fetchCourseArray = []

videoIds.forEach((id) => {

    fetchCourseArray.push(getPageAsync(baseUrl + id))

})



Promise.all(fetchCourseArray).then(function (pages) {

    //

    var courseData = []

    pages.forEach(function (html) {

        var courses = filterChapters(html)

        courseData.push(courses)

    })

    courseData.sort((a, b) => {

        return a.number < b.number

    })

    printCourseInfo(courseData)

})

（二）require简易实现

Node中的require是一个常见函数，为此我看了一些资料，了解原理后自己实现了一个简易的require。

'use strict';

function $require(id){
    let fs = require('fs');
    let path = require('path');

    let fileName = path.join(__filename, id);
    let pathName = path.basename(fileName);
    $require.cache = $require.cache || {};
    if($require.cache){
        return $require.cache[fileName].module;
    }
    const dirname = path.dirname(filename);  
    let code = fs.readFileSync(__dirname + id, 'utf8');
    
    let module = {id:fileName, exports:{}}
    let exports = module.exports;
    code = `(function($require, module, exports, __dirname, __filename){
        ${code}
    })($require, module, exports, dirname, filename)`
    eval(code)
    $require.cache[filename] = module;
    return module.exports;
} 

var m1 = $require('./module.js');//要导入的文件模块路径

（三）创建目录实现mkdirs

const fs = require('fs');
const path = require('path');

function mkdirs(pathname, callback) {
  // module.parent 拿到的是调用父对象的文件目录
  var root = path.dirname(module.parent.filename);

  pathname = path.isAbsolute(pathname) ? pathname : path.join(root, pathname)

  var relativepath = path.relative(root, pathname);

  var folders = relativepath.split(path.sep);

  try {
    var pre = '';
    folders.forEach(folder => {
      try {
        // 如果不存在则报错
        fs.statSync(path.join(root, pre, folder));
      } catch (error) {
        fs.mkdirSync(path.join(root, pre, folder));
      }

      pre = path.join(pre, folder);
    });
    callback && callback(null);
  } catch (error) {
    callback && callback(error);
  }
}

module.exports = mkdirs;

调用

var mkdirs = require('./module/mkdirs');
var path = require('path');

mkdirs('./d1/d2/d3/d4/d5', (err) => { console.log(err); });

（四）实现markdown文件监听并转化为html文件

//调用： node 本文件名 要监听的markdown文件
'use strict'

let fs = require('fs');
let path = require('path');
let marked = require('marked');//process markdown...
const browserSync = require("browser-sync");

// get target markdown file path...
const target = path.join(__dirname, process.argv[2]);

// after convert to HTML location...
var filename = target.replace(path.extname(target), '.html');

// get html file name...
var indexpath = path.basename(filename);

// Start the server
browserSync({
    notify: false,
    server: path.dirname(target),
    index: indexpath 
});

fs.watchFile(target, { interval: 200 }, (curr, prev) => {
    if(curr.mtime === prev.mtime){
        return false;
    }

    fs.readFile(target, 'utf8', (error, content) => {
        if(error){
            console.log(error)
        }
        var html = marked(content);
        template.replace(`{{{content}}}`, html);
        fs.writeFile(target.replace(path.extname(target), '.html'), html, 'utf8', (err, css) => {
            html = template.replace('{{{content}}}', html).replace('{{{styles}}}', css);

            fs.writeFile(filename, html, 'utf8', (err) => {
                browserSync.reload(indexpath);
            });
        });
    })
})

let template = `
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <style>{{{styles}}}</style>
</head>
<body>
  <div class="vs">
    {{{content}}}
  </div>
</body>
</html>
`;

fullstack_lth

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
前端进阶（十三）Node.js实战

传统意义上的 JavaScript 运行在浏览器上，这是因为浏览器内核实际上分为两个部分:渲染引擎和 JavaScript 引擎。前者负责渲染 HTML + CSS，后者则负责运行 JavaScript。Chrome 使用的 JavaScript 引擎是 V8，它的速度非常快。Node.js 是一个运行在服务端的框架，它的底层就使用了 V8 引擎。我们知道 Apache + PHP 以及 Ja...
复制链接

扫一扫