AJAX request not working in ie9 - Google Maps API/jQuery [duplicate] - javascript

This question already has an answer here:
How to make cross-domain AJAX calls to Google Maps API?
(1 answer)
Closed 8 years ago.
Using jQuery:
$.getJSON('http://gdata.youtube.com/feeds/api/videos/b2-5GSjZvW8?v=2&alt=jsonc', function(meta){alert(meta.data.title);});
Firefox and Chrome both work as expected, but IE keeps triggering the error function (when using $.ajax) instead of success. The error status is "0" which doesn't help much.
I've also tried using $.ajax with cache:false to no avail.
Any ideas?

I can't tell you if it's an error in jquery or IE, but it looks like the XDomainRequest fails in IE. Add this to the URL:
&callback=?
...so the response will be handled as jsonp.
Edit: It looks like Microsoft's XDOmainRequest is not implemented in jQuery, so you can't run Cross-Domain-Requests in jQuery using IE(except jsonp)

Related

Why am I getting a CORS error from just a simple Settimeout function in javascript? [duplicate]

This question already has answers here:
javascript modules and CORS
(4 answers)
Closed 10 months ago.
Everything is working fine in Chrome the problem is with FireFox and Microsoft Edge. With these two browsers I keep on getting CORS errors. I am making no API calls in this website. All this function that is causing this error is doing is resetting the opacity of some text I hid back to 1.
This is the function that is causing the error:
setTimeout(() => {
opacityP.style.opacity = 1;
opacityB.style.opacity = 1;
}, 3000);
This are the error message from FireFox and Microsoft Edge:
Thanks in advance for your help.
I think it's not possible to access local script files at the browser level.
You can run the code through a local server like localhost:3000 or so.
Xampp or Wamp would work for you.
If you're using VS Code, you can use their extension.
https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
Hope this helps you!

Getting a global JQuery $(document).ajaxSuccess function to work in all browsers

I have a global ajax success function set up to detect an ajax submission on a wordpress page. Depending on the result, I would like to convey the response text to the user on the page. Usually I would just create the ajax post myself, and simply write any response to the screen with my own function - i.e.:
success : function(data) {
theResult = data;
if (data.indexOf("the response I'm looking for") > -1 ) {
$(".targetdiv").append(data');
}
}
But, this ajax request is performed by a wordpress plugin, which I do not want to modify and thus lose any modifications when the plugin is updated. So I found this general ajax success function:
$(document).ajaxSuccess(function(event, request, options) {
var data = request.responseText;
if (data.indexOf("the response I'm looking for") > -1 ) {
$(".targetdiv").append(data');
}
});
This works perfectly in Firefox and Chrome, and MS Edge Browser, but not in any earlier versions of IE including 9, 10 & 11 or earlier versions of Safari (8 and earlier).
It fails in those browsers by not getting the request.responseText at all.
I did some testing trying this: $parseJSON(request.responseText) to no avail.
I was just wondering what is different about the earlier versions of Explorer and Safari that would cause this to not work in those browsers.
The global ajax success function wasn't working in IE and Safari because there was another unrelated script causing problems in those browsers that stopped ALL JQuery functions from working.
I was relying on FF console which wasn't giving me details on errors found in IE and Safari. An obvious thing that I should have caught initially but I guess the lesson here is to not rely on one browser console to troubleshoot errors occurring in other environments.

jquery ajax to file:// not working in IE

I am trying to run a simple web page offline. Meaning I am launching the html page directly from my desktop without a server. Firefox & Safari are not giving me any trouble but IE is of course. IE versions 9+
I am using Jquery to do a Ajax call to a local json file and the damn ajax call are just not completing.
I have tried $.get, $.post, $.ajax, $.getJSON, $("body").load(), but none work.
I have also tried different urls
file:///C:/Users/user/Desktop/file.json
C:/Users/user/Desktop/file.json
C:\Users\user\Desktop\file.json
I tried different Jquery version too 1.8.3, 1.11.3, 2.1.3
I have simplified it to bare bones
$(document).ready(function () {
$.get("file:///C:/Users/user/Desktop/file.json", function(data){
console.log(data);
}).done(function(){
alert("done");
}).fail(function(){
alert("fail");
});
});
That is blocked for security reasons, it is also blocked by chrome on default.
If you want to access a file please use a javascript upload script. Maybe this tutorial will help: http://www.html5rocks.com/en/tutorials/file/dndfiles/

New Firefox version console.log problems [duplicate]

This question already has answers here:
Firefox Web Console Disabled?
(4 answers)
Closed 8 years ago.
I have Firefox 28.0 running on Mac OSX and am trying to use the console and Firebug.
I have javascript that calls console.log to test values of variables and the progress of
post and get requests.
The error message I am getting is:
The Web Console logging API (console.log, console.info, console.warn, console.error) has been disabled by a script on this page.
the code that makes the call:
if(e.target.id == "RL")
{
console.log('reloading..')
location.replace('../dummy.php');
//return false;
}
(dummy.php is a script that calls header('location:') which redirects back to the requesting page, for the sake
of reloading.)
so what is doing the disabling?
Firebug is disabling the built-in console and replacing it with its own console.

$.getJSON and google fonts API stops working in internet explorer with jQuery versions greater than 1.4.4

I have spent almost the whole day trying to find a solution to this problem.
I have successfully written code to dynamically retrieve and display the whole lot of fonts using the Google fonts API and jQuery 1.4.4. (works in all browsers)
I have had to change jQuery to version 1.7.2 and unfortunately noticed that the code I wrote works well in all browsers except for Internet Explorer.
I did some testing and found that in Internet Explorer $.getJSON or $.ajax fail to load the JSON font data from Google when using jQuery versions higher than 1.4.4.
This is the code I am using:
$(function(){
$.getJSON('https://www.googleapis.com/webfonts/v1/webfonts?key=XXXXXX', function(json) {
alert(json);
});
});
After some research I have tried this too:
$.ajax({
type: "get",
url: "https://www.googleapis.com/webfonts/v1/webfonts?key=XXXXXXXX",
cache:false,
dataType:'json',
success: function(data){
alert(data);
}
});
Both methods fail in Internet Explorer using any jQuery version greater than 1.4.4 - nothing happens.
Any ideas why?
Thanks for the help.
It seems to be IE that is blocking connection to hosts outside of your site's domain. This is due to the Same Origin Policy. This is usually not a big deal with the latest and greatest browsers out there, although it can still occur with any browser. I tested your code using JSFiddle and it threw an error about same origin in Chrome 21.
Normally, the way to fix this is to use JSONP. Unfortunately, the Google Webfonts API does not support JSONP. The best way that I can think about getting that data cross-browser is to download the JSON using a server-side programming language such as PHP. From there, you can echo the JSON out to the page and use the $.getJSON function to grab that data locally on your server.
EXAMPLE: fontApi.php (local file on your server)
<?php
$json = file_get_contents('https://www.googleapis.com/webfonts/v1/webfonts?key=XXXXXX');
die($json); // prints JSON to the screen that jQuery can use
?>
Then use the following jQuery...
$.getJSON('fontApi.php', function(json) {
//your code
});
Hopefully this helps you out :)

Categories

Resources