一、在Node中使用模板引擎

js代码：

// art-template不仅可以在浏览器使用，也可以在node中使用

// 1.安装 npm install art-temlate模板引擎

// 2.在需要使用的文件模块中加载art-template

//      只需要使用require方法加载就可以了：require('art-template')

//      参数中的art-template就是你下载的包的名字

//      也就是说你install 的名字是什么，则你require中的就是什么

// 3.查文档，使用模板引擎的API

var template = require('art-template')

var fs = require('fs')

fs.readFile('./tpl.html',function(err,data){

    if(err){

       return console.log('读取内容失败了')

    }

    // 默认读取到的data是二进制数据

    //而模板引擎的render方法需要接收的是字符串

    //所以这里需要把data二进制数据转换为字符串，才能供模板引擎使用

    var ret = template.render(data.toString(),{

        name:'Jack',

        age:18,

        province:'北京市',

        hobbies:[

            '写代码',

            '唱歌',

            '打游戏'

        ],

        title:'个人信息'

    })

    console.log(ret)

})

html代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>{{title}}</title>

</head>

<body>

    <p>大家好，我叫:{{ name }}</p>

    <p>我今年{{ age }}岁了</p>

    <h1>我来自{{ province }}<h1>

    <p>我喜欢:{{each hobbies}}{{ $value }}{{/each}}</p>

    <script>

        var foo = '{{title}}'

    </script>

</body>

</html>

结果：渲染成功

二、Nodejs中url模块的使用

var url = require('url')

// parse方法将路径解析为一个方便操作的对象，第二个参数为 true 表示直接将查询字符串转为一个对象（通过query属性来访问）

var obj = url.parse('/pinglun?name=火箭队&message=下赛季加油',true)

console.log(obj)

// 获取查询字符串对象

console.log(obj.query)

// 单独获取不包含查询字符串的路径部分(该路径不包含 ? 之后的内容)

console.log(obj.pathname)

结果：

三、通过服务器让客户端重定向

代码：

var http = require('http')

http.createServer(function(req,res){

    var url = req.url

    if(url === '/'){

        res.setHeader('Content-Type','text/plain; charset=utf-8')

        res.end('起始页')

    }else if(url === '/next'){

        res.setHeader('Content-Type','text/plain; charset=utf-8')

        res.end('成功跳转')

        console.log('成功跳转')

    }else if(url === '/tiaozhuan'){

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

        //  1.状态码设置为 302 临时重定向(通过statusCode设置)

        //  2.在响应头中通过 Location告诉客户端往哪儿重定向(通过setHeader设置)

        //  如果客户端发现收到服务器的响应的状态码是 302 就会自动去响应头中找 Location，然后对改地址发起新的请求

        //  所以你就能看到客户端自动跳转了

        res.statusCode = 302

        res.setHeader('Location', '/next')

        console.log('跳转请求')

        res.end()

        //注意： 一次请求对应一次响应，响应结束，这次请求也就结束了

        //      301 永久重定向 浏览器会记住

        //      302 临时重定向 浏览器不记忆

    }

})

.listen(3000,function(){

    console.log('Server is running')

})

结果：浏览器输入 http://127.0.0.1:3000/tiaozhuan 后会自动跳转到 http://127.0.0.1:3000/next

四、一些补充

1.服务端渲染和客户端渲染：

1.1 客户端渲染：

1.2服务端渲染：

1.3服务端渲染和客户端渲染的区别：

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

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

  • 你会发现真的网站既不纯异步也不是纯客户端渲染出来的，而是两者结合来做的

  • 例如京东的商品列表就采用的是服务端渲染，目的是为了SEO搜索引擎优化。而它的商品列表评论为了用户体验，而且也不需要SEO优化，所以采用的是客户端渲染

