I have the following function executing on page load:
function get_words()
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", "file:///C:\Users\myMachineName\Documents\PersonalSite_Improved\wordsEn.txt", true);
rawFile.onreadystatechange = function ()
{
if (rawFile.readyState === 4)
{
if (rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
alert(allText);
}
}
rawFile.send(null);
}
}
It is my own use of the procedure from this S.O. thread: Javascript - read local text file
I'll confess that I don't totally understand the procedure. However, I can obviously see that I would be getting an alert of the text file contents if the page was working properly. I ran some tests using console.log() to determine that the first if statement is never entered. But since I have no idea what's going on here, I have no idea how to troubleshoot the issue.
Any help?
The document you are trying to read must be served by an HTTP server, you can't pull up local files from your hard drive or machine. The reason for this is simply security, for if JavaScript could read files on local machines, everyone would be able to open, view and read everything on people's computers. Just run a local HTTP server such as WampServer or something of that nature.
You cannot use an xml request to read a local file due to security reasons.
See this answer for more info.
Related
This Javascript code...
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "get_status.php");
xmlhttp.send();
xmlhttp.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 200) {
test_response = JSON.parse(this.responseText);
console.log(test_response[0]);
console.log(test_response[1]);
...calls this php code...
$result = pg_query('select max(num_files), max(file_num) from status');
$num_files = pg_fetch_row($result);
if ($num_files[0] === $num_files[1] ) {
pg_query('truncate table status');
}
echo json_encode($num_files);
Note the console.log statements in the first code snippet. At run time, the console is showing values of "null" for both of these values.
But the "status" table has non-null values in it so I'm not sure what is going on.
Additionally, this code is running fine on development machine in case that is a clue, i.e. something in php.ini or postgres configuration file?
Another clue might be that the "status" tables is not getting truncated as it should, i.e. something going on with array or logic?
Also, the purpose of the code above is to determine status of data processing that is happening in a separate php file on uploaded files. So could be something related to multiple postgres connections being handled on servers vs on development machine?
Lastly, I have worked my way through and corrected all console and server log warnings and am no longer getting any warnings and also all other parts of the process are working correctly. Just this one status process is not working correctly.
I have a custom URL protocol handler cgit:[...]
It launches up a background process which configures some stuff on the local machine. The protocol works fine, i'm launching it from JavaScript (currently using document.location = 'cgit:[...]'), but i actually want JavaScript to wait until the associated program exits.
So basically the steps i want JavaScript to do:
JavaScript does something
JavaScript launches cgit:[...]
Javascript waits until cgit:[...] exits
JavaScript does something else
Code:
function launchCgit(params)
{
showProgressBar();
document.location="cgit:"+params;
document.addEventListener( /* CGit-Program exited event */, hideProgressBar );
}
or:
function launchCgit(params)
{
showProgressBar();
// setLocationAndWait("cgit:"+params);
hideProgressBar();
}
Any ideas if this is possible?
Since this isn't really an expected use of window.location I would doubt that there's an easy way. My recommendation would be to use an AJAX request and have the c++ program send a response when it's done. That way, whatever code needs to run after the c++ program can be run when the request completes.
As i didn't find a suitable way to solve my problem using ajax requests or anything similar, i finally solved my problem using a kind-of-ugly workarround including XmlHttpRequest
For launching the protocol i'm still using document.location=cgit:[...]
I'm using a server side system including "lock-files" - that's like generic dummy files, with generated names for each request.
Once the user requests to open the custom protocol, such a file is being generated on the server specifically for that one protocol-opening-request.
I created a folder called "$locks" on the server where these files are being placed in. Once the protocol-associated program exits, the appropriate file is being deleted.
The website continuously checks if the file for a request still exists using XmlHttpRequest and fires a callback if it doesn't (example timout between tests: 1 sec).
The structure of the new files is the following:
lockThisRequest.php: It creates a file in the $locks directory based on the req url-parameter.
unlockThisRequest.php: It deletes a file in the $locks directory; again based on the req url-parameter.
The JavaScript part of it goes:
function launchCgit(params,callback)
{
var lock = /* Generate valid filename from params variable */;
// "Lock" that Request (means: telling the server that a request with this ID is now in use)
var locker = new XmlHttpRequest();
locker.open('GET', 'lockThisRequest.php?req='+lock, true)
locker.send(null);
function retry()
{
// Test if the lock-file still exists on the server
var req = new XmlHttpRequest();
req.open('GET', '$locks/'+lock, true);
req.onReadyStateChanged=function()
{
if (req.readyState == 4)
{
if (req.status == 200)
{
// lock-file exists -> cgit has not exited yet
window.setTimeout(retry,1000);
}
else if (req.status == 404)
{
// lock-file not found -> request has been proceeded
callback();
}
}
}
req.send(null);
}
document.location = 'cgit:'+params; // execute custom protocol
retry(); // initialize lockfileCheck-loop
}
Ussage is:
launchCgit("doThisAndThat",function()
{
alert("ThisAndThat finished.");
});
the lockThisRequest.php-file:
<?php
file_put_contents("$locks/".$_GET["req"],""); // Create lock file
?>
and unlockThisRequest.php:
<?php
unlink("../\$locks/".$_GET["req"]); // Delete lock file
?>
The local program / script executed by the protocol can simply call something like:
#!/bin/bash
curl "http://servername/unlockThisRequest.php?req=$1"
after it finished.
As i just said this works, but it's anything else than nice (congratulations if you kept track of those instructions)
I'd rather prefered a more simple way and (important) this also may cause security issues with the lockThisRequest.php and unlockThisRequest.php files!
I'm fine with this solution, because i'm only using it on a password protected private page. But if you plan to use it on a public or non protected page, you may want to add some security to the php files.
Anyways, the solution works for me now, but if anyone finds a better way to do it - for example by using ajax requests - he/she would be very welcome to add that way to the respective stackoverflow-documentation or the like and post a link to it on this thread. I'd still be interested in alternative solutions :)
I'm trying to retrieve the online status of users from a chat client called IMVU(the regular little image holder by the profile pictures isn't enough, I'm making something bigger, so I need some signal), and the way to do that is use this line of the user ID 1111111 for example:
http://avatars.imvu.com/catalog/web_status_updater.php?ol=1&list=1111111
It returns a php file containing a line of JSON. I need that whole line of text put into a javascript variable so I can use it.
I need to use this in a script I'm making, but I can't seem to get it to work. I've tried lots of things, the closest seems to be this one:
function readTextFile(file)
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
alert(allText);
}
}
}
rawFile.send(null);
}
readTextFile("http://avatars.imvu.com/catalog/web_status_updater.php?ol=1&list=1111111");
(I'll change the alert(allText); to return allText; or return rawFile.responseText; when I get this experiment to work first and make sure that the text is actually stored and displayed.)
What happens is that the alert shows up blank. Just a white box, that's all. My prior attempts had the box show up and it said "undefined", but now it's doing something I guess? Why is it blank though? And how do I fix it?
EDIT:
It works in IE but not Firefox apparently.
I believe the problem here is the Same Origin Policy. You are attempting to make a request to a domain that is different than the one that originated the request.
Some websites specify headers which allow this, but the headers returned here are missing the Access-Control-Allow-Origin header.
One way around this is to use JSON-P on servers that support it.
Try this:
jQuery.ajax({
url:"http://avatars.imvu.com/catalog/web_status_updater.php?ol=1&list=1111111",
dataType:"jsonp"
})
.done(function(data) {
console.log(data)
});
I'm doing a project with arduino in which I send different requests to the server (the arduino board) with the method XMLHttprequest and Get from a webpage. Except one of the request the others are used only for sending orders to the server, so I don't expect for an XML response. The other one is a request sent in intervals of 5 seconds for getting different values from the server.
The problem arrives with this last one. Actually the webpage sends the request (because I see it on the browser console and the arduino serial monitor) every 5 seconds, but it doesn't get anything, just the headers of the answer confirming the response but nothing about the XML file. Surprisingly, when I write a normal request using the get method in the browser I get instantly the XML file with the values, and It happens all the time I do that.
I'm going to write the javascript code I'm using on the webpage
setInterval(function tiempo()
{
var request = new XMLHttpRequest();
request.onreadystatechange = function()
{
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseXML != null) {
// extract XML data from XML file (containing switch states and analog value)
document.getElementById("input1").innerHTML = this.responseXML.getElementsByTagName('dato')[0].childNodes[0].nodeValue;
document.getElementById("input2").innerHTML = this.responseXML.getElementsByTagName('dato')[1].childNodes[0].nodeValue;
document.getElementById("input3").innerHTML = this.responseXML.getElementsByTagName('dato')[2].childNodes[0].nodeValue;
document.getElementById("input4").innerHTML = this.responseXML.getElementsByTagName('dato')[3].childNodes[0].nodeValue;
document.getElementById("input5").innerHTML = this.responseXML.getElementsByTagName('dato')[4].childNodes[0].nodeValue;
document.getElementById("input6").innerHTML = this.responseXML.getElementsByTagName('dato')[5].childNodes[0].nodeValue;
document.getElementById("input7").innerHTML = this.responseXML.getElementsByTagName('dato')[6].childNodes[0].nodeValue;
}
}
}
}
request.open("GET", "URL" + Math.random(), true);
request.send(null);
}
, 5000);
On the other hand, if I only write in the browser URL, I get the XML without any problem.
One las thing I have to say is that right now I'm using a webpage stored in my computer but before I was using a webpage stored in the arduino (on an SD card) and loaded also through the internet from arduino. The same code in that case worked perfectly. The reason because I changed It is because arduino ethernet is not too fast and It took so much time. With the webpage stored in my computer It goes faster because It only needs to send the orders.
Thanks!!
Finally, I figured out the problem. It is the browser. For any reason only Internet Explorer works correctly with the webpage. Neither firefox nor other web browsers got the xml file. I don't know the reason but I would like to find it.
If someone knows something about I would be glad of trying to resolve the problem.
Thanks!!
This works in Chrome when doing it on my local server. However, when I transfer over to NodeWebkit, it fails with status === 0.
function ReadText(filename) {
var txtFile = new XMLHttpRequest();
txtFile.open("GET", filename, true);
txtFile.onreadystatechange = function () {
if (txtFile.readyState === 4) // Makes sure the document is ready to parse.
{
if (txtFile.status === 200) // Makes sure it's found the file.
{
g_FileLoadContents = txtFile.responseText;
ReadFile();
}
}
}
txtFile.send(null);
};
g_FileLoadContents is a global and ReadFile is a function that does some work on g_FileLoadContents... but it does not get that far in the NodeWebkit (Again, I'll stress all is ok in Chrome when on my local server).
In NodeWebkit I watch txtFile.readyState change up to 4, but then txtFile.status is 0.
Why is the status 0? When I use the nodeWebkit, should I just let the status be 0 in my code above?
I hope someone can explain, as I am very confused.
HTTP status codes are returned by webservers. Presumedly your local server returns 200 when you're doing this in Chrome, but node-webkit just returns 0 (Unknown?).
Normally reading local files is restricted though. Does the code above actually produce the file contents? Even so, if you're trying to read files in node-webkit I would suggest using the node fs module to access the filesystem directly.