AngularJS $http传递值到PHP

最新推荐文章于 2021-04-08 11:57:35 发布

平安喜乐_

最新推荐文章于 2021-04-08 11:57:35 发布

阅读量217

点赞数 2

分类专栏：笔记文章标签： PHP AngularJS

本文链接：https://blog.csdn.net/qq_41867060/article/details/89917570

版权

笔记专栏收录该内容

0 篇文章 0 订阅

订阅专栏

AngularJS $http传递值到PHP

- 贴一下代码.

第一次使用AngularJS试着写了一个最简单的登录测试.然后PHP总是获取不到传递过来的值.最后网上找了资料发现是这样一回事.

贴一下代码.

前端界面代码.(测试使用,所以没有样式,就简单的两个输入框和确定按钮.)

// An highlighted block
<html  >
<head>    <meta charset="UTF-8">
<script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp"  ng-controller="customersCtrl" >

    <form>
        <div><input type="text" ng-model="name1"   value="123"></div>
        <div><input type="password" ng-model="password1"   value="123"></div>
        <div><input type="button" ng-click="myform1()" value="登录"></div>
        <div>{{showinfo}}</div>
    </form>
</div>
</body>
</html>

1.当$http使用的是data参数

<script>
    console.log(app);
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function ($scope, $http) {
        $scope.showinfo="";
        $scope.myform1 = function () {
            $http({
                method: 'post',
                url: 'user.php',
                data: {name:$scope.name1,password:$scope.password1},
                headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
            }).success(function (data1) {
                    console.log(data1.result);
                    if(data1.result=="ok"){
                        $scope.showinfo="登录成功";
                        $scope.user = {"name": "", "password": ""};
                    }else {
                        $scope.showinfo="登录失败,请核对用户名密码";
                    }
                }
            );
        }
    });
</script>

此时传递到前端的参数格式为如图所示
加上headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
如果没有加上

headers: { 'Content-Type': 'application/x-www-form-urlencoded' }

传递到前端的参数格式为:
没有加上 headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
此时,加上headers后,PHP端的获取方式可以通过以下方式.

$postData = file_get_contents('php://input', true);
$obj=json_decode($postData);
$name = $obj->name;
$password = $obj->password;
if ($name == 123 && $password == 123){
    echo  json_encode(array('status'=>'0','result'=>'ok'));
}else{
    echo json_encode(array('status'=>'0','result'=>'error'));
}

2.如果使用的是 params参数

<script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function ($scope, $http) {
        $scope.showinfo="";
        $scope.myform1 = function () {
            $http({
                method: 'post',
                url: 'user.php',
                params: {name:$scope.name1,password:$scope.password1},
            }).success(function (data1) {
                    console.log(data1.result);
                    if(data1.result=="ok"){
                        $scope.showinfo="登录成功";
                        $scope.user = {"name": "", "password": ""};
                    }else {
                        $scope.showinfo="登录失败,请核对用户名密码";
                    }
                }
            );
        }
    });
</script>

此时传输参数类型为.
在这里插入图片描述
这时候PHP可以直接使用 $_GET[]方式获取参数.(因为params参数是用于GET请求的.)

$name = $_GET['name'];
$password = $_GET['password'];
if ($name == 123 && $password == 123){
    echo  json_encode(array('status'=>'0','result'=>'ok'));
}else{
    echo json_encode(array('status'=>'0','result'=>'error'));
}