Issue with Chrome calling cross domain jsonp resource via jQuery ajax - google-chrome

solved - it was Adblock Plus
I have a cross-domain OAuth scenario where I'm calling OAuth protected jsonp resources on a 3rd party api directly from JavaScript.
The client relies on my server (the site of origin) to generate signed request urls for OAuth resources on the provider. The client GETs these OAuth resources directly in an attempt to limit OAuth proxy duties of my server to simply generating signed resource urls and letting JS do the rest. Here's the JS:
myNamespace = {
callApi: function(signedRequest, callback) {
$.ajax({
url: signedRequest,
dataType: "jsonp",
type: "GET",
crossDomain: true,
jsonp: false,
jsonpCallback: callback,
cache: true,
async: true
});
},
usersCallback: function(jsonp) {
alert(jsonp);
},
getOAuthResource: function(resource, callback) {
$.ajax({
url: "/GetSignedRequest?resource=" + encodeURIComponent(resource + "&callback=" + callback),
success: function (signedRequest) {
myNamespace.callApi(signedRequest, callback);
}
});
}
}
Because the parameter order matters when signing the request, I include the callback manually so that it gets ordered & included in the signed request the server generates.
So an example usage would be simply,
myNamespace.getOAuthResource("/users?id=1", "myNamespace.usersCallback");
This is working in FireFox 20 and IE 10 - I get the alert msg & the expected json from the provider.
Chrome 26 refuses to perform the cross-domain call to the provider. In dev tools, the GET for the cross-domain resource immediately shows a Status of "(failed)" and the GET shows up in the console as an error.
If I subsequently ask Chrome to open this supposedly "failed" URL in a new window, it re-requests the URL directly on the provider and I get the expected jsonp response:
myNamespace.usersCallback({...})
Why won't Chrome perform the cross-domain call?

Related

RESTful service do not response with ajax call using localhost

From my work gave me a project to finish with which I am having the following problem:
In solution there is web API and RESTful API in MVC
if I call directly Restful service it's responding
if i make a test and put in home controller in web API HttpWebResponse it is responding
but the request is put in .js file and the code is
return $.ajax({
type: 'GET',
url: serviceURL,
contentType: "application/json; charset=utf-8",
dataType: "json",
data: urlParams,
crossDomain: true,
beforeSend: lazy(),
complete: complete()
});
and this is failing with the following message e requested resource does not support http method 'OPTIONS
in webconfig everything is settled correctly
It is not working if I call REST API locally, if I call those which is on server it is working.
I read almost everything connected to that problem, but I am still stuck.

Access Heroku MongoLab database from Rails application

My Rails application is accessing MongoLab DB that has data loaded to it.
I am making a AJAX request to my DB. Here is the code:
$.ajax({
type: "GET",
url: "mongodb://heroku_rgkq33fl:kbi2jctr39ts8gicrrchjuso5s#ds061954.mongolab.com:61954/heroku_rgkq33fl",
success: function(data){
console.log("Success 1234");
console.log(data);
},
error: function(data)
{
console.log("Error");
}
})
}
I am not able to make a AJAX request because of the following error:
XMLHttpRequest cannot load mongodb://heroku_rgkq33fl:kbi2jctr39ts8gicrrchjuso5s#ds061954.mongolab.com:61954/heroku_rgkq33fl. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
Can someone please help me on how to get the data from my DataBase to my html page.

JSON works Locally but not with Servers

