How can I stop caching when using AJAX to read a file? - javascript

I'm currently building a website that uses AJAX to dynamically update sections of the page without the need to refresh, however, when I change aspects of the file that AJAX reads the website sometimes takes minutes to update even though the file is read about once per second. Whilst looking for the issue I found that I can turn caching off by using the developer tools and this then allowed the website to update at the appropriate speed.
Here's the code I am using:
var path = "Path of the json file i am reading"
var state;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
state = JSON.parse(this.responseText);
}
};
xhttp.open("GET", path, true);
xhttp.send();
I've been looking for a while now and the only advice I can see about what to do about the cache is to use the developer tools to turn it off. Is there any way I can implement some code to automatically tell the browser to not cache the file being read?

Related

Difference between Electron-based XMLHttpRequest and browser-based URL with query string?

I'm working on an Electron app and trying to integrate the Easy Digital Downloads Software Licensing WordPress plugin. I haven't done much with HTTP communication in Electron/Javascript so this may be a naive question.
The problem: I am able to get a license activation response from my EDD server and while there is no specific error, for some reason a license is not activated. The odd thing is that if I use a URL and query string in a browser with the same data, the plugin responds as expected: I can activate, deactivate and check the status of a license.
So EDD seems to be working and there are no errors with Electron. But something is missing. Initially I was using the net Electron module but after this issue came up, I switched to using the example script from EDD (below) which uses XMLHttpRequest. With that I get the following response back:
{"success":true,"license":"valid","item_id":539,"item_name":"My
Awesome App","license_limit":1,"site_count":0,"expires":"2020-12-19
23:59:59","activations_left":1,"checksum":"f2d66c6844b37d1fa931b813c408",
"payment_id":248,"customer_name":"Marvin
Gardens","customer_email":"marvin#home.com","price_id":false}
Which is fine except that "activations_left":1 never changes and it should given "license_limit":1. So something is wrong.
On the other hand, if I use a URL with a query string in a browser, the "activations_left" is decremented and license activation only works once (as it should). For example, this works:
http://YOURSITE.com/?edd_action=activate_license&item_id=8&license=cc22c1ec86304b36883440e2e84cddff&url=http://licensedsite.com
My Question: is there some fundamental difference between these two methods? Is there something I need to add to my XMLHttpRequest? I have a support ticket open with EDD but I need to keep moving with this. And sorry to be so long-winded!
UPDATE:
#aw04 suggested I try using GET – just tried that and I "get" the same response as before: no error but also no activation.
Could there be some property which should (or shouldn't) be in the Electron request which is (or isn't) in a browser request by default?
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
console.log('xhttp.responseText', xhttp.responseText);
}
}
var url = "http://YOURSITE.com/?edd_action=activate_license&item_id=8&license=cc22c1ec86304b36883440e2e84cddff"
xhttp.open("GET", url);
xhttp.send();
var xhttp = new XMLHttpRequest();
var postUrl = 'http://<domain.com>/edd-sl/';
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
console.log(xhttp.responseText);
}
}
var data = {
edd_action: 'check_license',
license: '<license key>',
item_name: encodeURIComponent('<item name>'),
};
xhttp.open("POST", postUrl, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.setRequestHeader("Access-Control-Allow-Origin", "http://local.dev");
var values = '';
for (var key in data){
values += key + '=' + data[ key ] + '&';
}
values = values.substring(0, values.length - 1);
xhttp.send(values);
Based on some help from Easy Digital Downloads support folks, this is resolved.
The issue had to do with a property in their Software Licensing plugin setup: "Do not check URL". I hadn't enabled that with the result that my API call from Electron failed and the one using a browser succeeded because the browser was adding headers that Electron was not.
After enabling "Do not check URL", calls from within Electron work. I guess there is also an option to pass in a URL, but since I am using EDD for licensing desktop software, that didn't seem like a needed option.
Anyway, hope this helps someone.

How to get text data from webpage

I am trying to get data form a website about institution using XMLHttpRequest but rather than data I am getting error page please help
My code:-
var url = '[https://tsecet.nic.in/institute_details.aspx?iCode=JNTH][3]';
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// Typical action to be performed when the document is ready:
document.write( this.responseText);
}
}
xhttp.open("GET", url , true);
xhttp.send();
Target Web Page Address:-
https://tsecet.nic.in/institute_details.aspx?iCode=JNTH
If I try to open
https://tsecet.nic.in/Default.aspx>>then click on >>
institute profile >> then click on>>JNTH
Then I am able to get data in browser Else I am redirected to an error page
Please help me...
Note
I am trying to get this data from a different website and a different
domain This website is scripted in aspx
The AJAX request you're trying to run can't do that, as the pages have the X-XSS-Protection: 1 header, blocking such requests. It looks as if they allow the internals URIs to launch only within a "frame" set by the homepage. Unfortunately, I can't tell for sure. In short, you are going to need another approach.

