Loading a text file through AJAX gives restricted URI error - javascript

I mentioned i read the suggested link ...and Could not able to understand the
suggestion .."Use Greasemonkey to modify Pages and start writing some
javascript to modify a web page
I am loading a text file with $.ajax. When running the code on Firefox, I get the following error:
Error: ["Access to restricted URI denied" code: "1012" nsresult: "0x805303f4 (NS_ERROR_DOM_BAD_URI)" location: "<unknown>"]
Here's my code:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("button").click(function () {
$.ajax({ url: "demo_test.txt",
success: function (result) {
$("#div1").html(result);
},
error: function (abc) {
alert(abc.statusText);
},
cache:false
});
return false;
});
});
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>
</body>
</html>
I've already read the following questions:
firefox reading web page from local JS file -- access to restricted URI denied, code: 1012, nsresult: NS_ERROR_DOM_BAD_URI
Error: [Exception... "Access to restricted URI denied" .... while calling $.ajax method
It was suggested that file system should not be used, so changed the URL to http://demo_test.txt, but that did not solve the issue.
I also heard that it might be because of a cross domain issue. If so, what exactly is meant by that, and how should I solve the problem?

Browser security prevents the code from running. You are better off running a local server such as IIS or Apache.
You can change your browser to run local content by changing a browser config
Firefox
Go to about:config
Find security.fileuri.strict_origin_policy parameter
Set it to false

I finally seems to Get it working . Here is working Script
$("button").click(function(){
$.ajax({url:"http://localhost/demo_test.txt",success:function(result){
$("#div1").html(result);
}});
});
Workaround : put the html file and text file on local server (IIS) New Site .

Related

Error in reading XML file using JavaScript

I am working on a project in which I'm in need to get the data stored in XML file using javascript or jQuery. My Script code is
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
type: "POST", //I also tried POST method
url: "match.xml",
dataType: "xml",
success: function(data){
$(data).find("mchdata match").each(function(){ //match is a tag
$(".container").append('<div class="head">'+ $(this).attr("src") +'</div>'); //src is an attribute of match tag.
});
},
error: function(){
$(".container").text("Error occured");
}
});
});
</script>
Html code is
<body>
<div class="container"></div>
</body>
Every time I run this code it's showing 'Error occurred' message in container div. I tried to inspect the page, it shows an error message like
Failed to load file:///C:/Users/vinay%20Dahiya/Desktop/match.xml:
Cross origin requests are only supported for protocol schemes: http,
data, chrome, chrome-extension, https.
I don't know what does it mean. Is this the right script url 'm using
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
I'm trying to solve this for last 2-3 days but don't know what actually wrong in the code
XML file is View XML file
Thanks in advance.
I'm suggesting a quick fix for this, since you are testing this on a local machine and nowhere near production,
go to the folder where the xml is and start a simple python server there.
use
python -m SimpleHTTPServer
then you can access your file using,
http://localhost:8000/xxyy.xml

Retrieve the content of the JavaScript file

Using JavaScript, I want to retrieve the content of the script files. These script files remain in local(in web page).
For example.
In web page, there is a script,
<script src="tool.js"></script>
Latter, I want to get the content of tool.js and process the retrieved result (like dump its content).
I have tried to use jQuery.getScript. However, it tells me that Origin null is not allowed by Access-Control-Allow-Origin.
try an ajax like the following
$.ajax('/tool.js', {
type: 'GET',
crossDomain: true,
dataType: 'jsonp',
success: function(data) {
console.log(data);
},
error: function() {
console.log("call failed");
}
});
You need to configure your Access-Control-Allow-Origin:
Access-Control-Allow-Origin: *
This lets you use any resource to obtain assets from an external domain. Do this first and either Mahan's or Lars's solution will work.
More info:
Access-Control-Allow-Origin Multiple Origin Domains?
try using jquery.load() and put its contents on an element and use .html()
<html>
</head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
//setup ajax to work locally
$.ajaxSetup({
crossDomain: false,
isLocal :true
});
$("#a").load('jquery.js', function() {
alert($("#a").html());
});
});
</script>
</head>
<body>
<span id="a" style="display:none;"></span>
</body>
</html>
Browser Check:
the code above works and tested in FF, Safari, Opera and IE
but if you keep on having problem with Origin null is not allowed by Access-Control-Allow-Origin then having a web server installed is needed as said here; Origin null is not allowed by Access-Control-Allow-Origin
Reference:
http://api.jquery.com/load/
code for your disposal : http://jsfiddle.net/PeaH3/1/

