Vue项目之PHP无法获取来自axios的数据

2020/4/24 11:22:15

本文主要是介绍Vue项目之PHP无法获取来自axios的数据,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

问题描述

前两天做Vue项目的时候,本来打算通过php实现登陆和注册功能,结果在使用axios发起请求的时候,php后台接收到的数据$_POST始终为null。在网上浏览了许多篇技术文章,才明白是因为axios请求的数据格式和$_POST能够接收的数据格式不一致。于是我尝试了几种来自网上大神的办法:

解决过程

  • qs(失败)
import qs from "qs"
var axiosAjax = axios.create({
    baseURL:'/',
    transformRequest: [function (data) {
        data = Qs.stringify(data);
        return data;
    }],
    headers:{
        'Content-Type':'application/x-www-form-urlencoded'
    }
})
复制代码
  • php://input(失败)
var params = {
    username: 'admin',
    password: '123456'
}
axios.post('test.php', params).then(res => console.log(res.data))

$data = file_get_contents("php://input");
复制代码
  • URLSearchParams(失败)
var params = new URLSearchParams();
params.append('username', 'admin');
params.append('password', '123456');
axios.post('test.php', params).then(res => console.log(res.data));
复制代码
  • encodeURIComponent(失败)
var params = 'ajax='+encodeURIComponent(JSON.stringify({
    username: 'admin',
    password: '123456'
}));
axios.post('test.php', params).then(res => console.log(res.data))

var_dump(json_decode(urldecode($_POST['ajax'])));
复制代码

最终解决方法

最终尝试了最后一种方法:将请求数据转换为FormData格式,终于解决了这个问题,代码如下:

//js
post () {
      var data = new FormData()
      data.append('username', this.username)
      data.append('password', this.password)
      axios.post('/weather/login.php', data).then(res => {
        console.log(res.data)
      })
}
复制代码
//php
<?php
    //从前端获取登陆信息
    $username = $_POST['username'];
    $password = $_POST['password'];
?>
复制代码

希望能够帮助到你。



这篇关于Vue项目之PHP无法获取来自axios的数据的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程