javascript change xml file on the server

I'm making a Design Studio custom component in Eclipse. I created a property 'backgroundColor' in my contribution.xml file. I can call this xml file inside my javascript and adjust it locally, but is there a way I can upload these changes to the server xml file again? Cause at the moment my alerts return all the new data but on the server side nothing happens.
Code that i have:
Contribution.xml:
<property
id="backgroundColor"
title="BackgroundColor"
type="Color"
group="Display"
visible="true"
bindable="true"/>
component.js:
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET", "serverpath/contribution.xml", true);
xhttp.send();
function myFunction(xml) {
xml.responseXML.getElementsByTagName('property')[0].setAttribute("visible",false);
//this returns BackgroundColor so the call does work
alert(xml.responseXML.getElementsByTagName('property')[0].getAttribute("title"));
}
You will need to make some server side coding to do that. You could achieve that by making simple rest api. But otherwise without any server side coding you cant do that. You are now getting data with GET request to server which means you cant do any modifications, you simply get any server response data.

Get Last-Modified date of a file using JS XMLHttpRequest() on IOS

Here is my problem.
I'm developing an webapp, written in Angular and NOT jQuery, for a client that need to have its database refreshed every week with new sets of data. So they chose to use SQLite3 because they can drop the new DB into a folder and the sales rep can download this DB file every Monday. But there are a series of data that gets cached on localStorage and those data need to be refreshed as soon as the iPad checks the DB file and returns true if is a new file. So, I'm using XMLHttpRequest() to check the head for the "Last-Modified" date and it works perfect on Chrome and Safari, but once I build the app and move to iPad, the Last-Modified date return null. I searched everywhere in the web to try find what could be wrong, but I just could not find any satisfactory answer:
The code I'm using is
var dbPath = "db/myDb.sqlite";
var getMTime = function(url, callback) {
var xhr = new XMLHttpRequest();
xhr.open('HEAD', dbPath, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var mtime = new Date(xhr.getResponseHeader('Last-Modified'));
if (mtime.toString() === 'Invalid Date') {
callback(); // dont want to return a bad date
} else {
callback(mtime);
}
}
}
xhr.send();
};
Thanks in advance for the help
UPDATE
Looks like the IOS WebView wipes the HEAD object response... So, thats why by running xhr.getResponseHeader I get empty object, but I would love to know if there is an alternative for that and why this object is being wiped...

Javascript : Different behavior when run on machine and local server

Because my title is too short, I will explain more clearer. I have create a code in JavaScript . And I have two options to run :
1) Run on machine : simple click into html file.
2) Run on local server : mean I start Apache, and start this html file in localhost.
( http://localhost:85/Javascript/index.html for example)
When I choose solution 1, no thing happen. And when I choose solution 2, happen as I wish. But I don't know why.
Here is my code. Purpose : take a json file and process it.
<script>
window.onload = function(){
var url = "http://localhost:85/javascript/json1.json"; // problem here
var request = new XMLHttpRequest();
request.open("GET", url);
request.onload = function(){
if (request.status == 200){
update(request.responseText);
}
}
request.send(null);
};
function update(responseText){ // some code here }
</script>
You cannot use AJAX to read content from a different domain.
Javascript running from file://whatever cannot read localhost:85.
Did you replace this line with the server's original path?
var url = "http://localhost:85/javascript/json1.json";
With
var url = "http://10.0.0.X:85/javascript/json1.json"; // Did you change the right path?
And make sure, the page is not called with the file:// protocol!

Categories