Getting ResponseText without calling servlet using xmlhttprequest in IE(Any version) - javascript

I'm using xmlhttprequest to call servlet. It is working fine in Firefox. But, in IE, only if I click refresh button, it is working(that too sometimes). Otherwise, it is not triggering. Moreover, the response text is displayed without calling the servlet. Is that using Cache or what? I don't have any idea . Help me out please.

MSIE is too eager in caching XHR requests. The only feasible way to get around this is to add a querystring with a timestamp to the XHR URL.
var url = '/url/to/your/servlet?' + new Date().getTime();

Thanks one and all. Actually, I used "GET" instead of "POST" while calling the servlet in javascript. When I tried POST, it is working fine.

To get around IEs over zelous caching of xhr you must get your servlet to add
Cach-Control:max-age=0
to the response headers of all html and .js files served up.
This will cause a revalidate of all files with this response, next time they are requested from IE including XHR. (must-revalidate did not seem to work on xhr loaded java script file, not sure why)
Be sure to clear the IE cache after this is done for it to take effect the next load.
IE will behave nicely with this setting. But dont put this into production of course.

Related

IE8 AJAX error: javascript is not loaded

I have a fairly complicated page built using JSP, JavaScript, jQuery, and css. It works fine in Chrome, Firefox, and IE10. However, it doesn't work in IE8 - JavaScript specific to that particular page doesn't load, the HTML is broken, some css is loaded, but not all.
The page called via an AJAX call:
jQuery.ajax({
url : url,
dataType: "html",
cache : false,
beforeSend : ...
Capturing network activity in Developer tools shows that the relevant script files have started to arrive, but only 155B-157B were received. Result code is 304, time is shown as under 1ms.
Same reporting for Chrome shows that the same JS files are 3-7-12KB in size, took 3-10ms to arrive, with HTTP code 200.
The same page requested via a regular GET request loads normally.
The problem looks like a known aggressive-caching issue in IE8, but somehow setting cache : false doesn't prevent 304 from happening.
How can I make this work?
Using jQuery version 1.4.2, IE8 on Win7. tc Developer server 2.8.2.
One of the JavaScript files being retrieved via the AJAX call contained, among other code, this method:
jQuery(document).ready(function() {
return validate...();
}
IE8 was not able to process it, and discarded all surrounding JavaScript.
I removed the lines above, and moved the validation method to the function that was called on Complete: of that AJAX call, and everything started working.

AJAX not working properly in Firefox

I'm using Firefox 20.0.1 and Apache. I have some AJAX calls to retrieve an HTML document from the server. The strange thing is that in one function an AJAX call works fine, but in another function to get a different document it doesn't work. Also, it does work in Chrome.
Any ideas on what this could be? The code is as follows:
loc = "Temp\folder1\folder2\title.html";
var req = new XMLHttpRequest();
req.open("POST", loc, false);
req.send();
alert(req.responseText); // Displays "object not found" error.
Background Information:
I am writing an EPUB reader. The EPUB file is stored on the server and extracted using PHP. I want to get (for example) chapter 1's content, which is stored in an HTML document in the extracted location.
Solution
The problem was the Firefox has issues with backslashes in URLs.
I simply replaced all backslashes with forward slashes before sending the request.
The "object not found" text is an alias for an HTTP 404 error in some web servers. If you run alert(req.status); after your req.send();, it can provide insight into what may be the problem. In your case, it is in fact showing a 404 error, and can be traced back to the URL having \ characters in it.

Running a JS method once to initiate variable when the chrome extension is loaded once?

I need to load a var by getting JSON from a webservice, so my question is where does this code go? I tried to put it in the content script but XHR would fail there.
Any suggestions?
Starting from Chrome 13 content scripts can also perform XHR requests (before only background pages could). So you can put your code wherever you like.
If it doesn't work then you probably didn't specify domain permissions (or trying to connect to non-80 port, to non-http(s) protocol etc).

how to cancel http request using javascript

i have a page on which there an event handler attached to an onclick event. when the event fires it passes contents of a textbox to a GET request. since the url is not in the same domain so i create a script tag and and attach the url to its source like this
elem.onclick=fire;
function fire()
{
var text=document.getElementById('text').value;
var script=document.createElement("script");
script.className="temp";
script.src="some url"+"?param="+text;
document.body.appendChild(script);
}
now if that event is fired and more than one time i want to cancel all the previous GET request(because they still might be receiving response) and make the GET request with latest text. But for this i need to cancel the previous requests.
i tried
document.body.removeChild(script);
script.src=null;
but this does not work in Firefox(i am using Firefox 5) although this works in Google Chrome.Does anyone know if these requests can be cancelled in Firefox and if yes then how?
UPDATE
As suggested by Alfred, i used window.stop to cancel a request but does not cancel a request but hangs it up. It means that when i look into firebug it looks like the request is being made but there is no response.
The solution is simple: for creating HTTP requests, use <img> instead of <script> element. Also you always have to change the src attribute of the same element.
var img;
function fire()
{
var text = document.getElementById('text').value;
var im = img || (img = new Image());
im.src = "url"+"?param="+text;
}
You may ascertain that it actually works by doing the following: the URL you request should have a huge response time (you can ensure this using e.g. PHP's sleep function). Then, open Net tab in Firebug. If you click the button multiple times, you'll see that all incomplete requests are aborted.
This is entirely shooting from the hip, but if the script tag has not finished loading you can probably simply script.parentElement.removeChild( script ). That is more or less what mootools does anyway. (Technically, they replace /\s+/ with ' ' first, but that does not seem to be terribly important).
Would it be ok for you to use a JS framework? If so, MooTools has this functionality built into its Request.JSONP object
I'm not sure if this is what you're looking for, but it seems like a similar issue:
http://www.velocityreviews.com/forums/t506018-how-to-cancel-http-request-from-javascript.html
To get around the cross-domain issue, you might be able to use CORS instead (assuming you can change what's on the server):
http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/
If you do this, you could then use the more standard XMLHttpRequest's abort() function.
CORS is compatible with all the major modern browsers except Opera (http://caniuse.com/cors).

Dashboard Cross-domain AJAX with jquery

Hey everyone, I'm working on a widget for Apple's Dashboard and I've run into a problem while trying to get data from my server using jquery's ajax function. Here's my javascript code:
$.getJSON("http://example.com/getData.php?act=data",function(json) {
$("#devMessage").html(json.message)
if(json.version != version) {
$("#latestVersion").css("color","red")
}
$("#latestVersion").html(json.version)
})
And the server responds with this json:
{"message":"Hello World","version":"1.0"}
For some reason though, when I run this the fields on the widget don't change. From debugging, I've learned that the widget doesn't even make the request to the server, so it makes me think that Apple has some kind of external URL block in place. I know this can't be true though, because many widgets phone home to check for updates.
Does anyone have any ideas as to what could be wrong?
EDIT: Also, this code works perfectly fine in Safari.
As requested by Luca, here's the PHP and Javascript code that's running right now:
PHP:
echo $_GET["callback"].'({"message":"Hello World","version":"1.0"});';
Javascript:
function showBack(event)
{
var front = document.getElementById("front");
var back = document.getElementById("back");
if (window.widget) {
widget.prepareForTransition("ToBack");
}
front.style.display = "none";
back.style.display = "block";
stopTime();
if (window.widget) {
setTimeout('widget.performTransition();', 0);
}
$.getJSON('http://nakedsteve.com/data/the-button.php?callback=?',function(json) {
$("#devMessage").html(json.message)
if(json.version != version) {
$("#latestVersion").css("color","red")
}
$("#latestVersion").html(json.version)
})
}
In Dashcode click Widget Attributes then Allow Network Access make sure that option is checked. I've built something that simply refused to work, and this was the solution.
Cross-domain Ajax requests ( Using the XMLHttpRequest / ActiveX object ) are not allowed in the current standard, as per the W3C spec:
This specification does not include
the following features which are being
considered for a future version of
this specification:
Cross-site XMLHttpRequest;
However there's 1 technique of doing ajax requests cross-domain, JSONP, by including a script tag on the page, and with a little server configuration.
jQuery supports this, but instead of responding on your server with this
{"message":"Hello World","version":"1.0"}
you'll want to respond with this:
myCallback({"message":"Hello World","version":"1.0"});
myCallback must be the value in the "callback" parameter you passed in the $.getJSON() function. So if I was using PHP, this would work:
echo $_GET["callback"].'({"message":"Hello World","version":"1.0"});';
Apple has some kind of external URL block in place.
In your Info.plist you need to have the key AllowNetworkAccess set to true.
<key>allowNetworkAccess</key>
<true/>
Your code works in Safari because it is not constrained in the dashboard sever and it is not standards complient in that it DOES allow cross site AJAX. FF IS standards complient in that it DOES NOT allow cross site ajax.
If you are creating a dashboard widget, why don't you use the XMLHttpRequest Setup function in the code library of DashCode. Apple built these in so you don't need to install 3rd party JS libraries. I'm not sure about JSON support but perhaps starting here will lead you in a better direction.
So another solution is to create your own server side web service where you can control the CORS of, the users web browser can't access another site, but if you wrap that other site in your own web service (on the same domain) then it does not cause an issue.
Interesting that it works in Safari. As far as I know to do x-domain ajax requests you need to use the jsonp dataType.
http://docs.jquery.com/Ajax/jQuery.getJSON
http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/
Basically you need to add callback=? to your query string and jquery will automatically replace it with the correct method eg:
$.getJSON("http://example.com/getData.php?act=data&callback=?",function(){ ... });
EDIT: put the callback=? bit at the end of the query string just to be safe.

Categories