Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Secure Javascript GET Request

Essentially, I have a custom HTML chart that needs a value from an external secure proxy server. Right now, I am inserting HTML blocks into the relevant areas on the page that include JavaScript to get the correct data through an XHTTP GET request.

It works wonderfully until we restrict access to our proxy server to be limited to our SSL from our C5 site (which is also what we want).

This prevents the chart from getting the correct value because the HTML and the JavaScript get executed on the client side and not through C5.

Essentially, what I need to do (I think) is to move the GET request inside of C5 so that it can pass through with the SSL certificate. I then need to take that value and plug it back into the chart.

Below is some pseudo-code based on the HTML code that I'm currently dropping into the page.

<!-- This is the actual HTML block that I'm creating. -->
<div id="HTMLBlock455" class="HTMLBlock">
<div class="someCustomChart">

<!-- Here's the script currently running that gets the necessary data and calls the proper functions to populate the chart.  -->

<script type="text/javascript">

// Global Var to store updating value 
var amount = 0;

// Open a new HTTP Request)
var xhr = new XMLHttpRequest();
xhr.open("GET", "Some_ElasticSearch Server", true);
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4) {
    if (xhr.status === 200) {
      var person = JSON.parse(xhr.responseText);
      amount = person._source.age; // Grabs the person age
      $('#chart_328').data('updateto', amount); //updates the above HTML data    value
            document.getElementById('chart_328_text').innerHTML = amount + '%';
    } else {
      console.error(xhr.statusText);
   }
  }
};
xhr.onerror = function (e) {
 console.error(xhr.statusText);
};
xhr.send(null);

// This function executes on page load and prepares the chart!
$(document).ready(function() {
   ....
}
like image 700
SethGoodluck Avatar asked Nov 23 '15 15:11

SethGoodluck


1 Answers

You could do an Ajax request to another domain or protocol just enabling CORS in the backend you want to reach.

Another option but I don't know if this is available in C5 is to create a proxy pass request. C5 in this case will do as a proxy with your request. Then the flow is:

Ajax request to your C5 -> C5 proxies the request to the external resource -> C5 sends you back the result

I prefer the approach of CORS but take into account that the legacy browsers could not be 100% compatible. See the reference: http://caniuse.com/#feat=cors

like image 87
David Vega Avatar answered Nov 11 '22 07:11

David Vega