Newbie: Trying to use Fiddler to see/debug Javascript/XHR problem

0 Answers 911 Views
Fiddler Classic
O
Top achievements
Rank 1
O asked on 26 Sep 2021, 03:11 AM | edited on 26 Sep 2021, 03:34 AM

Hi,

I am doing some testing with a scenario where I have an HTML page with some Javascript that uses XHR to do a cross-domain request for a resource that is in a different domain, and I am trying to use a CORS Proxy called "CORS Anywhere" to determine if that will work.

I have a basic test configuration for this scenario working, but some of the resources (URLs) that we need to access (using the Javascript/XHR are "protected" by Oracle "OAM" web access control product, and my test fails when that is the case.

The way that OAM works is that there is an agent (webgate) on the Apache that is hosting the target resource, and when the webgate sees a request incoming for the protected resource, the webgate will cause a 302/redirect response to occur, and I think that that is the start of the problem.

[In the Apache logs, I can the request for the resource, and a 302 redirecting to one of the OAM endpoints, so I am pretty sure that that first OAM redirect is occurring.]

I have been trying various things to try to "see" what is going on, including the web developer tools, etc., and live headers plugin for the browser (both Chrome and Firefox), but with those, I only see the initial request and the last request for the resource, and that last one is failing.

I have also tried sniffers, including Wireshark, but our dev environment is on AWS, and even with Wireshark and the capture in promiscuous mode, I don't see all the requests, especially the request form the Javascript/XHR and the redirects that I believe are being caused because of the webgate.

So, I am now trying to use Fiddler. 

However, even when I use Fiddler, I am only seeing the first request and the final request.  The requests from the Javascript/XHR to just prior to the last request are not appearing at all :(!!

So I was wondering:  Shouldn't Fiddler be able to capture those requests (and responses) that appear to be missing?  Is there something else that I need to configure in order for Fiddler to be able to "see" those requests?

Here's the HTML/Javascript/XHR page that is doing the request to the target URL:


<html>
<body>

<script>
// 1. Create a new XMLHttpRequest object
let xhr = new XMLHttpRequest();

// 2. Configure it: GET-request for the URL /article/.../load
xhr.open('GET', 'http://192.168.xxx.yy:8080/http://charlieeastweb.....com:7777/target-charlie/index.html');


// 3. Send the request over the network
xhr.send();

// 4. This will be called after the response is received
xhr.onload = function() {
  if (xhr.status != 200) { // analyze HTTP status of the response
    alert(`Error ${xhr.status}: ${xhr.statusText}`); // e.g. 404: Not Found
  } else { // show the result
    alert(`FROM javascript in xhr-fakewava-PROTECTEDPAGE.html, Done, got ${xhr.response.length} bytes`); // response is the server response
  }
};

xhr.onprogress = function(event) {
  if (event.lengthComputable) {
    alert(`FROM javascript in xhr-fakewava-PROTECTEDPAGE.html, event.type is: ${event.type}`);
    alert(`FROM javascript in xhr-fakewava-PROTECTEDPAGE.html, event.lengthComputable is true, Received ${event.loaded} of ${event.total} bytes`);
  } else {
    alert(`FROM javascript in xhr-fakewava-PROTECTEDPAGE.html, event.type is: ${event.type}`);
    alert(`FROM javascript in xhr-fakewava-PROTECTEDPAGE.html, event.lengthComputable is false, Received ${event.loaded} bytes`); // no Content-Length
  }

};

xhr.onerror = function() {
  alert("Request failed");
};

</script>

</body>
</html>

In the above, the:

'http://192.168.xxx.yy:8080/http://charlieeastweb.....com:7777/wavatarget-charlieeastweb05/index.html'

is a kind of "composite" URL:

the "http://192.168.xxx.yy:8080" is the URL of the CORS Anywhere CORS proxy server (actually on the same machine as the Apache that is serving the HTML page).

The

http://charlieeastweb.....com:7777/target-charlie/index.html

is the URL of the protected target resource.

So I think/GUESS that:

  • Browser makes a request for the HTML page that contains the Javascript/XHR code, then  <== [This is the 1st request I see in Fiddler - response is 200/OK]
  • The Javascript/XHR code make request, which goes to the http://192.168.xxx.yy:8080 (which is the CORS Anywhere server), then
  • CORS Anywhere takes the request and forwards it to the http://charlieeastweb....com:7777/target-charlie/index.html (the resource, protected by OAM, then
  • When the OAM webgate gets that request, it sends the first 302 response back. 
  • etc.?

The 2nd (and only) other request/response I see in Fiddler is a request to the http://charlieeastweb....com:7777/target-charlie/index.html. The response to this 2nd request is a 200/OK. This request includes an "Origin:" HTTP request header, and the response includes an "access-control-allow-origin" HTTP response header, which I believe is being added by the CORS Anywhere CORS Proxy.

However, the contents of the page that is in that response is an error page that we see when the OAM processing has failed, so something is going wrong within the OAM part of the protocol, but I am not able to see anything :(!!

 

I am really new to using Fiddler, and to get it to start logging, I followed steps to set up Chrome with a proxy at localhost:8888.

Is it possible that maybe the reason Fiddler is not logging the requests/responses that appear to be missing is that once the Javascript/XHR makes the request to the protected URL, the ensuing redirects are not going through/not using the Chrome proxy settings???

If so, what additional configuration do I need?

Thanks!

Jim

 

 

 

 

 

 

 

 

 

Nick Iliev
Telerik team
commented on 29 Sep 2021, 08:24 AM

Hey there,

I am not familiar with the CORS Anywhere product, but it looks like this is a NodeJS library that modifies and sends requests through the Node processes. If that is correct, then you should probably set up your environment variables - see this article (created for Fiddler Everywhere but the very same principle is valid for Fiddler Classic) on how to set those variables through a terminal or directly in the code (depending on the library implementation)/

No answers yet. Maybe you can help?

Tags
Fiddler Classic
Asked by
O
Top achievements
Rank 1
Share this question
or