简体   繁体   English

Ajax / JSON请求到php处理页面

[英]Ajax/JSON request to php processing page

I am creating a phone app using html5, ajax, JSON and php for my university degree. 我正在为我的大学学位使用html5,ajax,JSON和php创建一个手机应用程序。 This app has to communicate with a mysql database so ajax Json is being used to communicate with the php file that then processes the queries to the database. 此应用程序必须与mysql数据库通信,因此ajax Json用于与php文件通信,然后php文件将查询处理到数据库。 This will then be packaged using the phonegap cloud service. 然后使用phonegap云服务打包。

The login page uses a form to get username and password, jQuery and JSON then passes that to the login.php via a script on the login page. 登录页面使用表单来获取用户名和密码,然后jQuery和JSON通过登录页面上的脚本将其传递给login.php。 I can get the jQueryworking to a degree, but once I do the SQL query on the php file the login seems to hang. 我可以在一定程度上获得jQueryworking,但是一旦我在php文件上执行SQL查询,登录似乎就会挂起。 I have tested the php process a number of times by manually putting the input variable in the php and running the page in a browser which works fine. 我已经通过手动将输入变量放在php中并在浏览器中运行页面来测试php进程很多次。 You can see the login at mobile app login . 您可以在移动应用登录时看到登录信息

I am presently using $.getJSON to send variables from the input form but would prefer to use a post but cannot quite figure that out. 我目前正在使用$ .getJSON从输入表单发送变量,但更喜欢使用一个帖子,但不能完全解决这个问题。 also unlike using form action post where i can then use echo outs to ensure the php is doing its job i cant find how to allow me to use a similar way to check my php process because of using jquery/JSON, any guidance would be appreciated. 也不像使用表单动作帖子,然后我可以使用回声输出,以确保PHP正在做它的工作我不能找到如何允许我使用类似的方式来检查我的PHP进程因为使用jquery / JSON,任何指导将不胜感激。

Following are my scripts, I have been trying to get this to work for 3 days now and just can't seem to get this to work even though I have tried many different scripts found on many forums, any help would be greatly appreciated 以下是我的脚本,我一直试图让这个工作3天现在,即使我已经尝试了很多不同的脚本在许多论坛上发现,但似乎无法让它工作,任何帮助将不胜感激

jquery/JSON script************************ jquery / JSON脚本************************

$(document).ready(function() {

    $("#submit").click(function()   {

    if($("#childs_name").val()=="" || $("#password").val()=="") {

    $("#add_err").html("Please enter childsname and password");

        return false;   

    }else{


    $("#add_err").html('<img src="images/ajax-loader.gif" width="16" height="16" alt=""/>');
    var childsname=$("#childs_name").val();
    var password=$("#password").val();

        $.getJSON("includes/login.php",{username:childsname,password:password},function(json)   {
//Parse JSON data if json.response.error = 1 then login successfull
                        if(json.response.error == "1")
                        {
                            $("#add_err").html( "Welcome "+childsname+"");
//login successfull, write code to Show next page here                          
                            window.location= "menu.html";                           

                        }else

                        if(json.response.error == "2")
                        {
                            $("#add_err").html( "Details do not exsist in Database. Please contact the School");
                        }
        });//get json
    }   



});//submit click
});//doc ready

PHP ******************************** PHP ********************************

//include_once 'db_connect.php';

if(!isset($_GET['submit'])) {

//check if childsname is empty  
    if(empty($_GET['childsname'])) {

        echo '{"responce":{"error": "1"}}';


    }else{
        $childs_name = $_GET['childsname'];
        echo '{"responce":{"error": "0"}}';
    }//end of chidsname

//check if password is empty    
    if(empty($_GET['password'])) {

        echo '{"responce":{"error": "1"}}';


    }else{
        $password = $_GET['password'];
        echo '{"responce":{"error": "0"}}';
    }//end of password


//query database
$query = "SELECT * FROM app Where child_name = '$childs_name'";
$results = mysqli_query($mysqli, $query);   

// Loop through results
//    if($result->num_rows >= 1){    
//      $row = $result->fetch_array(MYSQLI_ASSOC);  
//          if ($row['childs_name'] = '$childs_name'){
//  
while ($row = mysqli_fetch_array($results, MYSQLI_BOTH)){

    if($_GET['childsname'] == $row['child_name'])   {   
            echo '{"responce":{"error": "1"}}';
//           header("Location: ../menu.html");
             }else{

                echo '{"responce":{"error": "2"}}';

             }
    }




//**************************************************************submit      
  echo '{"response":{"error": "1"}}';
}
else
{
  echo '{"response":{"error": "0"}}';
}

MY FORM HTML ******************************* 我的表格HTML *******************************

<body class="body">

<div id="logo"></div>
<div class="loginForm">

  <form id="login" name="login" method="post" action="includes/login.php">
    <input name="childs_name" type="text" id="childs_name" form="login" placeholder="Childs Name">
    <input name="password" type="password" id="password" form="login" placeholder="Password">
<input name="submit" class="submit" type="button" id="submit" formaction=""value="Submit">
  <input name="reset" type="reset" id="reset" form="login" value="Reset">
  <div id ="add_err" class="add_err"></div>  
  </form>  
</div>
<div class="l-a"></div>
<div class="tagLine">Little minds with big ideas</div>


</body><!--body-->
</html>

jQuery and JSON are new to me so I expect that my code is suspect and I'm missing something simple, I also hope I have given enough information for help to be given, and just in case there are those who think I have put too much code in then I just wanted to give as much info as I think would be needed jQuery和JSON对我来说是新的,所以我希望我的代码是可疑的,我错过了一些简单的东西,我也希望我已经提供了足够的信息来提供帮助,以防万一有些人认为我已经把它放了那么多代码我只想提供我认为需要的信息