"Firebase is not defined" error

I was trying out my Firebase beta invite by calling the db from the local HTML I created.
Here's the code which refused to work.
<html>
<head>
<script src="https://static.firebase.com/v0/firebase.js"></script>
<script type="text/javascript">
var myDataReference;
function call_on_click() {
alert("Done!");
try {
myDataReference = new Firebase('https://sbose78.firebaseio.com/');
myDataReference.set('I am now writing data into Firebase!');
} catch (e) {
}
}
</script>
</head>
<body>
<input type="button" value="push me" onclick="call_on_click()">
</body>
</html>
I'm using Firefox 11 on Ubuntu.
[02:40:58.766] Firebase is not defined # file:///root/Desktop/firebase-app1.html:20
--
[02:43:28.743] file:///root/Desktop/firebase-app1.html
[02:43:28.796] GET https://static.firebase.com/v0/firebase.js [HTTP/1.1 200 OK 1766ms]
[02:43:30.572] uncaught exception: [Exception... "Operation is not supported" code: "9" nsresult: "0x80530009 (NS_ERROR_DOM_NOT_SUPPORTED_ERR)" location: "https://static.firebase.com/v0/firebase.js Line: 28"]
What am I missing?
Thanks in advance!
This was a bug in the Firebase JavaScript client caused by the handling of sessionStorage in Firefox when loading things from a file. It should be fixed at this point.
Give it another shot and it should work.
As far as I can tell, this is an issue with the same origin policy. As stated at the aforementioned document:
Starting in Gecko 1.9, files are allowed to read only certain other files. Specifically, a file can read another file only if the parent directory of the originating file is an ancestor directory of the target file. Directories cannot be loaded this way, however.
For example, if you have a file foo.html which accesses another file bar.html and you have navigated to it from the file index.html, the load will succeed only if bar.html is either in the same directory as index.html or in a directory contained within the same directory as index.html.

Jquery $.get is unaccesible

I have this mark up and a json.txt file which lies on the same directory as this .im unable to fetch it contents..also im not getting any errors in my firebug
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script>
$(document).ready(function(){
$.get('/json.txt',
function(data) {
$('div.result').html(data);
});
});
</script>
</head>
<body>
<div class="result"></div>
</body>
</html>
"on the same page" ? Do you mean "in the same directory" ? If so use
$.get('json.txt'
If this doesn't work, I suggest using the long form to see what happens :
$.ajax({
url: 'json.txt',
success: function(data){console.log(data)},
error: function(jqXHR, textStatus, errorThrown) {console.log(jqXHR, textStatus, errorThrown)};
});
So you can see in your console (ctrl+maj+i) the error (or the data).
Another note : this can't work if you're opening the html file in file:// as the json would be considered coming from another domain. You must have an http server and open it in http://.
If you type full path, everything works?
$.get('http://localhost/json.txt', function(data) {
});
I am trying help to detect problem
If file is local (file:///), then look jQuery: read text file from file system

jQuery $.load() functioning on personal webserver, but not production webserver

EDIT: I have discovered that this is a 405 error. So there is something going on with the webserver and handling POST methods.
I am having a strange occurrence. I have identical javascript code on both my test environment and production environment.
The test environment functions, and the production does not. Here is my identical code.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.1.2/jquery.tools.min.js"></script>
<script type="text/javascript" src="./js/jquery.scrollTo-min.js"></script>
</head>
<body>
<div class="content" id="content">
<a id="changeText" href="test.html">Change</a>
</div>
<script>
$(document).ready(function() {
$("#changeText").live('click', function(){
var url = $(this).attr("href");
$("#content").load(url, {var1:Math.random()*99999},function(){
alert(url + " loaded");
});
$.scrollTo("0%", 400);
return false;
});
});
</script>
</body>
</html>
Both environments report that
alert(url + " loaded");
is happening. But only my test environment actually displays the change.
The production webserver has "test.html" available in the correct location.
Are you sure the scrollTo script is being included on the production server ( or am I misinterpreting what you mean by change ) ? Perhaps try a root relative path instead of './js'? I would check Firebug's script tab to ensure it is being included.
405 errors mean that the URL you're sending to isn't expecting you to send the data in that manner. For example, if you're sending a POST request to a URL that's only designed to handle a GET request, you'll get this error.
My guess is whatever server you're running on is set up to not allow POST data to be sent to a page with a .html extension, causing the error you're seeing. Try changing the extension to a .php, .aspx, etc, and see if that helps.

Categories

Resources