nodejs搭建服务篇章二:nodejs搭建服务的路由目录分析及前端请求demo
-
nodejs搭建服务篇章一:nodejs搭建简易原生服务和基于express框架服务
-
nodejs搭建服务篇章二:nodejs搭建服务的路由目录分析及前端请求demo
-
nodejs搭建服务篇章三:nodejs搭建服务项目目录的简单介绍及app.js文件简单说明
-
nodejs搭建服务篇章四:前端通过nodejs搭建的服务连接MySQL数据库中的数据(数据库安装,数据库管理,ajax查询数据),超多图超详细
这个章节开始逐渐的学习下怎么请求服务端的数据:
一、什么是路由?路由分离?
- 路由: 所谓路由,其实就是访问路径,不同的访问路径会执行不同的处理逻辑。每个路由都可以有一个或多个处理函数,当匹配到路由时,这些函数将被执行。
- 路由分离: 可以根据nodejs项目文件夹routes看出,这就是存放路由文件的地方,而不是直接放到app.js中,入口文件app.js会把routes下的路由包含进来,在访问不同路由的时候,把用户的请求转发给相关的路由文件来进行处理。
二、前端利用ajax请求nodejs服务的数据
就以构建出routes目录下的users为例,前端请求数据:
- 在项目根目录,用
npm start
启动nodejs服务:
- 将routes/users.js中的代码修改为自己想返回的内容:
router.get('/', function(req, res, next) {
res.send('我是由users路由中返回的数据');
});
3. 按两次ctrl+c关闭服务,再重启下(再次强调,修改了服务代码重启才会生效):
4. 在view/index.html中写前端代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div>我是html中的内容</div>
<script type="text/javascript" src="https://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$.ajax({
url:'/users',
success(res){
console.log(res)
alert(res)
}
})
</script>
</body>
</html>
页面中:
network:
到这里,可以看出前端请求成啦,是不是觉得服务其实也可以是很简单的东西~