如何使 Phonegap 连接到本地主机

Question

I am working with phonegap for the first time to build hybrid mobile app with back-end(php, mysql). So i am doing a test on how phonegap can connect to php on localhost to send and retrieve data. But no data was retrieved, I have reduced my codes to the this and i see no errors in both ajax call and php code. So i guess it should be the way phonegap connects to backend that i am getting wrong, please help.

html form and ajax call:

        <form id="form1">
       <input  type="text" id="email"  />
         <input  type="password" id="password"  />
         <input type="submit" name="login" id="login" value="Login">  
        </form>

      <script type="text/javascript">
      $("form").submit(function(){
         var data= ("#form1").serialize();
       $.post("http://localhost/securityapp/login.php",data,function(response){
     alert(response);
       });

        });

      </script>

php file:

          <?php
           include 'db.php';
      session_start();
     if ($_POST ) {
     echo $_POST;

        }


           ?>

Basically it is meant to alert to values sent to php script as the response but it is not doing so, network tab says 200 for status. what am i doing wrong? I feel phonegap isn't connecting to the url defined

Answer 1

This is how I solved this issue:

1. created a table on a database that holds the current URL/IP of the server

2. Created a check-url.php file, this file runs a query on the database to see IP/URL of the server

3. I created a connection.js file, this file basically makes a request to a check-url.php to get current IP of the server to use in Cordova app

check-url.php

 header("Access-Control-Allow-Origin: *"); //to allow phonegap access it because of cross origin and domain restrictions
 require 'db.php';
 $query= "SELECT url  FROM settings";
 $query= mysqli_query($conn,$query);
 $row = mysqli_fetch_assoc($query);
 $row= $row['url'];
 echo $row; //current IP exmaple:http://127.0.0.1:80/

connection.js

  //check current server ip from database
export function check_url(callback) {
  var httpRequest = new XMLHttpRequest();
  httpRequest.onreadystatechange = function() {
      if (httpRequest.readyState === 4) { // request is done
          if (httpRequest.status === 200) { // successfully
              callback(httpRequest.responseText); // we're calling our method
          }
      }
  };
  httpRequest.open('GET', "http://127.0.0.1:80/projectname/check-url.php");
  httpRequest.send();
}

So any time I want to connect to backend by Cordova I import the function check-url() from connection.js into my front-end ajax request url like this:

<script type="module">
   import {check-url} from './connection.js';

check-url(function(result) {
var currentIP= result;
$.ajax({
type:"POST",
url: currentIP + "projectapp/login.php",
data:data,
success: function(data){
//do something
}
});
});
</script>  

Note: The URL/IP in connection.js, database, and server IP should be the same, as this helps you not to repeat IP always and also to test when using PhoneGap mobile and also when you switch to live, change it to the current IP address of your project.