aixos相关知识

### 客户端--服务器数据交互

    1.发送请求

    2.响应

    

    3.不同请求类型

        1).GET:从服务器读取数据

        2).POST: 向服务器添加新数据

        3).PUT:向服务器更新已有数据

        4).DELETE:删除服务端数据

        

    4.API分类（前后端数据交互的接口）

        1).REST API(restful)

            同一个请求路径可以有多个操作，请求方式可多个 GET/POST/PUT/DELETE

            发送请求CRUD（增删改查）执行哪个操作由请求决定

        2).非REST API(restless)

            一般只有post/get请求

            请求方式不决定CRUD操作

    5.json-server搭建REST接口

        gitHub-->json-server-->npm i -g json-server -->db.json -->  json-server --watch db.json

    6.XMLHttpRequest与一般HTTP不同

        与服务器交互时，可直接从URL获取数据，而无需刷新页面

        1).ajax一种特别的HTTP请求，对于服务器没有任何区别，区别在于浏览器

        2).浏览器只有XHR fetch是ajax请求，其他为非ajax请求

        3).浏览器接收到响应，ajax不会更新页面，只调用相关回调

        

### axios特点

        从浏览器中创建 XMLHttpRequests

        从 node.js 创建 http 请求

        支持 Promise API

        拦截请求和响应

        转换请求数据和响应数据

        取消请求

        自动转换 JSON 数据

        客户端支持防御 XSRF

        

### axios一般使用

    1.发送get请求，配置默认格式

        axios.defaults.method = 'GET' //设置默认为get请求

        axios.defaults.baseURL = 'http://localhost:3000' //设置基础url

        aixos({

            url:'/posts',

            method:'GET',

        }).then(response =>{

            cosole.log(response)

        })

    2.拦截器：对请求、响应结构做处理，检查

    3.请求取消

        let cancel = null

        if(cancel !==null){

            //取消上一次请求

            cancel()

        }

        axios({

            url:http://localhost:3000/posts,

            method:'GET',

            cancelToken：new axios.CancelToken(function(c){

                cancel = c

            }) //取消发送请求

        }).then(response=>{

            cancel = null

            console.log(response)

        })