发送请求的方法

it2023-06-13 68

一，jQuery中的请求

设置的jQuery的服务：

1.1 get 请求 $.get(url, [data], [callback], [type]) url:请求的 URL 地址。 data:请求携带的参数。 callback:载入成功时回调函数。 type:设置返回内容格式，xml, html, script, json, text, _default，返回的数据默认是字符串举例：

$.get('http://127.0.0.1:8000/jquery-server', {a:100, b:200}, function(data){ console.log(data);//响应体中的内容 },'json');//转换成json数据类型

1.2 post 请求 $.post(url, [data], [callback], [type]) url:请求的 URL 地址。 data:请求携带的参数。 callback:载入成功时回调函数。 type:设置返回内容格式，xml, html, script, json, text, _default，返回的数据默认是字符串举例：

$.post('http://127.0.0.1:8000/jquery-server', {a:100, b:200}, function(data){ console.log(data);//响应体中的内容 },'json');//转换成json数据类型

1.3 jQuery中的ajax请求通过$.ajax方法可以发送一切请求使用方式： $.ajax(options) options: 是一个配置对象，包含以下属性：

url: 要请求的目标地址 data: 携带的数据 type:请求的类型 dataType: 响应体结果的类型 success: 是一个函数，当请求成功的时候执行的回调函数 error: 是一个函数，当请求失败的时候执行的回调函数 timeout:超时时间 headers:头信息 contentType: 布尔值，指示本次请求是否通过设置content-type字段 processData: 布尔值，指示本次请求是否通过jQuery将数据序列化

$.ajax({ //url url: 'http://127.0.0.1:8000/jquery-server', //参数 data: {a:100, b:200}, //请求类型 type: 'GET', //响应体结果 dataType: 'json', //成功的回调 success: function(data){ console.log(data); }, //超时时间 timeout: 2000, //失败的回调 error: function(){ console.log('出错啦!!'); }, //头信息 headers: { c:300, d:400 } });

二，axios 发送请求

Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中，简单的理解就是ajax的封装。

2.1首先要引入axios这个库：

2.2axios 常用语法 axios(config): 通用/最本质的发任意类型请求的方式 axios(url[, config]): 可以只指定 url 发 get 请求 axios.request(config): 等同于 axios(config) axios.get(url[, config]): 发 get 请求 axios.delete(url[, config]): 发 delete 请求 axios.post(url[, data, config]): 发 post 请求 axios.put(url[, data, config]): 发 put 请求 axios.defaults.xxx: 请求的默认全局配置 axios.interceptors.request.use(): 添加请求拦截器 axios.interceptors.response.use(): 添加响应拦截器 axios.create([config]): 创建一个新的 axios(它没有下面的功能) axios.Cancel(): 用于创建取消请求的错误对象 axios.CancelToken(): 用于创建取消请求的 token 对象 axios.isCancel(): 是否是一个取消请求的错误 axios.all(promises): 用于批量执行多个异步请求 axios.spread(): 用来指定接收所有成功数据的回调函数的方法

2.3 axios中的get请求设置的axios的服务：

//GET 请求 axios.get('/axios-server', { //url 参数 params: { id: 100, vip: 7 }, //请求头信息 headers: { name: 'atguigu', age: 20 } //返回一个对象，包含响应体，响应头，等 }).then(function(value) { console.log(value); });

结果： 2.4 axios中的post请求 axios.post(url[, data, config]) 注意：第二个参数为请求体数据举例：

axios.post('/axios-server', { username: 'admin', password: 'admin' }, { //url params: { id: 200, vip: 9 }, //请求头参数 headers: { height: 180, weight: 180, } });

2.5 axios中发任意类型请求的方式

axios({ //请求方法 method : 'POST', //url url: '/axios-server', //url参数 params: { vip:10, level:30 }, //头信息 headers: { a:100, b:200 }, //请求体参数 data: { username: 'admin', password: 'admin' } }).then(function(response){ //响应状态码 console.log(response.status); //响应状态字符串 console.log(response.statusText); //响应头信息 console.log(response.headers); //响应体 console.log(response.data); })

结果：

最新回复(0)

发送请求的方法

一，jQuery中的请求

二 ，axios 发送 请求

二，axios 发送请求