REST API with PHP

Hi,
Let's see what we have today. Today we have a legacy story with PHP where it will trigger a REST API call to a different domain. Although this is quite old-school technique, however, I have zero knowledge on web programming.

User Case:

I have a PHP site, with 2 pages. One page is a front-end to show the html report and one back-end page to retrieve data from MariaDB and draw the data into a grid. There is a need to have a better usability to trigger a Jenkins job from this report. So we will trigger Jenkins job via REST API with the appropriate data.

Solution:

Because our Jenkins has disable the anonymous access, so when we call REST API to trigger job we have to add the authentication header to the http request. 

So, I create a list of buttons with some data properties in value field (a dirty solution) then handle the click event of these buttons then parse the value field to build the data properties.

In the back-end php

$btnData = $prop1 . "," . $prop2;

echo "<td><button class='btnCustom' id='" . $item . "' value='" . $btnData . "'>" . $status . "</button></td></tr>";

In the front-end jQuery

$( ".btnCustom" ).click(function() {
    var prop1 = $(this).attr("value").split(",")[0];

    var prop2 = $(this).attr("value").split(",")[1];
    // Do your REST call here
}

A quick and dirty way is to trigger the post request in jQuery, I have found a lot of discussions on this item. This thread has good sources with many working solutions. So I can make my code working as below

$.ajax ({
    type: "POST",
    url: jenkinsUrl,
    dataType: 'json',
    async: false,
    headers: {
        "Authorization": "Basic " + btoa(user + ":" + paswword),
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Headers": "Authorization"
    },
    success: function (){
    }

});

However, this can work only on IE 10 but not on Firefox, Chrome and IE 11 ... Poor me! It turns our, this solution violates CORS because I use javascript to trigger service from other domain, so the server has to return the response with Access-Control-Allow-Headers for my authorization header injection. Another thing is my strip out my user name and password to authenticate into the REST service into my javascript is a stupid pitfall.

Then, what's next? A saviour here show me a way to simply post your properties to a proxy php page then this page will do the curl trigger. This will be a server site call to eliminate all those issues above. More samples to make REST call with PHP here.

So what! The ajax call will be replaced by a post call

$.post("restProxy.php", { "prop1": prop1, "prop2": prop2, dataType: "json"})
.done(function() { // Do something here

});

And create a php proxy page restProxy.php

<?php
$prop1 = urlencode($_POST['prop1']);
$prop2 = urlencode($_POST['prop2']);
$jenkinsUrl = "http://[yoururl]";
$post = 'prop1=' .$prop1 .'&prop2=' .$prop2;

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $jenkinsUrl);    
curl_setopt($ch, CURLOPT_USERPWD, $user . ":" . $password);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); 
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $post);

$response = curl_exec($ch);

?>

Voila! I can get away of those issues above and my task is done! Happy reading and ready for Eastern day!