根据用户不同请求-读取不同HTML文件响应|学习笔记

简介: 快速学习根据用户不同请求-读取不同HTML文件响应。本节课还是根据用户不同请求,做出不同的反应,只是这次不同响应不是直接写的,而是根据html网页来实现的。

开发者课程【Node.js 入门与实战:根据用户不同请求-读取不同HTML文件响应 】学习笔记,与课程紧密联系,让用户快速学习知识

课程地址:https://developer.aliyun.com/learning/course/588/detail/8260


根据用户不同请求-读取不同HTML文件响应

本节课还是根据用户不同请求,做出不同的反应,只是这次不同响应不是直接写的,而是根据html网页来实现的。

代码设置

//根据用户不同请求,做出不同响应(响应现有的 HTML 文件)

//加载 http模块

var http = require( 'http');

//加载fs模块

var fs = require( 'fs');

//加载path模块

var path = require( ' path ');

//创建http服务,并启动该服务

http .create Server(function (req, res) {

//通过 req.url 获取用户请求的路径,根据不同的请求路径服务器做出不同的响应 if (req.url ==‘/'req.url === '/index'){

//读取index.html文件

fs. Read File(path .join(__dir name, 'htmls', 'index.html'),function (err, data){});

}else if (req.url == '/login '){1/读取index.html文件

fs. Read File(path  .join(__dir name, 'htmls', 'login.html'),function (err, data) {});

}else if (req.url =a= '/list'){//读取index.html文件

fs. Read File(path .join(__dir name,'htmls', 'list.html'),function (err, data){巴});

}else if (req.url =s '/register'){//读取index.html文件

fs. Read File(path. join(_ dir name,'htmls ', 'register.html'), function (err, data)});

}else i

//读取index.html文件

Fs .read File(path .join(__dir name,'htmls', '404.html' ),function (err, data){});

//通过 req.url 获取用户请求的路径,根据不同的请求路径服务器做出不同的响应

if (req.url === '/'1 req.url === '/index ' ){

//读取 index.html文件

fs. Read File(path .join(__dir name ,'html s ', 'index.html'), function (err ,data){if (err) {throw err;

//把读取到的index.html中的内容直接发送给浏览器res .end(data);

});

}else if (req.url === '/ login') i

//读取index.html文件

fs. Read File(path .join(_ dir name ,'html s', 'login.html'), function (err ,data){if (err) i

throw err;

//把读取到的index.html中的内容直接发送给浏览器res .end(data);

});

}else if (req.url === '/list'){

//读取index.html文件

fs. Read File(path .join(_ dir name, 'html s', 'list.html'),function (err, data)

{

if (err){

throw err;}

//把读取到的index.html中的内容直接发送给浏览器res .end(data);

});

}else if (req.url === '/register'){

//读取index.html文件

fs. Read File(path .join(__dir name, 'html s', 'register.html'),function (err, data){if (err){

throw err;}

//把读取到的index.html中的内容直接发送给浏览器res .end(data);

});

}else {

//读取index.html文件

fs. Read File(path .join(__dir name, 'html s ', 'index.html '),function (err, data)

{

if (err){

l throw err;}

//把读取到的index.html中的内容直接发送给浏览器res. end(data);

});

}

}).listen(9090,function ( {

console.log( 'http: / / localhost : 9090');});

例1、

<!DOCTYPE html><html lang="en"><head>

<meta charset="UTF-8">

<title>Hello Index</title></head>

<body>

<h1 style="color: red; ">Hello Index</h1>

<h1>你好首页!!!看乱码吗?</h1>

</body>

</html>

执行结果:

Hello lndex(此处字体为红色)

你好首页!!!看乱码吗?

注意:

在执行代码时,发现执行结果是空白页面,首先应该查看浏览器,浏览器没有问题再使用工具看是否有发起此请求,如果浏览器有发起响应,注意看服务器是不是有返回响应。

相关文章
|
1月前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
48 2
|
21天前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
34 0
|
2月前
|
Web App开发 前端开发 搜索推荐
创建HTML文件
【10月更文挑战第14天】创建HTML文件
53 4
|
2月前
|
JSON 数据格式
LangChain-20 Document Loader 文件加载 加载MD DOCX EXCEL PPT PDF HTML JSON 等多种文件格式 后续可通过FAISS向量化 增强检索
LangChain-20 Document Loader 文件加载 加载MD DOCX EXCEL PPT PDF HTML JSON 等多种文件格式 后续可通过FAISS向量化 增强检索
108 2
|
3月前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
51 6
|
2月前
|
JavaScript 前端开发 容器
Vue生成PDF文件攻略:html2canvas与jspdf联手,中文乱码与自动换行难题攻克
Vue生成PDF文件攻略:html2canvas与jspdf联手,中文乱码与自动换行难题攻克
178 0
|
3月前
|
Web App开发 前端开发 JavaScript
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
|
4月前
写一个HTML文件
【8月更文挑战第27天】写一个HTML文件。
46 1
|
15天前
|
前端开发 测试技术 定位技术
如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤
本文深入介绍了如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤。通过实例展示了主页、关于我们、产品展示、新闻动态及联系我们等页面的设计与实现,强调了合理布局、美观设计及用户体验的重要性。旨在为企业打造一个既专业又具吸引力的线上平台。
31 7