Googlemaps Api v3 getJson not working in IE - api

I have the following problem: I am trying to get data from the googlemaps api v3 via ajax with the code below. It works fine in Chrome and Firefox, but not in IE. What am I doing wrong?
var lat;
$.ajax({
url: "url",
cache: false,
dataType: "json",
success: function(data) {
lat = data.results[0].geometry.location.lat;
}
});

Add the following error event to your Ajax call
success: function(data) {
lat = data.results[0].geometry.location.lat;
},
error: function(xhr, status, error) {
alert(status);
}
And let us know what error message you get in IE, if any at all.
EDIT - Sounds like you are trying to do a cross-domain request?
If that is the case, try setting $.support.cors = true; before your ajax request.
Fetched from http://api.jquery.com/jQuery.support/
To enable cross-domain requests in environments that do not support cors yet but
do allow cross-domain XHR requests (windows gadget, etc), set
$.support.cors = true;
EDIT2 - Ill assume you are running IE9, in that case you need a plugin for jQuery found here:
https://github.com/jaubourg/ajaxHooks/blob/master/src/xdr.js
Also see this answer on SO for more details on why a plugin is needed for IE9 (with cors): IE9 jQuery AJAX with CORS returns "Access is denied"
EDIT3 - Download jQuery.XDomainRequest.js and include it before your AJAX call.

Related

Shopify API Cross Domain Ajax Request

