【ajax 05】$.ajax 与RESTful API

向服务器端传递函数名字的参数名称

客户端：src=“/js/jquery.min.js?callback”

服务器：const callback = req.query.cb

​ const data = callback+"({name:‘zhangsan’})"

#jsonpCallback:‘callback’

这样请求成功之后就会默认使用 callback 方法而不是 success()

---

$.get(‘urlAddress’,{name:‘zhangsan’,age:30},function(response){ })

$.post(‘urlAddress’,{name:‘zhangsan’,age:30},function(response){ })

---

    $('#btn').on('click',function(){ 
      // GET 方式请求
        $.get('/base','name=zhangsan&age=30',function(response){
            console.log(response)
        })；
      // POST 方式请求  (无 Data)
      $.post('/base',function(response){
            console.log(response)
        })；
      // POST 方式请求
      $.post('/base',{name:'zhangan',age:39},function(response){
            console.log(response)
        })；
    });

【 jQuery 中 Ajax 全局事件 】

.ajaxStart( ) //请求开始时触发

.ajaxComplete( ) // 请求结束时触发

Ajax 全局事件一定要绑定在 document 上：

$(document).on('ajaxStart',function(){

​	console.log('start');

})
$(document).on('ajaxStart',function(){

​	console.log('start');

})

— 插件NProgress

<link rel='stylesheet' href='nprogress.css'/>
<script src='nprogress.js'></script>
NProgress.start();
NProgress.done();

RESTful API概述：

一套关于设计请求的规范：

方式	动作
GET	获取数据	http://www.example.com/users
POST	添加数据	http://www.example.com/users
PUT	更新ID为1的用户信息	http://www.example.com/users/1
DELETE	删除ID为1的用户信息	http://www.example.com/users/1
GET	获取用户ID为1的信息	http://www.example.com/users/1

app.get('/user/:id',(req,res)=>{
    const id = req.params.id;
    res.send（"当前我们是在获取id为${id}的用户信息"）；
});

app.delete('/user/:id',(req,res)=>{
    const id = req.params.id;
    res.send（"当前我们是在删除id为${id}的用户信息"）；
});

app.put('/user/:id',(req,res)=>{
    const id = req.params.id;
    res.send（"当前我们是在更新id为${id}的用户信息"）；
});

app.post('/user/:id',(req,res)=>{
    const id = req.params.id;
    res.send（"当前我们是在添加id为${id}的用户信息"）；
});

<script>
	$.ajax({
    //type:'put',
    //type:'post',
    //type:'delete',
    type:'get',
    url:'/users/1',
    success:function(response){
      console.log(respomse)
    }
  })
</script>

---

---