Transferring data for use in a different website

Question

I am trying to enter non private data into my webpage and then use this data on a totally DIFFERENT website to get a result which I then want to bring back to my webpage. Although is is a free online calculator (WHO tool), the formula is hidden/proprietary otherwise I would just incorporate the formula in my webpage, so I am stuck using their server to do the calculation. My plan is to enter data on my webpage, save this to something like localStorage, then using FireFox, have a Greasemonkey script that will retrieve the data from the Storage, enter it into the calculator and find the result. I am new at all this, and have run into problems because it appears that localStorage/sessionStorage/Cookies will NOT share their data to a different web page domain. I tried localStorage.setItem("age", age.value) and retrieving- could retrieve in the same workspace but not on the new website. I think the issue is security, but I am not concerned if anyone intercepts the data as it will be useless to them.

Here is my simplified code for my webpage (I only included one variable for simplicity and put in the retrieval code which shows that the data is available for local use):

<html>
<head>
<title>Ostoporosis assessment</title>
<script type="text/javascript"> 
function saveData() {
var age = document.getElementById("age");
localStorage.setItem("age", age.value); 
window.open('https://www.shef.ac.uk/FRAX/tool.jsp', '_blank');
}
function clearData() {
  document.getElementById("age").value= "";      
}
function getData() {
var age = localStorage.getItem("age");
document.getElementById("age").value= age;    
}
</script>
</head>
<body>
<p>Age:<input name="age" id="age" type="text" ></p>
<p><input name="Frax" id="Frax" type="button" value="Get Frax" onclick="saveData()"></p>
<p><input name="clearAge" id="clearAge" type="button" value="Clear age" onclick="clearData()"><input name="getAge" id="getAge" type="button" value="Get stored age" onclick="getData()"></p>
<p> Result</p>
<p><input name="result" id="result" type= "textbox"></p>
</body>
</html>

Here is my GreaseMonkey script:

// ==UserScript==
// @name        FraxCalculator
// @namespace   DavidScripts
// @description UK online calculator
// @include     https://www.shef.ac.uk/FRAX/tool*
// @require   http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js
// @version     1
// @grant       none
// ==/UserScript==

window.addEventListener("load",function(){
var age = localStorage.getItem("age");
$('#ContentPlaceHolder1_toolage').val(age);

/*$('#ContentPlaceHolder1_toolage').val(55);
$("#ContentPlaceHolder1_sex1").attr('checked', 'checked');
$('#ContentPlaceHolder1_toolweight').val(60);
$('#ContentPlaceHolder1_ht').val(160);
$('#ContentPlaceHolder1_btnCalculate').click();*/

}, false);

So what I need to do is pass the age from the first webpage to the GM script that runs on the second webpage (I commented out the hard coded GM script which demonstrates that it will work, once I find a way to transfer the information across) and then bring this result back to my webpage. I have not worked out how I will return the result to my webpage, but presume I will be able to use the technique that takes the data to the calculator. Thanks for any guidance.

Answer 1

I solved my issue by attaching the parameters to the URL. The greasemonkey works on the other end and splits off the parameters, then I found a useful piece of code on Stack Overflow that separates each parameter so that it can be used robotically on the destination page and then send the results back using the same technique. Here is a cut down version:

Main code

var c = $('#Height').val();
var d = $('#Weight').val();
if ( $('#previousFractureY').prop('checked') == true) {
var e = 1;
} else e = 0;

window.open('https://www.shef.ac.uk/FRAX/tool.jsp?c='+c+'&d='+d+'&e='+e);
window.close();

<p>Height:<input name="Height" id="Height" type="text" value=160>cm</p>
<p>Weight:<input name="Weight" id="Weight" type="text" value=60>kg</p>
<p>Previous Fracture: No<input value="no" name="previousFracture" id="previousFractureN" type="radio" checked />Yes<input value="yes" name="previousFracture" id="previousFractureY" type="radio" /> <p>

Sample GM code:

// ==UserScript==
// @name        FraxCalculator
// @namespace   Scripts
// @description UK online calculator
// @include     https://www.shef.ac.uk/FRAX/tool*
// @require   http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js
// @version     1
// @grant       none
// ==/UserScript==

window.addEventListener("load",function(){

var QueryString = function () {
  // This function is anonymous, is executed immediately and 
  // the return value is assigned to QueryString!
  var query_string = {};
  var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
        // If first entry with this name
    if (typeof query_string[pair[0]] === "undefined") {
      query_string[pair[0]] = decodeURIComponent(pair[1]);
        // If second entry with this name
    } else if (typeof query_string[pair[0]] === "string") {
  var arr = [ query_string[pair[0]],decodeURIComponent(pair[1]) ];
  query_string[pair[0]] = arr;
    // If third or later entry with this name
    } else {
      query_string[pair[0]].push(decodeURIComponent(pair[1]));
    }
  } 
    return query_string;
}();


$('#ContentPlaceHolder1_toolage').val(QueryString.a);
$("#ContentPlaceHolder1_sex2").attr('checked', true);
$('#ContentPlaceHolder1_btnCalculate').click();

setTimeout(function(){
var result1 = $('#ContentPlaceHolder1_lbrs1').html();
var result2 = $('#ContentPlaceHolder1_lbrs2').html();
    }, 1000);
}, false);

Transferring data for use in a different website

Question

1 answers

solution1
0 2015-10-15 14:29:57

Transferring data for use in a different website

Question

1 answers

solution1 0 2015-10-15 14:29:57

solution1
0 2015-10-15 14:29:57