Node学习-02

236 阅读2分钟

Node学习-02

初步实现Apache功能

var http = require('http');
var fs = require('fs');

var server = http.createServer();

server.on('request', function (request, response) {
	console.log(request.url);
	var url = request.url;
    
	var wwwdir = 'C:/Users/Administrator/Desktop/Node/Day2/';
	var filePath = 'index.html';

	if (url !== '/') {
		filePath = url;
	}

	fs.readFile(wwwdir + filePath, function(err, data) {
		if (err) {
			return response.end('404 Not Found');
		}
		response.end(data);
	})
});

server.listen(3000, function () {
	console.log('服务器启动成功了,可以通过 http://127.0.0.1:3000/ 来进行访问');
})

模板引擎

安装art-template

npm install art-template --save -g

浏览器中使用模板引擎

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script src="../../node_modules/art-template/lib/template-web.js"></script>
    <script type="text/template" id="tpl">
        hello {{name}}
    </script>

    <script>
        var ret = template('tpl', {
            name: 'jack'
        })

        console.log(ret);
    </script>
</body> 
</html>

Node中使用模板引擎

// art-template(模板引擎)不仅可以在浏览器使用,也可以在node中使用

// 1. 下载安装art-template
// npm install art-template --save -g


// 2. 在需要使用的文件中加载art-template
const template = require('art-template');

// demo
// var tplStr = `<h2>hello {{ name }}</h2>`

// const result = template.render(tplStr, {
//     name: 'jack'
// });

// console.log(result);

const fs = require('fs');
fs.readFile('./tpl.html', function(err, data) {
    if (err) {
        return console.log('读取文件失败了');
    }
    const result = template.render(data.toString(), {
        name: 'jack'
    })

    console.log(result);
})

客户端渲染和服务端渲染

服务端渲染

  • 服务端将填好数据的html返回给客户端,一次请求搞定

  • 单次来看,服务端渲染更快;

  • 服务端渲染是可以被爬虫抓取到的,客户端异步渲染是很难被爬虫抓取到的

客户端渲染

  • 第一次请求拿到页面(html),执行script,再次请求拿到数据,将数据渲染到页面中(要进行多次请求)

  • 客户端渲染利于前后端分离,页面部分刷新

  • 但是客户端渲染不利于SEO(搜索引擎优化)

网站

网站既不是纯服务端也不是纯客户端的,而是两者结合起来的,例如京东的商品列表就是服务端渲染的,而商品的评论信息则是客户端渲染的

处理静态资源

方便的统一处理静态资源,可以使用正则表达式去匹配

404处理

返回404.html

服务端重定向

如何通过服务器让客户端重定向?

  1. 状态码设置为302临时重定向
  2. 在响应头中通过location告诉客户端往哪重定向
res.statusCode = 302;
res.setHeader('Location', '/');