HTTP Post方法不适用于AngularJS + PHP + MySQL

时间:2016-06-20 18:41:31

标签: php mysql angularjs http post

虽然我发现其他主题报告了相同的问题,但它们都没有帮助我。

我正在学习AngularJS,我试图将数据插入MySQL数据库。我有一个非常简单的HTML文件,用户可以在其中提供名称和年龄,然后单击“提交”按钮,将此数据放入MySQL数据库。

由于它仅用于学习目的,我将数据库和表格命名为" test"。

我使用PHP作为服务器语言。 我有:
  - 视图的 index.html 文件
- 一个 script.js 文件,我使用AngularJS HTTP POST方法将数据插入MySQL数据库
- config.php 文件,其中我处理与服务器的连接以及将数据插入数据库。

此外,我的表只包含3列:ID(唯一,自动递增),&#34;名称&#34;(文本)和&#34; age&#34;(int)。< / p>

每个文件的代码都在这里:

的index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>AngularJS-PHP-MySQL</title>
    <!-- AngularJS CDN-->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
    <!-- script.js with implementation of Module and Controller -->
    <script src="script.js" ></script>
  </head>
  <body>

<div ng-app="myApp" ng-controller="formCtrl">
  <form id="myForm" action="" method="post">
    <input type="text" name="name" id="name" value="" placeholder="Name" ng-model="nameModel">
    <input type="text" name="age" id="age" value="" placeholder="Age" ng-model="ageModel">
    <input type="button" name="sub" id="sub" value="Submit" ng-click="insertData()">
  </form>
</div>


  </body>
</html>

的script.js

var app = angular.module('myApp', []);
app.controller('formCtrl', function($scope,$http){
  $scope.insertData = function(){
    $http.post("config.php",{'name': $scope.nameModel, 'age': $scope.ageModel})
        .success(function(data, status, headers, config){
            console.log("inserted Successfully");
        });
    }
});

的config.php

<?php
$servername   = "127.0.0.1";
$username     = "root";
$password     = "";
$Table_name   = "test";

mysql_connect($servername, $username, $password);
mysql_select_db($Table_name) or die(mysql_error());

$name = $_POST['name'];
$age = $_POST['age'];

mysql_query("INSERT INTO $Table_name('name', 'age') VALUES('$name', '$age')");

?>

我收到POST方法成功的警报,但没有将数据插入表中。我不明白为什么,我也没有在网上找到答案。

2 个答案:

答案 0 :(得分:2)

我在another topic here中发现AngularJS和PHP等服务器端语言有不同的序列化和传输方式。就像帖子所说,问题在于PHP本身无法理解AngularJS的传输。

为了避免这种情况,我在inserData()函数中显式构建了头文件:

<强>的script.js

var app = angular.module('myApp', []);
app.controller('formCtrl', function($scope,$http){
  $scope.insertData = function(){
    var request = $http({
            method: "post",
            url: "config.php",
            data: {
                name: $scope.nameModel,
                age: $scope.ageModel,
            },
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    });
  }
}); 

我还将 config.php 文件更改为:

<?php

$servername         = "127.0.0.1";
$username           = "root";
$password           = "";
$dbname             = "test";

$postdata = file_get_contents("php://input");
$request = json_decode($postdata);

$name = $request->name;
$age = $request->age;

$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

$sql = "INSERT INTO test(name, age) VALUES('$name', '$age')";

if ($conn->query($sql) === TRUE) {
    echo "New record created successfully";
}
else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();

?>

现在他们可以传输兼容的数据。我还将连接分配给变量,然后用它来查询我的数据。

HTML保持不变。通过这些更改,现在一切正常。

答案 1 :(得分:0)

我不确定您的PHP / MYSQL代码是否正常。

您可以尝试以下代码吗?

<?php
$servername   = "127.0.0.1";
$username     = "root";
$password     = "";
$Table_name   = "test";

$connection = mysql_connect($servername, $username, $password);
mysql_select_db($Table_name, $connection) or die(mysql_error());

$name = $_POST['name'];
$age = $_POST['age'];

$sqlQuery = "INSERT INTO $Table_name('name', 'age') VALUES('$name', '$age')";
mysql_query($sqlQuery, $connection);
?>
相关问题