Here is my little first project as practice, having real trouble figuring out how to use JSON, took me a while to get it work locally but still no luck with servers, and tried few a including one i hosted, and even tried it with other hosted json files.
http://jsfiddle.net/Atlas_/Mgyc5/1/
$.ajax({
dataType: "json",
async: false,
url: "package.json", //https://www.dropbox.com/s/fmw63i4v7dtnx6t/package.json
'success': function (json) {
theQuiz = json.quiz;
console.log(json);
console.log(theQuiz);
}
});
When you access another domain be carefully with "Crossdomain".
To use with dropbox, try changing the URL to:
https://dl.dropboxusercontent.com/s/fmw63i4v7dtnx6t/package.json
Your code will be like this:
$.ajax({
dataType: "json",
async: false,
url: "https://dl.dropboxusercontent.com/s/fmw63i4v7dtnx6t/package.json",
success: function (json) {
theQuiz = json.quiz;
console.log(json);
console.log(theQuiz);
}
});
When you request 'dl.dropboxusercontent.com', you have this:
Access-Control-Allow-Origin: *
https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS?redirectlocale=en-US&redirectslug=HTTP_access_control
"In this case, the server responds with a Access-Control-Allow-Origin:
* which means that the resource can be accessed by any domain in a cross-site manner."
Another options: Some websites (twitter, for example) work with "jsonp". http://en.wikipedia.org/wiki/JSONP or ..you can create your own proxy.

How to Enable ajax request caching for semi dynamic data (ie JSON)?

I have to cache json data for my phonegap applicaiton for 10 minutes how to do that?
server response is already with the expiry headers.
Cache-Control: max-age=315360000
Expires: Sun, 12 Sep 2038 20:15:20 GMT
BUT jquery ajax request is not being cached.
[a] Sometimes we need to enable and disable ajax request caching for browsers. can be done via below flag. cache: true
if set to true ajax request will start caching depending upon the content deposition header.
if set to false a unique timestamp will be appended to request so
that request is never cached.
http://www.exp.com/api/get_posts/?count=12&page=1&_=1381305201264
code:
global_xhrAbort = $.ajax({
cache: true,
type: "GET",
timeout: 30000,
async: false,
url: finalurl,
data: null,
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
dataType: "json",
complete: function () {
},
success: function (data) {
console.log('picked from server koimoi: success');
Page_topstoriesJson = GetJSONifNeeded(data); ;
HTMLSTORAGE_SET('landingpage', GetJSONstringfyifNeeded(data)); //will expire in ten mintues
doChangesForMainandTopStoriesSlider();
HideLoading();
}
,
error: function (errmsg) {
alert_dialog('Request failed. Please check your internet connection or Press Refresh Button.',true);
console.log('index_devicreReadyError: ' + errmsg);
}
});
Jquery AJAX cache documentation : (default: true, false for dataType 'script' and 'jsonp')
Type: Boolean
If set to false, it will force requested pages not to be cached by the browser. Note: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters. The parameter is not needed for other types of requests, except in IE8 when a POST is made to a URL that has already been requested by a GET.
[b] Remember: Ctrl+R on chrome always loads new data from server, even if its cached. Open page in new window to see the results while testing.

Cross Domain request withCredentials not working

I'm developing an authentication website that authenticate data from a web service. My website is running locally and the web service is running on different domain ex: test.abc.com. if authentication is success then store the response in cookies.
if the data is available in cookies and not expired then in the second call do not ask for authentication but need to validate the user from back end. For that i am using below code.
$.ajax({
url:"https://test.abc.com/test/DummyTest",
method:"GET",
dataType:"json",
beforeSend: function(xhr){
xhr.withCredentials = true;
},
success:function(data){
alert(Success);
},
error:function(xhr,err){
alert("Error");
});
I am using jquery1.6
I have checked the browser Options and the cookies are stored with my localhost ip(160.225.230.50) address. but the web service is in different domain(abc.com). while accessing the second time, I got Error response.
Please help out me on this.
For this to work your auth page should send Access-Control-Allow-Origin and Access-Control-Allow-Credentials headers.
When using Access-Control-Allow-Credentials: true you cannot set Access-Control-Allow-Origin to wildcard, but need to specify origin: Access-Control-Allow-Origin: https://abc.com
Also, there is a simpler way to set xhr fields:
$.ajax({
xhrFields: {
withCredentials: true
},
type: 'POST',
url: ...
});