axios 传递参数的方式(data 与 params 的区别)

2023-09-06 0 909

axios 他们都十分的确切,两个既能用作应用程序或是 服务器端推送http允诺的库。但在其间端初步设计的这时候有的是这时候会很郁闷,因此这儿我来做两个归纳。期望能协助到锦瑟。

模块的传达方式

模块传达通常有三种,一类是 采用 params, 另一类是 data的方式,有许多的这时候他们看见的后端标识符是这种的。

get 允诺

axios({ method: GET, url: xxxxx, params: param, }) 或是axios({ method: GET, url: /xxx?message= + msg, })

post 允诺

axios({ method: POST, url:/xxxxx, data: param, }) 或是 axios({ method: POST, url: /xxxxx, params: param, })

恰当传达

传达模块的解决之道分成post和get,咋们从这儿上看呵呵

post

post 是绝大多数人能弄错的,咋们上看一看。

data 的方式

从范例中骂人,采用的事例标识符是post模块,因此没做任何人的音频文件。

axios 传递参数的方式(data 与 params 的区别)
method: POST, url: /xxxxx, data: param, })

控制台结果

axios 传递参数的方式(data 与 params 的区别)

采用data传达的是两个对象,在控制台中看见的话是 request payload

模块的view sources如下:

axios 传递参数的方式(data 与 params 的区别)

node 后台接收模块的方式

这儿我采用的是koa 来搭建的后台。需要采用 koa-bodyparser 这个插件来解析body 的模块

import Koa from koa; import bodyParser from koa-bodyparser const app = new Koa(); app.use(bodyParser()); app.listen(9020, () => { console.log(the server is listen 9020 port); })

接受方式如下:

axios 传递参数的方式(data 与 params 的区别)

java 后台接收模块的方式

对于 java 来说,本人并不是那么熟悉,但知道的是。如果需要接受axios 以data 传达的模块。需要采用注解 @responseBody 因此采用的是实体类来接收的.

post data 的方式 ,不管是 哪种服务器端的语言,都需要从bo文件上传表单提交

params 的方式

这个是两个对象方式传达的,事例标识符如下:

axios 传递参数的方式(data 与 params 的区别)
axios({ method: POST, url: /xxxxx, params: param, })

浏览器结果分析

axios 传递参数的方式(data 与 params 的区别)

查看view sourcer 如下:

axios 传递参数的方式(data 与 params 的区别)

node 后台接收模块的方式

启动服务和上面一样,但接收模块的方式有点变化

axios 传递参数的方式(data 与 params 的区别)

java 后台接收模块的方式

get 允诺

get 允诺不管采用哪种方式,最后的模块都会放到路径上。

采用param 只是axios帮你把这个模块进行了序列化,因此拼接在 url上面。原因的话,请查看下面

出现三种的原因

遇到这个问题,咋们就需要去看 axios 的源码了.这儿 只会看处理模块的部分。有兴趣的自己去查看源码。

处理data

在axios文件中 的 core/dispatchRequest.js 中,他们能看见 ,axois会 data

axios 传递参数的方式(data 与 params 的区别)

在 axios 的 default.js 中,有两个函数专门转换 data 模块的 。

axios 传递参数的方式(data 与 params 的区别)

注意: 上面只是举例 data 传达模块的一类情况哈!其实data 也有在地址栏 上 拼接的情况,或是 是文件上传的等情况。太多了,这儿 只是讲确切采用的方式。

处理 params

在axios文件中 的 adapt/ xhr.js 中,他们能看见 ,axois会 params的模块放到url路径中。

axios 传递参数的方式(data 与 params 的区别)

buildUrl 一些关键标识符如下 :

axios 传递参数的方式(data 与 params 的区别)

归纳

其实后端和后端 对接模块过程,对于post允诺,data 不行,那就采用 params来 进行 传达,如果都不行,那就可能后端有问题了。

彩蛋

后台测试数据能采用 postman, 如果能传递的模块能调用通过。postman是能看见允诺的标识符的方式的。

axios 传递参数的方式(data 与 params 的区别)

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务