Setting to XMLHttpRequest asynchronous doesn't work - javascript

i am trying to learn Ajax now i don't know how to set XMLHttpRequest Asynchronous. i've tryed some other post about ajax but can't make sense of it. Sorry if this already asked.
In the following code i try to console.log the XMLHttpRequest object.
i've linked it to a local text file in the same folder.
the problem is that when is set request.open parameter to true it does't work. Its only works when its set to false but i read that this is not asynchronous.
I am using XAMPP for a server. Also i've tryed it on a differnt server form school.
If there are anny questions please ask me.
thanks
var request;
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
}else{
request = new ActiveXObject("Mircosoft.XMLHTTP");
}
//this open function
request.open('GET', 'text.txt', true);
request.send();
if(request.status===200){
console.log(request);
document.writeln(request.responseText);
}

The entire point of it being asynchronous is that it won't lock up the JavaScript engine until the response has arrived. So with your current code, you are trying to read the response before it exists.
You need to use an event handler to process the data after it has arrived.
function processData() {
document.writeln(this.responseText);
}
var request = new XMLHttpRequest();
request.open('GET', 'text.txt');
request.addEventListener("load", processData);
request.send();

You've to wait the response with request.onreadystatechange function
var request;
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
}else{
request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.onreadystatechange = function(){
if(request.readyState == 4 && request.status == 200)
{
document.writeln(request.responseText);
}
}
//this open function
request.open('GET', 'text.txt', true);
request.send();

Related

Issue with fetching and outputting data from API

I have recently learned to use APIS in code, but for my javascript version I've had to learn different ways of doing it, when using what should be the simplest method nothing gets outputted to my chrome console.
const request = new XMLHttpRequest();
request.open('GET','apistuff, true);
request.onload = function() {
let data = JSON.parse(this.response);
console.log(data);
};
HTML file is just empty and calls the javascript file
Just replace current code with below code and let me know the status
const request = new XMLHttpRequest();
request.open('GET', apistuff, true);
request.send();
// we need to call this send method to open breach between server and client
request.onload = function() {
let data = JSON.parse(request.response);
// if response is in text simply use **request.responseText**
console.log(data);
};

Reading a local text file in javascript synchronuosly

i just want to read a local text file and assign it to a variable. I don't see why this code doesn't work. I have already looked almost in any response on stackoverflow since yesterday and that's the only synchronous way i have found.
Anybody sees the problem ?
function readTextFile(file){
var request = new XMLHttpRequest();
request.open('GET', file);
request.onreadystatechange = function(){
console.log(request);
console.log(request.responseText);
return request.responseText;
}
}

Deprecation Synchronous XMLHttpRequest

I see this error: "[Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.", on this code:
var request;
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
}else{
request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.open('GET', 'http://www.mywebsite.com', false);
request.send();
What should I replace the instructions with because they are deprecated?
you just need to change
request.open('GET', 'http://www.mywebsite.com', false);
to
request.open('GET', 'http://www.mywebsite.com', true);
This will make the request operate asynchronously, meaning the code after it is sent will execute immediately instead of waiting for the request to complete. You can then use an event listener to tell the request what code to run when it's complete.
request.onreadystatechange = function () {
if(request.readyState === XMLHttpRequest.DONE) {
console.log("Request completed!");
}
}
request.open('GET', 'http://www.mywebsite.com', false)
It means you are creating a synchronous call to the Web service. So not expecting any call back theoratically.
So to continue with above approach make sure the body is also null.
request.send(null);
if (request.status === 200) {
console.log(request.responseText);
}
The null parameter indicates that no body content is needed for the GET request.
Hence the thread won't be blocked.

Getting too much traffic error in javascript for xmlhttprequest

I am using xmlhttprequest() in javascript to find the statuscode for the link.
xhttp = new XMLHttpRequest();
xhttp.timeout = 5000;
xhttp.open("GET", url, true);
xhttp.send(null);
I am writing this code in a function and calling this function in a for loop for almost 1000 links.If i execute this once it is getting executed and then if i launch chrome and trying to run anurl it is showing error like "Too much traffic from the server" and asking for verification.
I have done same in Java but in java(Using httprequest) i am not getting any error.
One more issue i am facing is i am getting status code as '0'.What does it mean ??
The speed of execution is also very slow.Is there any way to find the status code of an url faster using javascript???
This code is working fine for xmlhttprequest :
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// Typical action to be performed when the document is ready:
document.getElementById("demo").innerHTML = xhttp.responseText;
}
};
xhttp.open("GET", "filename", true);
xhttp.send();

How to make get requests with JavaScript?

My apologies if this is a trivial question but I couldn't find how to make requests using JavaScript.
var request = new XMLHttpRequest();
request.open("GET", "http://www.google.com");
alert(request.status);
I get 0, but http statuses should be between 100 and 600. Where am I going wrong?
The issue is that you're never making the request. See an example of XMLHttpRequest here.
function reqListener () {
console.log(this.responseText);
}
var oReq = new XMLHttpRequest();
oReq.onload = reqListener;
oReq.open("get", "http://www.google.com", true);
oReq.send();
Notice oReq.send(), which sends the request. Also notice the reqListener function, which gets called when the request completes.
Check the article How to get the response of XMLHttpRequest
In a nutshell, XMLHttpRequest is asynchronous by default, so you need to register a callback function on the onreadystate.
var request = new XMLHttpRequest();
request.onreadystatechange=function(){
if (request.readyState==4 && request.status==200){
alert(request.status);
// To get the response use request.responseText;
}
}
request.open("GET", "http://www.google.com");
request.send(null);
Note that for older versions of IE (IE5 and IE6), you need to get the request from an ActiveX Object as follows:
variable=new ActiveXObject("Microsoft.XMLHTTP");
I'm not sure but you just define your request. Did you forget to send it ?
Try
var request = new XMLHttpRequest();
request.open("GET", "http://www.google.com");
request.send(null);
alert(request.status);

Categories