Ajax的基本用法

203 阅读2分钟

Ajax

Ajax 是浏览器中的技术:用来实现客户端网页请求服务器的数据。

它的英文全称是 Asynchronous Javascript And XML,简称 Ajax。

中文官网地址:www.axios-http.cn/

语法

第一种语法

axios({
    // 必须的,如果没有会报错,它是请求地址 -- 服务器资源地址
    url: '',
    // method:请求方式,如get,post,这个方式一定要参考接口文档
    method: ''
}).then(参数 => {
    
})

第二种语法

axios.get('http:',{
    params:{ id:1 }
}).then(result => {
    console.log(result)
})

请求方式

不同的操作对应着不同的方式

要基于文档去进行操作

GET请求

GET 请求用于从服务器获取数据

常用业务有:

1.请求数据

2.搜索

3.详情

get方式的参数传递有两种常见方式 1.在url拼接: 地址?参数=值&参数=值 2.在配置项中通过params指定参数对象

image.png

POST请求

POST 请求用于向服务器新增数据

常用业务有:

1.新增

2.注册

3.登录

image.png

DELETE请求

DELETE 请求用于删除服务器上的数据

常用业务有

删除

image.png

PUT请求

PUT 请求用于更新服务器上的数据(侧重于完整更新:例如更新用户的完整信息)

常用业务有

完整编辑

image.png

PATCH请求

PATCH 请求用于更新服务器上的数据(侧重于部分更新:例如只更新用户的手机号)

常用业务有

部分更新

image.png

network工具

遇到Ajax方面的错误,可以使用浏览器的network面板来查找错误

遇到错误提示时,进行下列排查

打开network 1.请求发了没有 2.请求如果发了,url是否正确,请求方式是否正确 3.参数是否正确 4.服务器是否有响应

image.png 注:有关Ajax方面的错误,不应只查看 “Console”面板,必须通过 “Network”面板进行排查

通过查看network面板,得知状态码status

200:成功

301,302:重定向

304:数据来源于缓存

400:参数有问题

401,403:没有权限,用户信息验证失败

404:页面资源未找到,一般是url写错了

405:路径有问题

500:服务器崩了