I'm trying to debug a web application not written by me. There is a failing XMLHttpRequest being made:
XMLHttpRequest cannot load ... No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '...' is therefore not allowed access.
Is there a way, preferably using Chrome developer tools, to locate the source of this call?
1. Open Chrome browser 2. Go to chrome://flags/#allow-sync-xhr-in-page-dismissal 3. Change the drop-down selection from “Default” or “Disabled” to “Enabled”.
From Chrome On the line of the specific resource you're interested in, you right-click with the mouse and you select “Copy as cURL” and it'll generate a command line for you in your clipboard. Paste that in a shell to get a curl command line that makes the transfer.
XMLHttpRequest (XHR) objects are used to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing. XMLHttpRequest is used heavily in AJAX programming.
Step 1: Open the Chrome Developer ToolsGo to your Chrome Browser > Click on the Right Corner 3 Vertical Dots > More Tools > Developer Tools as shown in the below image. And this is what the Developer tools look like. Adjust the screen as per your convenience.
All modern browsers have a built-in XMLHttpRequest object to request data from a server. The XMLHttpRequest object can be used to request data from a web server. The XMLHttpRequest object is a developers dream, because you can:
To send an HTTP request, create an XMLHttpRequest object, open a URL, and send the request. After the transaction completes, the object will contain useful information such as the response body and the HTTP status of the result. A request made via XMLHttpRequest can fetch the data in one of two ways, asynchronously or synchronously.
A request made via XMLHttpRequest can fetch the data in one of two ways, asynchronously or synchronously. The type of request is dictated by the optional async argument (the third argument) that is set on the XMLHttpRequest.open () method.
Without requesting additional privileges, the extension can use XMLHttpRequest to get resources within its installation. For example, if an extension contains a JSON configuration file called config.json, in a config_resources folder, the extension can retrieve the file's contents like this:
It turns out - yes, there is. That "XHR Breakpoints" option on the side which I had always ignored:
It works perfectly.
Firefox has an identical feature:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With