First of all update your php file: 1. Uncomment 首先更新你的php文件:1。取消注释

//include_once 'db_connect.php';
  1. After this line add this one: 在此行之后添加以下内容:

     header('Content-Type: application/json'); //this one will tell the server to send a json object back to client (by default it sends text/html) 
  2. Do not use echo 'something';. 不要使用echo'thing'; Instead get your result in a $result variable as this: 而是将结果输入$ result变量,如下所示:

     $result = array ( 'response' => array('status'=>'error', 'message' => 'password is missing')); //this is just an example for the missing password line 

At the end of script use this: 在脚本结束时使用此:

echo json_encode($result);
exit();

PS Replace 'responce' in your php script with 'response'. PS用'响应'替换你的php脚本中的'responce'。

This is how your PHP file should look: 这就是你的PHP文件的外观:

<?php
include_once 'db_connect.php';
//Start the session if is not started it
//You need it to store here the user's name when he successfully logs in
if (!isset(session_id())) {
    session_start();
}
header("Content-Type: application/json");   //this will tell the browser to send a json object back to client not text/html (as default)
// This function will convert your variable (array) into a JSON object
function result($var){
    echo json_encode($var);
    exit();
}
if(!isset($_GET['submit'])) {

    //check if childsname is empty  
    if(empty($_GET['childsname'])) {
        $response = array('result'=>'fail', 'message' => 'missing childsname');
        result($response);
    }else{
        //Always escape your variables before using them in a database
        //I assumed $mysqli is your database connector
        $childs_name = mysqli_real_escape_string($mysqli, $_GET['childsname']);
    }

    //check if password is empty    
    if(empty($_GET['password'])) {
        $response = array('result'=>'fail', 'message' => 'missing password');
        result($response);
    }else{
        //Always escape your variables before using them in a database
        $password = mysqli_real_escape_string($mysqli, $_GET['password']);
    }


// Query database
$query = "SELECT * FROM app WHERE `child_name` = '$childs_name'";   // You also need to add:    AND `password_column_name` = '$password' LIMIT 1
$results = mysqli_query($mysqli, $query);
// Check if SQL query had erors   
if (!$results){
        $response = array('result'=>'fail', 'message' => 'sql error: ' . mysqli_error($mysqli));
        result($response);
}
// If query was successfull and there are rows do this:
if (mysqli_num_rows($results)>0){ 
    $_SESSION['username'] = $childs_name;
    //You may use this variable to check if the user is logged in like this:
    /*
    if (isset($_SESSION['username'])) {
        // user is logged in
        // do something here
    }
    */
    $response = array('result'=>'success', 'message' => 'user is authenticated'));
    result($response);
} else {
    $response = array('result'=>'fail', 'message' => 'user authentication failed');
    result($response);
}
?>

Replace in your JavaScript code the getJSON section with this one 在JavaScript代码中将getJSON部分替换为此部分

$.getJSON("includes/login.php",{username:childsname,password:password},function(json)   {
    if(json.result === "success") {
        $("#add_err").html( "Welcome "+childsname+"!");
        //you should redirect to a php page, not a html one AND  on that page you should have a session started ( session_start();   )
        // and there you should check if :
        /*
        if (isset($_SESSION['username'])) {
            // user is logged in
            // do something here
        } else {
            //redirect the user back on this page(login_page)
        }
        */
        //wait two seconds before redirect, otherwise you say 'Welcome kiddo' for nothing because no one will ever see it :)
        setTimeout(function(){
              window.location= "menu.html"; 
        },2000);                          

    }else{
        $("#add_err").html(json.message);
    }
});

Later update to explain the $response array in php: 稍后更新解释php中的$ response数组:

//$response here is an PHP array with the following structure
$response = array('result'=>'fail', 
                  'message' => 'missing password');

When you call 你打电话的时候

result($response); 结果($响应);

This array is converted in a JSON object with the following structure: 此数组在JSON对象中转换,具有以下结构:

{
     "response":"fail",
     "message": "missing password"
}

Because the last instruction in result() function is exit(); 因为result()函数中的最后一条指令是exit(); the script execution ends and the result is passed back to the client, in your getJSON function. 脚本执行结束,结果在getJSON函数中传递回客户端。

Not sure if it can be calssified as answer, but I'd like to give you some hints and comment might be too long. 不确定它是否可以作为答案,但我想给你一些提示,评论可能太长。

1) Use post instead of get. 1)使用post而不是get。 It is pretty similiar and there are nice examples in docs: https://api.jquery.com/jquery.post/ 它非常类似,在文档中有很好的例子: https//api.jquery.com/jquery.post/

Example: Post to the test.php page and get content which has been returned in json format ("John","time"=>"2pm")); 示例:发布到test.php页面并获取以json格式返回的内容(“John”,“time”=>“2pm”)); ?>). ?>)。

$.post( "test.php", { func: "getNameAndTime" }, function( data ) {
console.log( data.name ); // John
console.log( data.time ); // 2pm
}, "json");

2) How to debug? 2)如何调试? If you cant check server response directly, you can put some file logging on php side to get what is going on there. 如果你无法直接检查服务器响应,你可以在php端放一些文件记录来获取那里发生的事情。

3) In your php code you echo 'respon c e' instead of 'response' 3)在你的PHP代码,你回声“responçE”而不是“响应”

This may not be a direct solution to your problem, but I hope it will help a little. 这可能不是您问题的直接解决方案,但我希望它会有所帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM