尝试使用Phonegap进行php登录


Trying to make php login work with Phonegap

我知道登录/注册系统要在Phonegap中工作,必须在php中使用aJax。我已经有了一个成功的php登录和注册页面,但我不确定从哪里开始使用jQuery/aJax,也就是我应该把它放在哪里,以及我到底应该放什么。我想知道是否有人知道如何给我指明正确的方向。

jQuery

jQuery是一个基于Javascript的框架。Javascript是一种客户端(浏览器)语言。它在你的设备上运行,不像PHP在服务器上执行。

您需要使用脚本标记将jQuery包含在登录页面的HTML中:

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>

jQuery提供了一种针对文档中任何html元素并对该元素执行某些功能的方法。您可以使用以下语法指定哪个元素:

$(element).doSomething();

您可以选择类别或ID:

<p id="myparagraph">A paragraph of text</p>
<p class="myparagraphclass">A paragraph of text</p>
$('#myparagraph').doSomething();
$('.myparagraphclass').doSomething();

AJAX

AJAX是Javascript引入的一种方法,它允许页面请求另一个url以及该请求的结果。您需要使用AJAX登录Cordova/Phonegap,因为您正在构建的"应用程序"是基于Javascript的。

值得庆幸的是,jQuery提供了一些非常好用的AJAX方法。

把它放在一起

我从前面的一个问题中注意到,您已经创建了一个PHP脚本来检查登录凭据是否正确。警告:mysqli_fetch_array()要求参数1为mysqli_result,在第15行的/public_html/access/login.php中给定null

我对该问题中的代码进行了轻微编辑(/access/login.php):

    require_once($_SERVER['DOCUMENT_ROOT'] . "/html5up-aerial/access/functions.php");
    $username = trim($_POST['username']);
    $password = trim($_POST['password']);
    if ($username&&$password) {
            session_start();
            require_once($_SERVER['DOCUMENT ROOT'] . "db_connect.php");
            mysqli_select_db($db_server, $db_database) or
                                                die("Couldn't find db");
            $username = clean_string($db_server, $username);
            $password = clean_string($db_server, $password);
            $query = "SELECT * FROM users WHERE username='$username'";
            $result = mysqli_query($db_server, $query);
            *if($row = mysqli_fetch_array($result)){*
               $db_username = $row['username'];
               $db_password = $row['password'];
               if($username==$db_username&&salt($password)==$db_password){
                  $_SESSION['username']=$username;
                  $_SESSION['logged']="logged";
                  //header('Location: home.php'); // Have commented this out
                  $message = "YOU ARE NOW LOGGED IN!"; // <- ADDED THIS
               }else{
                   $message = "<h1>Incorrect password!</h1>";
               }
            }else{
                $message = "<h1>That user does not exist!</h1>" . 
                                "Please <a href='index.php'>try again</a>";
            }
            mysqli_free_result($result);
            require_once("db_close.php");
        }else{
            $message = "<h1>Please enter a valid username/password</h1>";
        }
        //header/footer only required if submitting to a seperate page
        echo $message; // ADDED THIS
        die(); // ADDED THIS

这将是AJAX请求的PHP脚本。

现在,我们使用登录表单创建HTML文档,并包含jQuery,并编写我们的ajax代码:

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<form class="login-form" method="post">
  Username: <input name="username" /><br />
  Password: <input name="password" type="password" /><br />
  <input type="submit" value="Login" />
</form>

<script>
    $('.login-form').on('submit', function(e) { // Listen for submit
        e.preventDefault(); // Don't actually submit the form
        var data = $(this); // Put the form in a variable
        $.ajax({
            type: "POST",
            url: '/access/login.php',
            data: $(data).serialize(), // Make form data into correct format
            success: function(response) {
               alert(response); // Alert with the response from /access/login.php
            }
        });  
    });
</script>

要调试此代码,您需要使用Chrome开发工具栏或Firefox Firebug。希望这能有所帮助。