安装模块
cnpm/npm i mime -g/D
cnpm/npm i iconv-lite -g/D
cnpm/npm i bufferhelper -g/D
引入模块
const http = require("http"),//http模块 node核心模块之一 创建server服务器使用
urlModule = require("url"),//引入url模块，解析url对象使用
mime = require("mime"),//引入mime模块，读取任何类型的文件
lite = require("iconv-lite"),//编码模块
bufhelp = require("bufferhelper"),//buffer辅助模块
fs = require("fs"); //文件系统模块
具体实现
//文件目录 这涉及到文件能否被读取的问题
const path = __dirname;
//创建server
const sever = http.createServer(function(req,res){
//解析req.url
urlObj = urlModule.parse(req.url,true);//第二个参数为true则把查询字符串也转换为对象
//把查询字符串提取出来保存
var keyword = urlObj.query.keyword;
//服务端打印请求文件路径
console.log("请求的文件路径：" , path+urlObj.path);
//写入头头信息，包含所有文件mime类型
res.writeHead(200 ,{"Content-Type":mime.getType(path+urlObj.path)});
//如果是主页 则返回主页
if(req.url === "/" || req.url === "index.html"){
fs.readFile("index.html",function(err,data){
res.end(data);
})
}
//如果是Google浏览器请求图标，找到图标返回
else if(req.url === "/favicon.ico"){
cbreadFlie(path+urlObj.path,res) ;
}
//如果查询字符串不为空，则使用get请求获得数据
else if(keyword){
console.log(keyword);
console.log(urlObj.query)
console.log(urlObj.path)
var url = `http://www.bookschina.com/book_find2/ajax/?action=${keyword}&keyword=${keyword}`;
//get请求其他服务器的数据
http.get(url,(res_data)=>{
var bufferhelper = new bufhelp();
res_data.on("data",(chunk)=>{
bufferhelper.concat(chunk);
});
res_data.on("end",()=>{
const html = lite.decode(bufferhelper.toBuffer(),'GBK');//转化编码
res.end(html);
});
});
}else{
//如果是其他mime类型的文件直接调用
cbreadFlie(path+urlObj.path,res) ;
}
});
sever.listen(3000);//设置监听端口
console.log("启动完成!");
//自定义函数，读取任何类型的文件
function cbreadFlie(url,res){
fs.readFile(url,function(err,data){
if(err) return ;
res.end(data);
});
}
html请求页面代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="/include/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="app">
<input type="text">
<button id="btn">anniu</button>
<p id = "keyword">
</p>
</div>
<script>
$("#btn").on("click",function(){
$.get({
url:"http://localhost:3000/suggest",
data:{
keyword:$("#app input").val()
},
success:function(data){
var data = JSON.parse(data);
var html = "";
if(data.length === 0){
html=`<div>没有查询到任何东西</div>`;
}
// console.log(data);
data.forEach(element => {
html+= `<div>${element.label}</div>`
});
$("#keyword").html(html);
}
})
})
</script>
</body>
</html>
网友评论