axios向后台传输数据（要放假了哈哈哈！！！）

既然要放假了。。那就好好学习一下再！！
嗯。。开玩笑，学习的时候怎么会想放假这些乱七八糟的事呢。
一上午终于把数据从前台传递到后台给解决了，学长也说，当时我也没遇到这么麻烦的问题啊。。嗯，不管咋，和学长一起弄明白了一些东西
声明一下，由于网上的总结性文章还是比较多的，所以我就不发纯总结性的了。这篇文章主要是为了记录一下自己解决问题时的思路和心路历程，但是由于学长在附近我不好边解决边写笔记，所以也就导致了笔记中的思路不是特别清晰。。已经无法还原当时迷茫的认识形态了。。所以大家凑合看，希望能通过我混乱的思考方式给你们提供一种解决问题的方法。。虽然文章真的很乱很乱。。。以下是 笔记原文

前台到后台

嗯，参数传不回去。。axios能拉回来东西。。但是怎么把参数。。。

无意间发现开发者工具里头可以看见请求的信息，然后看了看 发现 自己确实把数据发到后台了，后台没接收到好像，

image.png

并且点一次还发了两个post请求，第一个的类型是option

image.png

第二个才是POST 和这个有关系吗？是因为第一次请求是个空的所以没拉到数据吗？？

image.png

学长说不是第一个预请求的事
然后按照网上的改法，改了一下 axios的默认content-type头内容，还用了一下URLSearchParams

系统化整理一下吧，跟学长解决（尝试）了快两个小时

首先是对于axios这个东西，从main.js引入就没管过，傻不拉几直接this.axios.post比着官方文档上的直接用，就发现参数一开始就是传递不过去，用法如下

image.png

然后很高兴得发现诶怎么就是接受不到。。在网上查了一堆办法 包括 content-type，data，params，URLSearchParams，JSON，config等等一堆

axios

首先先说一下对axios的理解吧，之前都不知道这个对象还是啥到底是怎么用的，还有直接axios()直接往里面穿参数的，真的是让人头疼，然后才知道，那种用法在axios官方文档里有提到，直接传入一个config对象吧算是，然后再给config赋值，传入不同的属性，嗯。。反正就是在某种意识形态上对JS对象和axios的用法理解加深了一些，之前用的那种是 调用了axios封装好的post方法，而post方法是在axios的源码里写好了的。然后我去官方文档偷看了一眼，官方文档里也有，真不起眼啊！也没咋看懂那是干啥用的当时。。

URLSeachParams和content-type

从官方文档上看到params和data的参数要求，其中包含了URLSearchParams数据对象。

image.png

一开始不知道是参数不对，用的还一直是post的data参数，按照网上的方法用上了这个对象并且改掉了axios请求的content-type的默认值，然后第一次收到数据的情况就此产生了。回过头想想可能传不过去是因为参数没照上，可是按理说文档上写的清清楚楚data是允许使用plain object或者说是string的，可是只有URLSearchParams能传过去。这个问题最后的怀疑落脚在了content-type上和请求的body体上，具体解决放在了后端

data和params

对于这俩东西一开始是没有一点点概念的。。后来在文档上看到有两种传递参数的属性，一个是data，一个是params，直到我用URL那个对象传成功之后，我才知道我还可以不用data属性传递。学长想试试看get方法会不会有什么不一样，然后找不到怎么给get方法穿参数，由此才发现了通过config对象直接穿进去params参数， 也就终于找到了问题所在。就在这两个参数传递对象身上，这个data和params，网上说data是当作body体传递过去，另一个才是正规的传参数。所以我暂时先不用data传递数据，先直接用axios传config对象，然后method 用 post 再把参数传给params就行了，不用data不用URLSearchParams也可以了，具体的感觉应该再封装一下，之后再研究一下。

最后

参数传到后台的问题算是解决了，可是还是没有解决data是怎么用的。。因为从浏览器的网络请求 里看，除了预请求那一下，用post着实把参数传了出去，可是后台怎么都没接收到，然后就输出看$_REQUEST之类的数组，里面就是接受不到。。有一篇关于content-type的文章，

axios POST提交数据的三种请求方式写法

感觉改来改去的很有道理，可是怎么也没法按照官方文档上的那种传递过去。。哇！好惨。。然后学长给了个file_get_contents('php://input')

终于收到了来自前台的数据，这么这么来说，数据传递过来，但是后台没有把它放在REQUEST里面。。真的是。。心累。。。可能是在发送网络请求的时候，对所谓的post的body体的处理不太对，涉及到的应该也是content-type吧。。下次遇见再说吧！ （隐藏boss？@RequestBody？？）

其他参考

Axios发送请求时params和data的区别

axios 使用post方式传递参数，后端接受不到

https://www.jianshu.com/p/042632dec9fb

嗯 还有官方文档和axios源码