nodeJs留言板 实现

1.两个页面 ①首页 ② 输入留言内容页面
如图:
首页进入

在这里插入图片描述

功能实现:
1.点击‘ 发表留言按钮’ 跳转至 post.html页面输入信息。
2.在post.html页面中,点击 首页 会重新跳回 index.html(注意路径),点击 ‘确认发表’ 会在默认的留言列表中新增,并且跳回首页。

涉及知识点:
1.服务器构建。核心模块 http引入、端口设置
2.url核心模块: 页面的跳转是通过对url地址解析,/ 为首页,也即index.html
3.fs核心模块:解析页面 是通过fs文件读取。
3.页面呈现:通过bootstrap,图片css样式js等外部静态资源在文件读取的时候需要进行判断。
4.留言填写成功并确认发布将新留言对象添加至留言列表的时候,需要对响应重新定位 res.statusCode = 302 res.setHeader(‘Location’,’/’)

注意:
1.与以往页面打开不同。我们通过nodeJs 命令语句 node ,执行js文件。
2.两个html页面之间有数据交互(根据数据提交的方式,我们这里是对url解析获得数据)。post页面新增的留言需要保存到index页面中呈现。在post页面中通过简单的表单提交给 comments页面(这里使用了get上传方式,输入内容会跟在url后面通过?连接,NodeJS中有特定模块处理url,即url核心模块)
3.在非NodeJS的情况下,两个html页面通过a锚点进行切换是没有问题的。在NodeJS环境下,需要对url地址进行监听解析,一一判断:
4.在 新的留言发表界面 使用了表单提交,选择提交方式为“get” ,所以提交的数据是跟在url后面的。在这里我们要对 url进行剪切。使用核心模块 url的方法 url.parse(url) (涉及到中文的增加一个参数 url.parse(url,true) ) url.parse(url,true).pathname 是纯路径 不带数据的,url.parse(url,true).query则获取到get提交的数据,且是对象格式。 这里只要push进默认的留言数据组就可以了。
5. 在新的留言push进之后,需要再将页面跳回到留言表首页。 这里我们使用重定向。statusCode 为301 是临时重定向值 setHeader(‘Location’,’/’) 回到主页。

if(tempUrl ==='/'){
            fs.readFile('./index.html',function(err,data){
         		........
                res.end(data)
        }) 
        }else if(tempUrl ==='/post.html'){
            fs.readFile('./views/post.html',function(err,data){
            res.end(data)
        })   
    }

4.调用了引擎模块,art-template,在nodeJs 中用法与script中不一样,通过获取template.render()的返回值,解析在页面上。
具体用法:

var temp = template.render(data.toString(),{
           		 comments		
         	})
res.end(temp)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值