I am developing a website which loads html from a template page then loads content from XML. for instance these are called in the document.ready function
$.ajax({
type : "GET",
url : "template.html",
dataType : "html",
success : function(html) {
var ndoc = document.createElement('html');
ndoc.innerHTML = html;
page = $('body', ndoc);
$('body').html(page.html());
$.ajax({
type : "GET",
url : "XML/content.xml",
dataType : "xml",
success : function(xml) {
page = $(xml).find('chisiamo').find('dialogue')[0];
setupPage(page);
}
});
}
});
This works well in Firefox and Safari. But in Chrome i get a 'Origin null is not allowed by Access-Control-Allow-Origin' when it tries to load template.html. How can I solve this problem? thank you very much.
Try to start Google Chrome with this arguments :
google-chrome --disable-web-security --allow-file-access-from-files
You should be able to create a Chrome Web App and set the permissions in the manifest to allow it access to read files from the file:// scheme.
http://code.google.com/chrome/extensions/manifest.html
You have to add permissions to the page you are requesting in the manifest. Also try using $.getJSON instead ;)
Related
I'm trying to debug problems in a javascript file. When I make a change to the file and start the Visual Studio Debugger (F5) a [dynamic] version of the javascript file shows up in the debugger and stops at my break point, but the change I made to the file is not reflected in the [dynamic] version. For example, here is the function in the javascript file:
function GetJobNotes(ScheduleID) {
var par = "ScheduleID='" + ScheduleID + "'";
$.ajax({
type: "Post",
url: "MaskingScheduleService.asmx/HelloWorld",
//data: par,
dataType: "xml",
//success: GetInfoSuccess,
//error: ProcessError
});
alert("ajax called");
}
and here is what shows up in the [dynamic] version of the file when debugging:
function GetJobNotes(ScheduleID) {
var par = "ScheduleID='" + ScheduleID + "'";
$.ajax({
type: "Post",
url: "services/MaskingSchedule.asmx/GetJobNotes",
data: par,
dataType: "xml",
success: GetInfoSuccess,
error: ProcessError
});
}
How do I get the [dynamic] version to match the code in my javascript file?
The issue is that there is an option in Chrome that breaks the updated js file. With that option, Chrome will block the changed js content and always use the previous js content.
Solution
When starting vs debugging under Chrome, please press F12 and then select Network menu.
This is an option called Disable cache
Check this option and then refresh your web page and it will load the latest version of the javascript file.
I'm trying to make a post request with jQuery in a web application with the following code :
alert('1');
$.post(server_hostname,
{ method: 'getTimestamp', type: 'text', partnerKey: partnerKey },
function(results, textStatus) {
alert(results)
alert('2');
},
'text');
That's working very well in chrome and firefox on my computer but not in safari for iOS nor in the Android browser. I guess $.post() doesn't success in a mobile browser but why?
On the other hand, how can I see the javascript errors output with my iPhone/Android ?
Thanks!
you datatype 'text' should be xml, json, script, or html
for more information see jQuery's post documentation
I'm trying to use jQuery Form Plugin to handle file uploads in an ajax form.
Everything works as long as I don't have an input[type=file] in the form.
When I add a file input type to the form, it will upload the file and work as it is supposed to in FireFox, but I get this error in Chrome:
Unsafe JavaScript attempt to access
frame with URL
http://swbdev.net:8888/inc/ajax/edit_page/
from frame with URL
http://swbdev.net:8888/site-pages-edit/19d8bb79c95e164f736f324d1b09a33e/1/#add_elements.
Domains, protocols and ports must
match.
It clearly states the Domain, protocols and ports must match. Am I missing something, in that same error it shows the two URLs and the domain, protocol and port all match?
Here is the JavaScript calling the plugin:
<script type="text/javascript">
$(document).ready(function() {
var options = {
success: function(data) {
alert(data);
},
dataType: 'html',
url: '/inc/ajax/edit_page/'
};
$('#add_elements_form').ajaxForm(options);
});
</script>
MORE INFO:
It's now failing in FireFox as well, not sure why it worked earlier, but here is the error in FireFox:
Permission denied for
http://swbdev.net:8888 to get
property Location.href
It points to this area of code in the plugin:
function cb() {
if (xhr.aborted) {
return;
}
var doc = io.contentWindow ? io.contentWindow.document : io.contentDocument ? io.contentDocument : io.document;
if (!doc || doc.location.href == s.iframeSrc) {
// response not received yet
if (!timedOut) return;
}
io.detachEvent ? io.detachEvent('onload', cb) : io.removeEventListener('load', cb, false);
var ok = true;
Specifically, this line:
if (!doc || doc.location.href == s.iframeSrc
I recently ran into the same issue with jquery file upload. Error was same as David B had
"Unsafe JavaScript attempt to access frame with URL http://swbdev.net:8888/inc/ajax/edit_page/ from frame with URL http://swbdev.net:8888/site-pages-edit/19d8bb79c95e164f736f324d1b09a33e/1/#add_elements. Domains, protocols and ports must match."
In my case both calling page url and file-upload url were pointed to xxx.mydomain.com, but when the calling page was loaded, one javascript was setting document.domain to mydomain.com and was causing the error. Checking for document.domain after the calling page was loaded, revealed the issue and fixed by removing the document.domain line in javascript for xxx.mydomain.com
Definitely weird. I would try setting the whole thing to "POST" since the input[type=file] will require that. Of course it should work even mixed, but give this a try.
$(document).ready(function() {
var options = {
success: function(data) {
alert(data);
},
dataType: 'html',
type: 'POST', // <-- This was added
url: '/inc/ajax/edit_page/'
};
$('#add_elements_form').ajaxForm(options);
});
I have an iframe using the jQuery 1.4.2 script. The same iframe is injected into both http and https sites. The jQuery script is included in the main HTML file as a relative path (e.g., /scripts/jquery-1.4.2.min.js).
When an AJAX call is made, Internet Explorer denies access. The AJAX is calling on another subdomain, but it's using the right protocol. All other browsers work but Internet Explorer gives the following error:
SCRIPT5: Access is denied.
jquery-1.4.2.min.js, line 127 character 344
I heard this error is from cross-domain AJAX calls. But why is IE the only one giving me crap? Is there an IE solution?
Also, this is my AJAX:
$.ajax({
url: thisURL,
dataType: "json",
data: {cmd : 'getMessage', uurl: urlVar, t: Math.random()},
success: function(ret){
callback(ret)
}
});
IE requires you to use XDomainRequest instead of XHR for cross site, you can try something like...
if ($.browser.msie && window.XDomainRequest) {
// Use Microsoft XDR
var xdr = new XDomainRequest();
xdr.open("get", url);
xdr.onload = function() {
// XDomainRequest doesn't provide responseXml, so if you need it:
var dom = new ActiveXObject("Microsoft.XMLDOM");
dom.async = false;
dom.loadXML(xdr.responseText);
};
xdr.send();
} else {
// your ajax request here
$$.ajax({
url: thisURL,
dataType: "json",
data: {cmd : 'getMessage', uurl: urlVar, t: Math.random()},
success: function(ret){
callback(ret)
}
});
}
Reference
http://forum.jquery.com/topic/cross-domain-ajax-and-ie
not sure whether it fits your scenario
xdr = new XDomainRequest();
xdr.onload=function()
{
alert(xdr.responseText);
}
xdr.open("GET", thisUrl); //thisURl ->your cross domain request URL
//pass your data here
xdr.send([data]);
you can find some more guidance here
This solved the issue gracefully for me:
https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest
Just install/compile after jQuery and before your script and use the $.ajax method as you normally would, the rest is handled behind the automatically.
Have you try to use the lastest of JQuery(> jquery-1.8.0)? Since the version 1.8.0, they solved some IE9's bugs. Perhaps this one too.
http://blog.jquery.com/2012/08/30/jquery-1-8-1-released/
I had a similar problem and the solution for me was to use jsonp instead of json. That way I didn't have to break out a customer version for IE.
You can only do this if the json server host supports the callback request variable or you have access to the server and can add support. Here is a page that helped me understand the process. Its .net mvc focused, but it gives a good over view of the diffrence between json and jsonp.
http://blogorama.nerdworks.in/entry-EnablingJSONPcallsonASPNETMVC.aspx
Check the domain you are accessing, following response headers should be there
"Access-Control-Allow-Methods" : "POST, GET, OPTIONS"
"Access-Control-Allow-Origin" : "http://www.mydomain.com" or "*"
the other domain should allow your script request. One more header to be added to your response is P3P header.
"p3p" : "CP=IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT"
it should help you out.
I was facing similar issue.
I was using file upload control but it was hidden and I had another element trying to control the file upload and events to upload file in ajax way
try using the file upload control directly. this solved issue in my application.
I get this bug (and thus google here) but the reason was very different. So if you don't have cross site and still get this access denied error: double check the value sent
let's say that you affect one of you variable with the bad following expression:
urlVar = $("theID").val // without () this was the error!
[...]ajax call:
data: {cmd : 'getMessage', uurl: urlVar, t: Math.random()},
Google/FF have no problem with this (check what is receive server side...) BUT IE refuse to send this!
I changed my JQuery from version 1.10.1 to 1.10.2 and it seems to have solved this problem for me.
It seems that MS is finding its own way of doing things, rather than adopting industry recommendations. I found the solution here:
https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest/blob/master/jQuery.XDomainRequest.js
Simply add 'callback=?' on your ajax URL request like here:
http://wsvdmeer.blogspot.com.es/2012/08/bugfix-getjson-not-working-in-ie.html
function populateGroups(){
var p =1;
var groupNames = new Array();
$.ajax({
type: "GET",
url: "http://okcmonprd103/iMon/findgroups.pl",
dataType: "text/xml",
success: function parseGroupNames(xml){
$(xml).find('group').each(function(){
groupNames[p] = $(this).find('name').text();
p++;
});
groupNames.sort(arraySort);
for(p=0;p<groupNames.length-1;p++){
$('#Groups').append('<option value="'+p+1+'">'+groupNames[p]+'</option>');
$('#dutyGroups').append('<option value="'+p+'">'+groupNames[p]+'</option>');
}
}
});
}
I send this ajax call to a server on our network that runs a Perl script that returns XML data. This works fine on my machine in IE8, and in my Windows 7 Gadget (which is what this is mainly for) but whenever other people in the company try to use it, they get the "Permission Denied" error. Do I need to set up a proxy page in order to make this work?
It does work on my machine, I just don't see how other people on the same network wouldn't be able to use this...
It turned out that it was a Windows 7 issue. When you right clicked on the HTML file name, under security, it would say something like "this file is blocked because it came from another computer"
All you had to do was press the "Unblock" button and all of a sudden it worked.