Retrieving unprocessed HTTP response using AJAX

Question

Retrieving unprocessed HTTP response using AJAX

Is it possible to retrieve the full raw HTTP response from the server using plain JavaScript AJAX in a web browser?

When I say raw response, I mean both headers and body in a raw text format like the following:

< HTTP/1.1 301 Moved Permanently
< Location: http://www.google.co.uk/
< Content-Type: text/html; charset=UTF-8
< Server: gws
< Content-Length: 221
< X-XSS-Protection: 1; mode=block
< X-Frame-Options: SAMEORIGIN
< Age: 11
< Date: Mon, 04 Jun 2018 09:12:14 GMT
< Expires: Wed, 04 Jul 2018 09:12:14 GMT
< Cache-Control: public, max-age=2592000
< Connection: keep-alive
< 
<HTML><HEAD><meta http-equiv="content-type" content="text/html;charset=utf-8">
<TITLE>301 Moved</TITLE></HEAD><BODY>
<H1>301 Moved</H1>
The document has moved
<A HREF="http://www.google.co.uk/">here</A>.
</BODY></HTML>

(Note: This is not related to cross-origin requests)

javascript ajax

Answer 1

Answer №1

To retrieve both the body and response headers, you will need to make two separate calls.

To access the headers, utilize the method getAllResponseHeaders
For the body, access the property .response when the readystate is 4 (=DONE)

var request = new XMLHttpRequest();
request.open("GET", "http://www.example.com", true);
request.send(null);
request.onreadystatechange = function() {
  if (request.readyState == 4){
    console.log(request.getAllResponseHeaders());
    console.log(request.responseText);
  }
};

Answer 2

To retrieve both the body and response headers, you will need to make two separate calls.

To access the headers, utilize the method getAllResponseHeaders
For the body, access the property .response when the readystate is 4 (=DONE)

var request = new XMLHttpRequest();
request.open("GET", "http://www.example.com", true);
request.send(null);
request.onreadystatechange = function() {
  if (request.readyState == 4){
    console.log(request.getAllResponseHeaders());
    console.log(request.responseText);
  }
};

Retrieving unprocessed HTTP response using AJAX

Answer №1

Similar questions

What sets apart using JQuery to run AJAX from using plain XMLHttpRequest for AJAX requests?

no results returned from server request

Ensure that an HTML table row remains fixed on the screen at all times

Having trouble with installing a React app using npx create-react-app my-app?

What is the sequence in which Jest executes its tests?

Refine your search with a JSON object description in expressJS and UnderscoreJS

The Google Maps display for this page failed to load properly on the map

Incorporating SCSS directly in React component along with material-ui styling

Adjust the dimensions of the thead, tbody, and td elements on the fly

Execute an AJAX call to remove a comment

Error in TypeScript: The property 'data' is not found within type '{ children?: ReactNode; }'. (ts2339)

What causes the oninput event to act differently in Angular as opposed to regular JavaScript?

My React project is altering the direction of my image

What could be causing jQuery animate to malfunction on mobile devices when a viewport is present?

The React material-table only updates and rerenders the table when the data is updated twice

How to mimic a mouse hover effect with JavaScript

Implementing dropdown filtering for nested ng-repeats in Angular application

Enhance the efficiency of a LINQ Query for AutoComplete functionality

When working with AngularJS, I encountered an issue where I added two additional input text boxes with unique IDs and ng-models, but unfortunately

Deliver a message using a loop in jade