Perform an HTTP request in the background without

2019-08-28 22:23发布

问题:

So there is this 3rd party website that contains a button that, when clicked, sends a GET request and performs some server-side task which updates the logged in user's data into its database. This desired task has to be performed on every calendar day. Is there an alternative way to making this website's server perform the task without making it load the page for each of the calendar days? The URL attached to that button seems to be using REST API because the button element has href URL which contains a path + arguments. Currently, my solution to making it perform that server-side task for me is to change the URL's argument and open that URL in a new browser tab.

To be more precise the url looks something like this: https://something.com/somepath/47240/6/sort?date=2018-03-06&crumb=JMBuREVDPqS I discovered that simply changing the date argument to the next day and loading that URL in the browser will make this website's servers perform the desired task for the next day too. Is there a way to make it perform this task in the background without loading a separate tab for each day or is manipulating the date argument and opening that updated URL in a separate tab the only solution? Since my current method simply opens up the updated date URLs, it was implemented purely through client-side code. So I would like to know of alternative solutions using client-side code only.

回答1:

  1. Generate array of dates for which you want to call.
  2. Iterate each date, and make a request to the server.
  3. On completion of the request, pick next date and process it.

Following is the sample code, which you can modify according to your case.

  var url="https://something.com/somepath/47240/6/sort?date=";
  var date1 = new Date();
  var date2 = new Date(2018, 1, 1);
  var day;
  var between = [date1];
 //Generate the date array for which you want to run
  while(date2 <= date1) {
      day = date1.getDate()
      date1 = new Date(date1.setDate(--day));  
      between.push(date1);
  }
//Covert date to string format for passing to the request url
function formatDate(date) {
    var d = new Date(date),
        month = '' + (d.getMonth() + 1),
        day = '' + d.getDate(),
        year = d.getFullYear();

    if (month.length < 2) month = '0' + month;
    if (day.length < 2) day = '0' + day;
    return [year, month, day].join('-');
  }

  var callPage = function (dt) {
       return new Promise(function (resolve, reject) {
          var xhr = new XMLHttpRequest();
          var urlWithParam=url+ dt + "&crumb=JMBuREVDPqS";
          xhr.open('GET', urlWithParam, true);
          xhr.onload = function () {
            //Resolve the promise, so that next can be picked
             resolve();
          };

        });
      };
    //Make the call for each date.
    for (var i = 0; i < between.length; i++) {
        callPage(between[i]).then(function () {
      });
    }

If you are facing issue with CROSS DOMAIN request, you can achieve this using hidden iframe like following.

 var url="https://something.com/somepath/47240/6/sort?date=";
  var date1 = new Date();
  var date2 = new Date(2018, 1, 1);
  var day;
  var between = [date1];
 //Generate the date array for which you want to run
  while(date2 <= date1) {
      day = date1.getDate()
      date1 = new Date(date1.setDate(--day));  
      between.push(date1);
  }
//Covert date to string format for passing to the request url
function formatDate(date) {
    var d = new Date(date),
        month = '' + (d.getMonth() + 1),
        day = '' + d.getDate(),
        year = d.getFullYear();

    if (month.length < 2) month = '0' + month;
    if (day.length < 2) day = '0' + day;
    return [year, month, day].join('-');
  }
    
  var callPage = function (dt) {
    
    var iframe = document.createElement('iframe');
    var urlWithParam=url+ formatDate(dt) + "&crumb=JMBuREVDPqS";
    console.log("Request ->",urlWithParam);
    iframe.style.display = 'none';
    iframe.src = encodeURI(urlWithParam);
    document.body.appendChild(iframe);
  }    
    //Make the call for each date.
    for (var i = 0; i < between.length; i++) {
        callPage(between[i]);
    }

Plunk



回答2:

You can do something like this

1) Set interval to call the function once in a day

2) The date has to be dynamically increased after calling the function each day

var dayInMilliseconds = 1000 * 60 * 60 * 24;
var todayDate = new date();
 function formatDate(todayDate ) {
  var d = new Date(date),
    month = '' + (d.getMonth() + 1),
    day = '' + d.getDate(),
    year = d.getFullYear();

 if (month.length < 2) month = '0' + month;
if (day.length < 2) day = '0' + day;

return [year, month, day].join('-');
}
setInterval(function() { 
$.get("https://something.com/somepath/47240/6/sort", 
{"date":formatDate(todayDate),"crumb":"JMBuREVDPqS"},
function(response){
console.log("http request loaded in the background")'
});
 },dayInMilliseconds );


回答3:

Use Ajax

var http = new XMLHttpRequest();
var url = "Put url here";
var params = 'Put Params here'
http.open("POST", [url,params].join('?'), true);