Nodejs之路（二）—— Nodejs再入门的更多相关文章

  1. 基于Nodejs生态圈的TypeScript+React开发入门教程

    基于Nodejs生态圈的TypeScript+React开发入门教程   概述 本教程旨在为基于Nodejs npm生态圈的前端程序开发提供入门讲解. Nodejs是什么 Nodejs是一个高性能Ja ...

  2. 在阿里云 ECS 搭建 nginx https nodejs 环境（二、https）

    在阿里云 ECS 搭建 nginx https nodejs 环境(二) 这次主要内容是 如何在 ubuntu 的nginx 下配置 二级域名. 一. 域名解析 首先你需要去到你的 域名服务商那边 进 ...

  3. nodejs之路-[0]安装及简易配置

    题外话: 之前写过ubuntu下编译nodejs- 传送门:Ubuntu15.04编译安装nodejsV0.12.3 只是如今基本在win下做开发了-. 就以这篇帖子为开头,作为我踏上nodejs之路 ...

  4. NodeJS笔记（二）- 修改模块默认保存路径

    参考:nodejs prefix(全局)和cache(缓存)windows下设置 假设nodejs根目录为“D:\nodejs” 如下所示,新建“node_cache”文件夹用来存放全局缓存 该路径下 ...

  5. nodejs学习笔记一——nodejs安装

    a.nodejs安装 nodejs的安装没有什么说的默认安装即可.安装包官网下载即可:nodejs官网 本人用的是window的安装包node-v4.2.6-x64.msi 安装完成后打开命令行查看使 ...

  6. webpack入坑之旅（二）loader入门

    这是一系列文章,此系列所有的练习都存在了我的github仓库中vue-webpack 在本人有了新的理解与认识之后,会对文章有不定时的更正与更新.下面是目前完成的列表: webpack入坑之旅(一)不 ...

  7. SLAM+语音机器人DIY系列：（二）ROS入门——4.如何编写ROS的第一个程序hello_world

    摘要 ROS机器人操作系统在机器人应用领域很流行,依托代码开源和模块间协作等特性,给机器人开发者带来了很大的方便.我们的机器人“miiboo”中的大部分程序也采用ROS进行开发,所以本文就重点对ROS ...

  8. nodeJs学习过程之认识nodejs

    nodeJs只是听说过,没见过,没玩过.从新手开始,我想慢慢掌握它. 一.首先,我想知道nodeJs是什么? 摘自百度百科: Node.js是一套用来编写高性能网络服务器的JavaScript工具包, ...

  9. Java开发学习(二十三)----SpringMVC入门案例、工作流程解析及设置bean加载控制

    一.SpringMVC概述 SpringMVC是隶属于Spring框架的一部分,主要是用来进行Web开发,是对Servlet进行了封装.SpringMVC是处于Web层的框架,所以其主要的作用就是用来 ...

  10. 我的VSTO之路(二)：VSTO程序基本知识

    原文:我的VSTO之路(二):VSTO程序基本知识 开始之前,首先我介绍一下我的开发环境:VS2010 + Office 2010,是基于.Net framework 4.0和VSTO 4.0.以下的 ...

随机推荐

  1. 深度探索C++对象模型之第二章：构造函数语意学之Default constructor的构造操作

    C++新手一般由两个常见的误解: 如果任何class没有定义默认构造函数(default constructor),编译器就会合成一个来. 编译器合成的的default constructor会显示的 ...

  2. Cut the Sequence

    Cut the Sequence 有一个长度为n的序列\(\{a_i\}\),现在求将其划分成若干个区间,并保证每个区间的和不超过m的情况下,每个区间的最大值的和的最小值,\(0 < N ≤ 1 ...

  3. CCPC-WFinal-女生专场

    1001:CCPC直播   字符串处理,几个if语句 1002:口算训练   前缀和处理<=根号n的因数,大于根号n的因数每个数至多有一个,用vector存下每个大因数的位置,map离散化.查询 ...

  4. JavaScript 点击事件的三种写法

    嵌入式 <button οnclick='alert("hello")'>点击按钮</button> 脚本模型 btn.onclick=function() ...

  5. Flink常用资料网址

    Flink官网https://flink.apache.org/ 阿里flink开发文档 https://help.aliyun.com/product/45029.html?spm=a2c4g.11 ...

  6. 763 Hex Conversion

    原题网址:http://www.lintcode.com/zh-cn/problem/hex-conversion/ Given a decimal number n and an integer k ...

  7. 解决方案 -SQL脚本建表产生ORA-00942错误

    一.问题简介 1.开发环境 操作系统:win10 数 据 库:Oracle11g 数据库连接工具:Navicat  Premium 2.问题简述 在使用SQL Development.Navicat  ...

  8. VUE的组件为什么要EXPORT DEFAULT 转载

    Vue的组件为什么要export default   Vue 的模块机制 Vue 是通过 webpack 实现的模块化,因此可以使用 import 来引入模块,例如: 此外,你还可以在 bulid/w ...

  9. UVA-11987-Almost Union-Find-并查集的基本操作合并、删除、移位

    I hope you know the beautiful Union-Find structure. In this problem, you’re to implement something s ...

  10. <每日一题>算法题:集合求并集并排序

    题目描述 给你两个集合,要求{A} + {B}. 注:同一个集合中不会有两个相同的元素. 输入描述: 每组输入数据分为三行,第一行有两个数字n,m(0 ≤ n,m ≤ 10000),分别表示集合A和集 ...