初步实现功能
相关文件准备
要想实现成绩查询,首先需要两个页面,一个用于根据学号查询,另一个用于显示成绩。
在这里我们将根据学号来查询的页面设为index.tpl,将成绩显示的页面设为result.tpl.内容如下:
接下来要准备一个保存学生成的绩文件,我们将其设为data.json,这里我们使用对象的形式保存数据,这样方便接下来的调用。
代码编写
代码思路
1.在编写代码前,要先确定需要使用到哪些模块,提前引入,方便接下来的使用
2.引入后,要先创建一个服务来通过浏览器地址栏访问相关页面
3.将json文件中的数据放到到相应的位置
4.将查询到的数据渲染到浏览器上
代码
//引入相应模块
const http = require('http')
const fs = require('fs');
const path = require('path')
const querystring = require('querystring')
const data = require('./data.json')
//创建服务
http.createServer((req,res)=>{
//根据url地址栏中的字符串进行判断
if(req.url.startsWith('/query')&&req.method=="GET"){
//读取相应路径下的文件
fs.readFile(path.join(__dirname,'view','index.tpl'),'utf8',(err,content)=>{
if(err){
//将utf8的编码格式写入报文头来解析汉字
res.writeHead(500,{
'Content-Type':'text/plain;charset=utf8'
})
res.end("服务错误,请联系管理员")
}
res.end(content)
})
}else if(req.url.startsWith('/score')&&req.method=='POST'){
//定义一个空字符串
let pdata = '';
//当请求数据时,触发事件data,用pdata来接受post请求的数据
req.on('data',(chunk)=>{
pdata+=chunk;
})
//当请求结束时,触发该事件
req.on('end',()=>{
//将pdata转化为对象
let obj= querystring.parse(pdata)
//因为result.tpl中输入框的name为code,所以obj应为{code:no123}
//获取相应学号的信息,并将它存放在result中
let result = data[obj.code]
fs.readFile(path.join(__dirname,'view','result.tpl'),'utf8',(err,content)=>{
if(err){
res.end('Error')
}
//用result对象中的相关数据替换result.tpl中的相关内容
//注意:要想使用replace方法,就一定要在readfile方法中加入utf8编码格式
content = content.replace('$$chinese$$',result.chinses)
content = content.replace('$$math$$',result.math)
content = content.replace('$$english$$',result.english)
content = content.replace('$$summary$$',result.summary)
res.end(content)
})
})
}
}).listen(3000,()=>{
console.log('running....')
})
代码优化
使用函数来优化
在上面的代码中,读取文件操作用到了相同的方法,这个时候我们就可以将这个方法封装起来,后面使用时直接调用即可,减少代码量。
注意:在封装函数时,函数中用到的形参都要进行声明
方法优化
art-template 是一个简约、超快的模板引擎。
它采用作用域预声明的技术来优化模板渲染速度,从而获得接近 JavaScript 极限的运行性能,并且同时支持 NodeJS 和浏览器。
我们可以引入art-template模板引擎来优化代码
const template = require('art-template')
if(req.url.startsWith('/query')&&req.method=="GET"){
//读取相应路径下的文件
fs.readFile(path.join(__dirname,'view','index.tpl'),'utf8',(err,content)=>{
if(err){
//将utf8的编码格式写入报文头来解析汉字
res.writeHead(500,{
'Content-Type':'text/plain;charset=utf8'
})
res.end("服务错误,请联系管理员")
}
res.end(content)
})
以上代码可以简化为:
// 基于模板名渲染模板 template(filename, data);
let content = template(path.join(__dirname,'view','index.tpl'),{})
res.end(content)