I'm using JQuery to fetch information from an URL and display it on my page asynchronously. The URL comes from other domain, so I use JSONP to get the data. That works fine.
However, when the remote URL is down (which happens once in a while) my page hangs as JQuery AJAX doesn't call the 'success' or 'error' functions.
I'm using JQuery 1.7.
My code looks like:
$.ajax({
type : "GET",
url : "http://otherdomain.com/somePage.html",
data : params,
dataType : "jsonp",
jsonp : "jsonp",
success : function (response, textS, xhr) {
alert("ok");
},
error : function (xmlHttpRequest, textStatus, errorThrown) {
alert("not ok " + errorThrown);
}
});
If "somePage" is up, then I see the message "ok". If "somePage" is not reachable, then I don't see anything.
Any ideas on how can I get "error" function get called? Or more importantly, how to detect if the cross-domain URL is reachable?
Is that even possible?
Thanks,
add a timeout
$.ajax({
type : "GET",
url : "http://otherdomain.com/somePage.html",
data : params,
timeout:3000,
dataType : "jsonp",
jsonp : "jsonp",
success : function (response, textS, xhr) {
alert("ok");
},
error : function (xmlHttpRequest, textStatus, errorThrown) {
alert("not ok " + errorThrown);
if(textStatus==='timeout')
alert("request timed out");
}
});
DEMO
Related
Here is my code:
$("input").on('keydown', function(){
$.ajax({
url : '/files/tags_autocomplete.php',
dataType : 'JSON',
success : function (tags) {
$("ul").html(tags.output);
}
});
});
It works as well and all fine. Just sometimes tags_autocomplete.php returns a response after 8sec (which is too much) or sometimes it totally fails and doesn't return a response.
Anyway, I want to make a something went wrong mechanism which should be run 4sec after sending that ajax request. How can I do that?
You can specify a timeout
You can catch error after timeout
$("input").on('keydown', function(){
$.ajax({
url : '/files/tags_autocomplete.php',
dataType : 'JSON',
success : function (tags) {
$("ul").html(tags.output);
},
error : function (jqXHR, textStatus, errorThrown) {
},
timeout: 4000
});
});
Documentation http://api.jquery.com/jQuery.ajax/
I can successfully reach XRMServices on ORGANIZATION_URL/XRMServices/2011/OrganizationData.svc/AccountSet?$select=AccountNumber and retrieve customer account number on a browser after logging in. However, there is an authentication service blocking this if I use AJAX. My code is as below
$.ajax({
type: "GET",
contentType: "application/json; charset=utf-8",
datatype: "json",
url: ORGANIZATION_URL+ "/XRMServices/2011/OrganizationData.svc/AccountSet?$select=AccountNumber,Telephone1,Telephone2,new_CustomerDiscGroup,EMailAddress1,EMailAddress2,EMailAddress3",
beforeSend: function (XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "application/json");
console.log(XMLHttpRequest);
},
complete: function (XmlHttpRequest) {
console.log(XMLHttpRequest);
},
success: function (data, textStatus, XmlHttpRequest) {
console.log(data);
},
error: function (XmlHttpRequest, textStatus, errorThrown) {
console.log(textStatus);
}
});
What am I missing???
Most likely you are doing cross-site scripting error. So you are opening your CRM using for example http://localhost or http://ip_number, and then in your ajax call you are using ORGANIZATION_URL which is probably different (for example http://contosocrm). Make sure that you are calling your ajax request with exactly the same address as you use to access CRM (or the page that is calling ajax)
After a huge pain, here is the answer to logging in to Dynamics CRM using jQuery
$.ajax({
url : 'https://<Your Authentication URL for CRM>/adfs/ls',
data : {
UserName : '<username>',
Password : '<password>',
wa : 'wsignin1.0',
wauth : 'urn:federation:authentication:windows',
wtrealm : '<CRM Location>',
wct : 'YYYY-MM-DDTHH:MM:SSZ'
},
headers : {
Accept: 'image/jpeg, application/x-ms-application, image/gif, application/xaml+xml, image/pjpeg, application/x-ms-xbap,application/vnd.ms-excel, application/vnd.ms-powerpoint, application/msword, */*','Content-Type': 'application/x-www-form-urlencoded','Access-Control-Allow-Origin' : '*'
},
crossDomain: true,
dataType: 'jsonp',
beforeSend : function(xhr){
console.log(xhr);
},
complete : function(xhr){
console.log(xhr);
},
success : function(xhr){
console.log(xhr);
},
error : function(xhr){
console.log(xhr);
}
});
Hope that helps someone
I have some JavaScript that looks like:
$(document).ready(function() {
var csrftoken = getCookie();
$.ajaxSetup({
cache : false,
data : null,
beforeSend : function(xhr, settings) {
if (!csrfSafeMethod(settings.type) && sameOrigin(settings.url)) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
}
});
});
And I have some JavaScript that looks like:
jQuery.ajax({
external : true,
type : "GET",
url : url,
datatype : "json",
async : true,
error : function( jqxhr, textStatus, errorThrown ) {
alert("error");
console.log(url);
console.log(jqxhr);
console.log(textStatus);
console.log(errorThrown);
},
success : function(data) {
if (data.status == "OK") {
// do stuff;
} else {
alert("Error: Google Directions API returned the status code " + data.status);
}
}
});
url is an external url. It asks Google Directions for some directions. If I just go there with my browser I get some nice json.
But if the code above executes I get a 405 and the following message "Origin http://127.0.0.1:8000 is not allowed by Access-Control-Allow-Origin"
I have 'django.middleware.csrf.CsrfViewMiddleware' installed.
I'm doing a lot of Googling to find out how to fix this but so far I can't find the problem.
My question is: How do I get this to work?
I'll keep looking for an answer in the meantime...
Stuff I've tried (in various combinations):
jsonp instead of json
crossDomain: true
I have verified that the line xhr.setRequestHeader("X-CSRFToken", csrftoken); is not called for the offending url
Check your settings file for the correct values, like:
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_WHITELIST = ('127.0.0.1:8000', )
I have got this function:
var current_url=window.location.href;
$.ajax({url: 'http://api.apps.com/html/'+appid,
data: {url:current_url},
dataType: 'jsonp',
timeout: 10000,
jsonp: "set_url_target",
success: function(data) { console.log(data); },
error: function(jqXHR, textStatus, errorThrown) { console.log(errorThrown); console.log(textStatus); }
}).done(function() {
console.log("Message has been complete!!");
});
What I want is to trigger this function on http://api.apps.com/html/ (Note it is a different domain).
function set_url_target(url){
console.log("Url has been recieved: "+url);
}
So far the set_url_target isnt being triggered, and I get nothing being printed to the console, no error or nothing.. why?
if the external application isnt under your control I am afraid you cannot do much as you need to update the response that is sent by the server to the client side to use JSONP successfully..
thus you have two options:
a) make the call on server side in your application and return it to the client
b) alternatively to entirely make it client side you could use something like yahoo pipes or other services which transform the json response to valid jsonp response.
here is an example on how to do it using yahoo pipes: https://gist.github.com/316660
I am not sure about the license, do check upon them and if there are and associated API/Bandwidth costs. Let me know how it works out for you..
Try this, note the jsonp and jsonpCallback attributes
var current_url=window.location.href;
$.ajax({url: 'http://api.apps.com/html/'+appid,
data: {url:current_url},
dataType: 'jsonp',
timeout: 10000,
jsonp : false,
jsonpCallback: "set_url_target",
success: function(data) { console.log(data); },
error: function(jqXHR, textStatus, errorThrown) { console.log(errorThrown); console.log(textStatus); }
}).done(function() {
console.log("Message has been complete!!");
});
For more info on this, AJAX
When i run url of following code in Firefox poster it runs successfully, but when i try to run with help of $.ajax in my js file of mobile app it gives me "ERROR". why?
(order_id is not the issue)...
$('#page_custinfo').bind('submit',function(){
$.ajax({
url: "http://localhost/putDetails.php?order_id=3&fname=seth&lname=rahul&email=ol#gmail.com&s_add1=karveroad&products=nokia&order_status=pending&order_total=1000&city=pune&postal_code=033&country=india",
type: 'GET',
contentType: 'application/x-www-form-urlencoded' ,
success : function (serverResponse) { alert("success"); },
error : function (jqXHR, textStatus, errorThrown) {alert("ERROR"); }
});
});