微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Ajax基础(中)

这节主要在上节的基础上学会如何使用Ajax

源码下载:

链接https://pan.baidu.com/s/1kG-vACFxneAZqONdo97XrQ

提取码:k21y

在WebStorm中打开整个工程,首先需要关注的是bin、routes、views文件夹下的内容

 

 

 在上一节介绍过如何启动web服务器,这里再介绍一种服务器的方法:选中AjaxServer-->bin-->www(服务器完成后这部分代码自动生成),

右击,选择Run 'www',同样也可以启动服务器,这样输入网址就可以访问服务器资源了。

 

 为什么输入localhost:3000就会返回一个页面呢?

构建服务器的时候,会生成一个routes和views文件夹,在输入网址的时候,首先会访问这两文件夹里面的内容

routes--->index.js    index title就是index.ejs中的title,如果Express修改为其他的,返回的页面内容也会有相应的变化

var express = require('express');
var router = express.Router();

/* GET home page. 页面路由*/
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;

views-->index.ejs

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
  </body>
</html>

我把Express--->Ajax学习大本营,返回的页面也变化了

 

 

上面能够返回页面的叫做页面路由,那么怎么返回数据呢?返回数据的叫做接口路由,这里接口路由返回一json数据。

var express = require('express');
var router = express.Router();

/* GET home page. 页面路由:是返回页面的*/
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Ajax学习大本营' });

});

/*接口路由:返回数据*/
router.get('/apI/One',function (req,res,next){
  res.json({
    "state":200,
    data:{
      "name":"zxtang",
      "age":20
    }
  });
});
module.exports = router;

 

 

 同样的,使用Postman来测试

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 



版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