在没有使用express库的情况下搭建web服务,也是很简单的,当然有express库搭个web服务更方便,后面会把使用express库搭建服务器的代码也补上哦~以及静态页面请求,动态请求(ajax 等 等陆续补上)
一、用原生node搭建web服务器
nodeJs提供了http内置模块,可以用来构建服务器。
首先需要用到 node里的 http模块
引入模块 let http = require(‘http’)
新建serve.js文件:
let http = require('http');
let server = http.createServer((req,res)=>{//地址栏有人访问时触发回调
if(req.url!=='/favicon.ico'){//为了不读图标请求,这个判断不用管,当然可以不要
console.log("请求地址",req.url);//请求地址
//设置请求头
res.writeHead(200,{'content-Type':'text/html;charset=utf-8'})
//可以不要,因为读的html文件有写utf-8等
console.log("有人访问了")
res.write('把数据读到浏览器');//响应数据到--浏览器
res.end()//响应结束(要告诉浏览响应都全结束了,不然浏览器就一直转傻等着。)
}
});
let port = 3000;
let hostname='localhost'
server.listen(port,hostname,()=>{
//启动服务时响应 hostname域名可以省,默认localhost
console.log('server is runring...')
})
注意 引入node内置模块时,不需要加路径
这样一个简单的web服务器就搭建好了,启动下试试吧。。。
当你在浏览器输入 localhost:3000时
可以看到输入localhost:3000==localhost:3000/请求响应的是根 / (对,在默认情况下请求的就是根)
http.createServer((req,res)=>{}) 用来创建服务对象的,里面的回调函数有两个参数,req与res:
req(respones)意味着,浏览器地址栏输入时地址发了个请求(可能还会带一些参数数据),如果想去拿浏览器发送请求带进来的数据时,就要从req对象上取。
res 意味着请求成功了,并且作出了响应的动作(浏览器发过来请求,请求成功了,要回应一下)res就负责给浏览器响应后的内容。
req浏览器---->服务器
res服务器---->浏览器
以上就是简单的把服务搭起来了,那如果想请求的是某个具体的html文件呢,就要用到fs内置模块,系统模块,用来读文件,静态页面托管的。。。嗯~明天更新。。。。
二、请求页面—实现静态请求
以上简单搭建个web服务, 运行也能跑起来了,服务能跑起来当然要做点业务了。。。。
下面就要用到node内置模块fs 进行操作文件,实现可以访问前端的html页面。
引入系统模块 let fs = require(”fs“)
为了让读者更加容易理解,我先把我的目录暴露在这。
说明:这里只用到了,www目录下的home,index,error页面,等下 要访问这几个访问这几个页面。
新建serve.js文件:
let http = require('http');
let fs = require('fs')
let server = http.createServer((req,res)=>{
if(req.url!=='/favicon.ico'){
console.log("请求地址",req.url);//请求地址
//文件操作
staticwww(req,res)
}
});
let staticwww = (req,res)=>{
let path = req.url=='/'?'/index.html':req.url;
//上面已经说过了,req对象上是可以拿到请求地址的。
fs.readFile('./www'+path,(err,data)=>{
if(!err){//读文件成功
res.write(data)
//把读到文件的数据,响应给浏览器渲染(是二进制流)
res.end();//响应结束
}else{//读文件失败
fs.readFile('./www/error.html',(err,data)=>{
res.write(data)
res.end();//响应结束
})
}
})
}
server.listen(3000)
//fs.readFile("文件路径",回调(err,data))
这里的文件路径就是要去访问的前端页面的路径。
err:指当发出请求去到根目录里找这个请求的文件没有查到时,就会走err这里
data:指请求成功读到所指的文件的数据。data就是读到的数据。
地址发出请求:http://localhost:3000/home.html
如果输入一个响应不到的页面时,会全部走报错页面。
地址发出请求:http://localhost:3000/home123 .html
当请求的页面在根目录下找不到时,全部当作报错页面处理。
这里都是用的原生node,用express库的话就更容易理解了,代码也简洁多了。有库干嘛不用呢 嗯。。。明天更新。。。。。。