How to repeat a POST request using Chrome's developer tools? - ajax

Not sure if this is the right stack exchange to ask this, but here goes...
I'm trying to wean myself off of Firebug, which has served me very well for a lot of years. One feature that seems to be missing in Chrome's dev tools is the ability to repeat an AJAX POST. In firebug I can right click on the request in the console and hit "Open in new tab" and the request is repeated exactly as it was originally sent. In Chrome, the same action just does a normal GET on the link, without any of the post data.
Is there any way to repeat an AJAX POST in Chrome's dev tools?

No. There is an open bug report requesting that feature, though.
Issue 107006: Feature request: ability to replay a previously made request (esp. XHR)

Related

Can I see the network calls from a Firefox add-on?

I'd like to see the calls made from a Firefox add-on.
I know it's calling its website's REST API, and I would like to see the requests to better understand the API.
However in the Web Developper Network tab, these calls do not appear. Is there an option to see them ? Whether in dev tools or in about:config ?
Edit: I tried the about:debugging too, but it doesn't seem to capture the requests either. There are some background requests yes, but not the ones I know should be there.
As I don't know if this is generic or specific to the extension I'm looking at I'll detail. I'm trying to look at the requests made by the raindrop.io extension (https://raindrop.io/) that offers an API (https://developer.raindrop.io).
When I click on the extension button, I can create a bookmark for the page. For instance: the one I'm editing right now
This goes through requests to the REST API (at least a POST to https://api.raindrop.io/rest/v1/raindrop). I know because:
I can see similar requests when doing an operation from the website itself
I can send this request via the JS console and make it work
However I do not see this request in the normal Network console, I see no requests from the extensions.
I do not see it either from the debugging one. I see some requests though, but only background GET requests to a /links API that returns the full list of bookmarks. A request is made after I've added my bookmark, but it is clearly not the one that makes the update.
Another way I know the request is being made is that if I try to bookmark something weird (like the debugging tab), the extension displays an error that is the same I get if I manually sent a malformed request to the API.
So these calls happen. But I can't see them anywhere.
Note that the illustration is on this add-on because this is what I'm looking at right now, but I had the issue with others in the past. No way to see the foreground requests of the add-on.

Why some programmers use GET instead of POST in request that modify information on server?

I've learned that you shouldn't be using GET requests for URLs that modify information on the server because you could get problems with browser link prefetch, search engine crawlers etc.
But when I'm viewing the source code for some sites I saw that many big companies doesn't use this approach.
For example: I signed up for tidal.com and activated a subscription.
When I went to the subscript page I got a page where I was able to cancel my subscription. But the button "cancel my subscription" is not a form performing a POST request, but simply a link to https://my.tidal.com/br/account/subscription/cancel
as well reactivate subscription is a link to https://go.tidal.com/br/account/subscription/resume/40cd9e3e-3d58-4c80-aee7-c378011b49d4
Why are they doing that if my action is modifying information on the server?

How do I get XHR/Ajax resource timing data from window.performance?

When I open the Firefox "network" tab in the developer tools, I'm able to see the timing data from all the requests my page is making, including application/json (XHR) calls. I want to be able to get this timing information programmatically.
In Selenium, I let my page load fully and then ask the window.performance.getEntries() method for all of the resources. It gives me back a ton, including CSS, javascript, etc, but I don't see the calls to our RESTful services that show up in the Firefox window as "json" requests.
Since Firefox shows them in its Network tab in the developer tools, is a way for me to get them programatically? Our app is an angular app that is not using iframes.
I figured out my issue after a day of googling and trying different things. Thanks to this article I discovered that I needed to add Timing-Allow-Origin: * to the response header of all the services.
Once I did that, the timing information started to appear. It's apparently because the services are hosted at a different domain than my client. I don't understand the ramifications of leaving that header in there so I'll make sure it doesn't get deployed to production.

Automatically resend POST request in browser when navigating using back button

When I click the back button of a browser, a message pops up asking if I want to re-send the request or Try Again. I am trying to find out how to avoid this message displaying when a user navigates back to any page using the browser back button. Basically, I want the browser not to ask for a confirmation before resending the request.
Right now, when testing in Firefox, I get this:
Document Expired
This document is no longer available. The requested document is not available in Firefox's cache. As a security precaution, Firefox does not automatically re-request sensitive documents.Click Try Again to re-request the document from the website.
Sounds like the system you interact with doesn't follow the Post/Redirect/Get pattern.
The client issues a POST request to the server,
the server does something with the data and,
redirects the client to a different URL
which the client uses GET to fetch.
This way the client can reload the last URL or use the back-button and will not use POST again.
See Wikipedia for details.
Add this in the start of PHP codes:
ini_set('session.cache_limiter','public');
session_cache_limiter(false);
With the current Firefox update, to version 29, this has become the default feature when you try to navigate back to pages like search results. It can be disabled under Options/Advanced/Network and check 'Override automatic cache management'. Though your question predates this update, it looks like the same issue.
I found this solution on the Mozilla support forum here: https://support.mozilla.org/en-US/questions/1018237

Monitor AJAX requests from browser

I'm browsing a webpage that seems to populate data through javascript. I want to use an extension for my browser that will allow me to see what requests are being made to what url and what data is returned from the request.
Any help would be appreciated.
Firefox has a plugin called Firebug, or you can open its native console with Ctrl+Shift+K in newer versions. Chrome has developer tools with a Network tab.

Resources