HackerNews03-封装 render 函数|学习笔记

简介: 快速学习 HackerNews03-封装 render 函数

开发者学堂课程【Node.js 入门与实战 HackerNews03-封装render函数】学习笔记,与课程紧密联系,让用户快速学习知识

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


ackerNews03-封装 render 函数


封装一个render()函数

创建一个新的窗口

// 封装一个render()函数

function render(filename,res) {

fs.readFile(filename,function (err, data) {

if (err) {

res .writeHead(404,’Not Found’,{‘Content-Type’:’text/html ;charset=utf-8’});

res .end(‘404, not found.’);

return ;

}

res . setHeader(‘Content-Type’, mime . getType(req.url));

res .end(data);

});

}

// 先根据用户请求的路径(路由),将对应的HTML页面显示出来

if (req.url ===’/’ || req.url === ‘/index ‘&& req.method === ‘get’) {

// 读取 index.html

render(path. join(--dirname, ‘views’,’ index.html’), res); 

else if (req.url === ‘/submit’ && req.method === ‘get’) {

// 读取submit.html 并返回

render(path. join(--dirname, ‘views’,’ submit.html’), res);

else if (req.url === ‘/item’ && req.method === ‘get’) {

// 读取details.html 并返回

render(path. join(--dirname, ‘views’,’ details..html’), res);

else if (req.url === ‘/add’ && req.method === ‘get’) {

// 表示 get 方法提取一条新闻

else if (req.url === ‘/add’ && req.method === ‘get’) {

// 表示post方法提交一条新闻

else if (req.url.startsWith(‘/resources’) && req.method === ‘get’) {

//如果用户请求是以/resources 开头,并且是get请求,就认为用户是要请求静态资源

// /resources/images/s.gif

render(path. join(--dirname, req.url), res);

} else {

res .writeHead(404, ‘Not Found’, {

" Content-Type’: ‘text/html; charset=utf-8’

});

res.end(404, Page Not Found.’);

}

)).listen(9090, function () {

console. log(‘http://localhost:9090’);

}); 

构建完成后在cmd下进行验证

Node.index1.js下获得网站地址,复制粘贴到默认浏览器下,当出现无法访问此网站这类问题时,可以返回服务器看看是否出错了,根据报错信息检查是否代码出错。 

// 封装一个render()函数

function render(filename,res) {

fs.readFile(filename,function (err, data) {

if (err) {

res .writeHead(404,’Not Found’,{‘Content-Type’:’text/html ;charset=utf-8’});

res .end(‘404, not found.’);

return ;

}

res . setHeader(‘Content-Type’, mime . getType(filename));

res .end(data);

});

}

修改成功后在进入 cmd 下进行验证,实验完成

相关文章
|
前端开发
前端学习笔记202307学习笔记第五十七天-react源码-render方法解析2
前端学习笔记202307学习笔记第五十七天-react源码-render方法解析2
71 0
|
前端开发
前端学习笔记202307学习笔记第五十七天-react源码-render方法解析1
前端学习笔记202307学习笔记第五十七天-react源码-render方法解析1
46 0
|
前端开发
前端学习笔记202307学习笔记第五十九天-react源码-render方法解析2
前端学习笔记202307学习笔记第五十九天-react源码-render方法解析2
66 0
|
前端开发 索引
【React工作记录七十九】React+hook+ts+ant design封装一个具有动态表格得页面
【React工作记录七十九】React+hook+ts+ant design封装一个具有动态表格得页面
158 0
|
存储 JavaScript 前端开发
【前端每日一问002】jquery中each与data方法的用法与概念
【前端每日一问002】jquery中each与data方法的用法与概念
118 0
|
前端开发
【React工作记录七十七】React+hook+ts+ant design封装一个input和select搜索的组件
React+hook+ts+ant design封装一个input和select搜索的组件
172 0
|
前端开发
前端学习笔记202303学习笔记第四天-Vue3.0-事件传参和$event
前端学习笔记202303学习笔记第四天-Vue3.0-事件传参和$event
81 0
|
前端开发
前端学习笔记202304学习笔记第十六天-vue3.0-封装my-table组件
前端学习笔记202304学习笔记第十六天-vue3.0-封装my-table组件
47 0
|
JavaScript
js基础笔记学习247event对象3
js基础笔记学习247event对象3
83 0
js基础笔记学习247event对象3
|
JavaScript
js基础笔记学习246event对象2
js基础笔记学习246event对象2
65 0
js基础笔记学习246event对象2