I am using the below code to get the customer details from shopify. I have redirected my domain to the other domain from the shopify admin.
function setEmailWithLoggedInUser(callback) {
$.ajax({
url: 'https://new-website-shopify.myshopify.com/admin/customers/'+__st.cid+'.json',
crossDomain: true,
beforeSend: function(xhr) {
xhr.setRequestHeader("Authorization", "Basic XXXXXXXXXXXX")
}, success: function(data){
console.log(data);
if(callback)
callback();
}
})
I have done a lot of work around but unable to find the solution.
I am getting this error:
Failed to load resource: the server responded with a status of 404
(Not Found)
XMLHttpRequest cannot load
https://new-website-shopify.myshopify.com/admin/customers/7094124372.json.
Response to preflight request doesn't pass access control check:
No 'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'https://www.beirutshopping.com' is therefore not
allowed access. The response had HTTP status code 404.
I will save you some headaches with this answer. You cannot call /admin from the front-end of a store, as that exposes your access token to the public. Instead, if you want to access the API from the front-end, use the App Proxy pattern, allowing you to securely make Ajax calls to accomplish your goals.
As it is, you are almost certain to fail, and any success you hack into existence will quickly expose your shop to horrors. Like being replaced with sad pandas, or otherwise being reckd.
var cors = require('cors');
router.use(cors({
origin: '*'
}));
//var config = require('../config/config.json');
//testing /* GET home page. */
router.get('/', function (req, res, next) {
res.setHeader("Content-Type", "application/liquid");
res.setHeader("Access-Control-Allow-Origin", "*");
res.render('index', {
title: 'Store Locator'
});
});

Safari 5.1 Basic Authentication log out issue

I have basic authentication enabled in my site. I able to clear user credential in IE, Mozilla and Chrome but not able to clear credential from Safari.
I tried the following
Calling an Ajax request and setting status code to 401
Calling an Ajax request with username passed in URL: http://invalidUSer#site.com
But both of them are not working properly. Whenever I close and open a new safari credentials are not at all removed.
Below is the code snippet:
In logoout Page i have following scripts:
$.ajax({
type: "POST",
contentType: "application/javascript",
async: true,
url: "../ClearAuthentication.aspx"
});
And in ClearAuthentication.aspx.vb
'Context.Response.Redirect("http://www.test.com", False) ' have tried this both adding and removing
Response.StatusCode = 401
Page.Response.StatusDescription = "Unauthorized"
'Page.Response.AppendHeader("WWW-Authenticate", "Basic realm=""foo""") ' have tried this both adding and removing
Context.Response.End()
We have same problem. We succeeded with following hack. It's like a simple login request but with false credentials.
function logout() {
var request = new XMLHttpRequest();
request.open("get", "/rest/login", false, user.login, "false");
request.send();
window.location.replace("/");
}
This solution is last answer on the question.

Callback not getting called on Internet Explorer for Ajax JSONP call

I'm making an Ajax call using JSONP to fetch JSON data from a third-party (domain different from my site) and its working on Chrome and Firefox but failing on IE (9 & 10 are the versions I have tried). In the IE debugger I see the call is completing (with Http 200) but the callback I've specified for the JSONP call is not being invoked.
My code looks like this:
$.ajax({
url: 'http://api.yipit.com/v1/deals/?key=mykey&division=seattle&limit=1000',
dataType: 'jsonp',
contentType: "text/javascript",
async: false,
cache: false,
crossDomain: true,
jsonp: 'callback',
jsonpCallback: 'processResult',
error: function (xhr, textStatus, error) {
window.alert(error);
},
success: function (data) {
window.alert(JSON.stringify(data));
_yipit_deals = data.response.deals;
}
});
And the response body looks like this:
<html><body><pre>processResult({
... [valid JSON data]
});</pre></body></html>
When the call is made, the error function is getting invoked with error as: Error: processResult was not called and the IE debugger shows a script error caused when trying to parse the <html><body><pre> tags in the response. When running on Chrome and Firefox these html tags don't exist in the response body and I'm not sure why the response is different in the case of IE.
It appears that these tags are causing IE to barf and not be able to invoke the callback. I've tried specifying other values for contentType such as "text/html", "text", "application/javascript" and even not specifying it at all, but its not made any difference. I'm using JSONP to get around the cross-domain issue.
Any ideas? Thanks!
You have to pass an explicit format argument to the URL:
&format=json
Otherwise, it's just pretty-printing the output:
<html><body><pre>{
"meta": {
"code": 401,
"message": "Key not recognized",
"name": "AuthenticationFailed"
},
"response": {}
}</pre></body></html>
Also, I would set async back to true.

OAuth Post Request Failing

I've got everything working up until Step 2 of the OAuth process where you request the actual token. I'm using a very simple jQuery Post request and constantly getting Access Control Origin errors. I've tried contentType: 'application/json' and everything else I know to try.
It's just not working and I'm not sure the problem. I've confirmed all the variables are set properly before the request. Simple post request...
var url = 'https://[STORENAMEVARIABLE].myshopify.com/admin/oauth/access_token';
var data = JSON.stringify({ client_id: apiKey, client_secret: secret, code: code });
$.ajax({
type: 'POST',
url: url,
data: data,
success: function(data) {
debugger;
},
error: function(data) {
debugger;
}
});
Any ideas what I'm doing wrong?
You need to make your OAuth requests from a server. This is the Javascript cross-domain security kicking in.
If you are using Rails you can use omniAuth and it'll take care of the whole OAuth dance for you. Otherwise you'll have to search around but most popular language have an OAuth library that you can just plug in.

Why doesn't dojo.io.script.get() execute the provided error function when receiving a 404?

I am trying to use the following to do a cross-domain get:
dojo.io.script.get({
url: myUrl,
callbackParamName: "callback",
preventCache: true,
load: dojo.hitch( this, loadFunction ),
error: dojo.hitch( this, function() {
console.log('Error!!!');
})
});
The load function runs fine, however, when the server returns a 404, the error function does not run. Can anyone tell me why?
EDIT
After some investigation, I found that a timeout and handler could be implemented in the following way:
dojo.io.script.get({
url: myUrl,
callbackParamName: "callback",
timeout: 2000
}).then(function(data){
console.log(data);
}, function(error){
alert(error);
});
This uses functionality provided by the dojo.Deferred object.
When accessing server with script tags (that what dojo.io.script.get does), status code and headers are not available.
You may try some other ways to detect a problem, like using a timeout and analyzing a content of a script. The latter is problematic for JSONP calls (like in your example).
I realize this is old but I thought I'd share a solution in case others, like I had, come across this thread.
dojo.io.script is essentially adding a <script/> to your html page. So you can try this:
var script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.setAttribute('src', myUrl);
script.onerror = function() {
debugger
}
script.onload = function() {
debugger
}
document.getElementsByTagName('body')[0].appendChild(script);
That way if the script fails to load the onerror event is called.
*This may not work in every instance but is a good start