node.js:<4>静态资源服务器和路由

学完了对客户端的响应和回复,接下来我们来了解一下如何分享静态资源,比如计算机上的图片,网页,样式或者是代码;

1、我们同样使用的模块express:

//1.1 使用nodemon 小工具启动工程
//1.2 创建一个static服务器对客户端提供静态资源
const express = require('express')
const app = express()

这里我们要介绍一个小工具:nodemon,在此之前我们更改自己代码的时候每次都需要重启服务器,但是利用这个工具,我们可以让它自动重启服务器,我这里每次更改代码都是自动的帮我重启,那么这个工具怎么用呢?

1)安装:

npm i nodemon -g

2)只需要我们再启动工程的时候使用nodemon代替node就可以了:

2、使用app.use()函数进行托管:

//2.1 向服务器托管文件夹为../Code1/素材的资源,客户端可以通过前缀:/resouces加上文件名来访问
app.use('/time',express.static('../Code1/素材'))

这里的‘/time’是一个前缀,就是在我们在网址后面输入文件名的时候需要加上这个前缀才能访问到;express.static('url')就是一个托管静态资源的方法,url是自己文件的文件夹名,这时候只会访问该文件夹里面的文件,只需要在网址后加入前缀和文件名即可:

我们可以通过文件名来访问里面的样式文件:

 同样,我们试一试图片:

可以看到没有问题,那么我们接下来了解一下路由。

什么是路由?

其实就是一种映射关系,我们在之前的博客中也可以了解到,我们监听客户端数据的时候,app.get('url,(res,req)=>{}') 这就是路由,当客户端发起请求的时候,会先经过路由的判断,判断客户端的请求是否对应,如果url对应,则会执行后面的回调函数;

之前我们经常将get或者post监听放在app后,也即是服务器的那个.js文件,这样不利于写代码,也非常不规范,现在我们需要将它们模块化一下:

1、新建一个myrouter.js文件(里面的代码如下):

 //1.1 导入express模块 
 const express=require('express')
 //1.2 创建路由对象
 const router = express.Router()
 //2.1 挂载路由

 router.get('/mywelcome',(req,res)=>{
    console.log('a customer come')
    res.send('hello mycustomer')
})


 //3.1 向外暴露路由对象
 module.exports = router

我们通过下面代码来创建路由对象:

 //1.2 创建路由对象
 const router = express.Router()

 2、同样,我们需要利用express模块里面的router对象,所以我们的思路就是:创建一个router对象,将路由挂在到router上,然后通过module.exports暴露出去:

我们挂在的路由:

 router.get('/mywelcome',(req,res)=>{
    console.log('a customer come')
    res.send('hello mycustomer')
})

当然,我们可以挂很多路由(映射关系);

3、当我们写好myrouter.js模块后,我们在到服务器文件里面进行导入即可:

//4.1 导入我的路由模块
const myrouter = require('./myRouter')
//4.2 使用我们的路由模块
app.use('/resources',myrouter)

 导入的模块通过myrouter接收,同样使用use方法来进行使用,也就是托管一样,我们这时候会很好奇,到底use这个方法是干嘛的,这个不用急,可以告诉你们use里面都是中间件,之前的static和这个模块对象都可以叫做中间件,同样,这里的/resources也是前缀,具体就不演示了,大家可以自己试一试。

最后,我们学习一定要细心,不要写错了代码,哪怕是一个字母,不然报个错什么的是非常麻烦的。

关注我,更多分享!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

编程学渣ズ

谢谢老板

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值