Using HTTPS server with a mobile app

Hi There,

I am doing a project, basically I have a mobile app (for android and ios), which connects through ajax to several webservices that are located in a web server.

Everything is running fine, since I have an HTTP configuration for my web server.

Now, I want to configure my web server as an HTTPS one. As far as I remember, in order to access to an HTTPS server, the client must have a certificate. My question is where and how can I add that certificate to my mobile app, so the execution of he application does not depends if the final user has installed the correct certificate.

If you have any documentation or drop me some ideas that would be great.

Thanks in advance,
Adrian

The client doesn’t need a certificate, only the server does. On the client side you just reference your endpoint with the https. Don’t forget to change your CSP.

Thanks I will check the CSP.

Regards,
Adrian

Good night, I have the same problem. Can I solve it? How do I modify CSP? Sorry for the language

help. I can not establish ajax connection with https.
I have my server with PHP without being able to connect. Thank you

We’re here for AppStudio questions, so we can’t really help with server configuration issues.

Does your php script work if you call it from the Chrome browser URL bar?

What error is returned in the Chrome Console when you do the Ajax() call?

Hello Goodnight. if from the url since Chrome works well it brings me the result.
When running on chrome it works fine, the problem is on android does not connect.

problem is android httpsERROR1 ejemplo del codigo

You need two things… One, you have to set your content security policy or CSP. Your app will not connect to a server using http so without it. Two, your server has to return the header/handshake as the first response. I’m on my iPad right now so I can’t give you code examples but remind me tomorrow and I’ll give you what you need.

Tonny, here’s a pretty good and generic development CSP. This one is setup to use some google code (like google maps) and you’ll have to edit it and change “yourdomain” to whatever your domain is.

<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline' 'unsafe-eval' filesystem: gap: https://*.yourdomain.com/ https://maps.googleapis.com/; style-src 'self' 'unsafe-inline' https://*.googleapis.com/; font-src 'self' https://fonts.gstatic.com/; script-src 'self' 'unsafe-eval' 'unsafe-inline' https://maps.googleapis.com/; img-src 'self' data: https://*.gstatic.com/ https://*.googleapis.com/; connect-src 'self' https://*.yourdomain.com/ ws://localhost:*; media-src 'self';">

As I mentioned before, on the server side, your scripts need to provide the correct response in the header. For ease I’m including a small .php file that I use to simply return the latest version of my app (for when I or a user checks for upgrades).

As before, you’ll need to change yourdomain.com to your domain. In this case I pass in an appid string as Mob1.0 but you can make this anything you want.

<?php

// latest version
$version = "1.0";

// send the content back
header('Access-Control-Allow-Origin: https://www.yourdomain.com');
header('Content-type: application/json');

// see if whomever is calling is authorized to do so
// in the future this will allow us to support different versions
switch( $_POST['appid'] )
{
  case "Mob1.0":
    $options = Array('status' => "OK", 'version' => $version);
    break;
    
  default:
    // return a failed status to the page
    $options = Array('status' => "FAILED", 'text' => "Unauthorized Access Attempt: " .$_POST['appid']);   
}

// return the results to the client
$output = json_encode($options);
// error_log($output);
echo "$output";       // send it to the browser
?>

Lastly, I make the call using the following jquery ajax:

function checkVersion()
{
  // serviceURL is defined as:
  // var serviceURL = "https://www.yourdomain.com/mobile/";
  $.ajax({
      type: 'POST',
      url: serviceURL + 'serGetVersion.php',
      data: "appid=Mob1.0",
      datatype: 'json',
      timeout: 5000,
      cache: false,
      beforeSend: function() {
  	     //Show spinner
   	     $.mobile.loading('show');
      }                  
  }).done(function(data, textStatus, jqXHR) {
        if(data.status == "OK")
        {
            latestVersion = data.version;
        }
  }).fail(function(xhr, textStatus, error) {
      ajaxError(xhr, textStatus, error, 1041);
  }).always(function(jqXHR, textStatus) {
     $.mobile.loading('hide');  
  });
}

Hi Petree, thank you very much for the code. I do some tests and then I inform you.

Hello, you can not connect https. I do not know what I’m doing wrong. from the Chrome browser works, but it does not work from android

In your .js code, are you trapping your errors? What error is it showing?

In your .php code are you logging the incoming variables!

Me aparece este error.
I see this error.

I added the CSP

added code in CONF.XML
Will it be a server configuration problem?

$.mobile functions and attributes are part of jquery.mobile and you’re using NSBasic. Unless @ghenne is a bigger genius than we already think he is, you can’t intermix the two languages.

The content security policy (CSP) is set in the header section of your index.html file. There are other settings for the config.xml file dictating which sites your app can reach.

Wide open settings look like this:

    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
    <access origin="*" />

Lastly, allowCrossDomainPages is an incredibly dangerous thing to do and exposes your app to XSS hacks and will probably prevent it from getting into the app stores.

https://samsistema.ddns.net/Version.php

<?php

// latest version
$version = "1.0";

// send the content back
header('Access-Control-Allow-Origin: https://samsistema.ddns.net');
header('Content-type: application/json');

// see if whomever is calling is authorized to do so
// in the future this will allow us to support different versions
switch( $_POST['appid'] )
{
  case "Mob1.0":
    $options = Array('status' => "OK", 'version' => $version);
    break;
    
  default:
    // return a failed status to the page
    $options = Array('status' => "FAILED", 'text' => "Unauthorized Access Attempt: " .$_POST['appid']);   
}

// return the results to the client
$output = json_encode($options);
// error_log($output);
echo "$output";       // send it to the browser
?>

After this line:

$version = 1.0;

Add these lines:

error_log("contact made!");
error_log("post_vars" .print_r($_POST, true));

Then, go back and check the error_log file on the server and see what, if anything is in it. If “contact made” is in there, then your app hit the server. If nothing is in there then your app calls to the server are not leaving the app.