How to manually send HTTP POST requests from Firefox or Chrome browser

Question

I want to test some URLs in a web application I'm working on. For that I would like to manually create HTTP POST requests (meaning I can add whatever parameters I like).

Is there any functionality in Chrome and/or Firefox that I'm missing?

Grizel

DHC by Restlet (available on Chrome Webstore) is pretty useful too. – Leatheroid

Make an AJAX call in the Chrome console. No extension needed. This is a good way to make POST requests without the need to grab authentication cookies. $.post('/resource/path/') – Montreal

Whilst an add on is necessary, the close is niitpicking nonsense. He was asking for functionality in chrome or firefox , or iif it needs a plugin. That it might require a specifed or unspecified plugin is not the point – Ondrej

insomnia.rest is a dedicated API testing client you may find helpful. – Ratoon

HTTPie - a CLI, cURL-like tool for humans: github.com/jakubroztocil/httpie – Cline

The post is closed incorrectly. It does not ask for a tool, but for a functionality in the tools the author already is working with. This way we have to close all questions about how to do this or that on some tool - and it will be a good on-tenth of SO. – Holmun

I noticed this feature on Firefox when you open the network tab and choose a random request you can Edit and Resend it which is pretty cool. – Overvalue

In modern browsers you can make use of the Fetch API which lets you do a POST request from the JavaScript developer console with minimal effort. I am prefering this because you don't need to install a third party extension and especially when posting sensitive data (like passwords) it's recommended to NOT rely on external software. Here is a code snippet how to use the Fetch API: gist.github.com/bennyn/ed95ed9edd6ce0d04e7c8d6e6eb1a1f8 – Caslon

@BennyCode gist link is broken. – Ralaigh

Try this one: gist.github.com/bennycode/ed95ed9edd6ce0d04e7c8d6e6eb1a1f8 – Caslon

Answer 1

I have been making a Chrome app called Postman for this type of stuff. All the other extensions seemed a bit dated so made my own. It also has a bunch of other features which have been helpful for documenting our own API here.

---

Postman now also has native apps (i.e. standalone) for Windows, Mac and Linux! It is more preferable now to use native apps, read more here.

---

Tetartohedral

Make sure to install Postman interceptor plugin too if you want to use your browser's cookies, session. – Minoru

You are developing great tools and applications for developer @abhinav Thanks – Acanthocephalan

People may also find the web version of Postman here. Installation is even not required. – Rooftop

Tool might be useful, but a 3rd party app doesn't answer the question, which asks for doing this through Chrome or Firefox. – Maroney

Not to be confused with Postman...? "Postman is a toolchain for API developers to share, test, document and monitor APIs." – Snooty

@PeterMortensen This is the same Postman, just 9 years later on a standalone app. You can read about it on blog.postman.com/how-we-built-postman-product-and-company – Kieffer

Unfortunately, the Postman app uses a huge chunk of your RAM when IDLE. That's a shame when you just need a lightweight app to send basic HTTP request, with eventually some auth. It is a great app with good ergonomy though. – Wornout

Wait... This post is sacred 🤯 – Pontifex

And Postman as we know was born. – Phytobiology

Needs a (free) account. Meh. – Silvereye

The Postman Chrome app has been deprecated by the author. – Indomitable

damn... the legend – Coil

You should keep working at it... who knows, maybe this 'Postman' thing will catch on in the dev community in a couple of years time... – Helgahelge

Just realised this is the birth of Postman 🙌 🤯 – Ultan

I was hoping that postman might have an "Send to browser" button, under the good ol' send button's dropdown menu. – Keim

Answer 2

CURL is awesome to do what you want! It's a simple, but effective, command line tool.

REST implementation test commands:

curl -i -X GET http://rest-api.io/items
curl -i -X GET http://rest-api.io/items/5069b47aa892630aae059584
curl -i -X DELETE http://rest-api.io/items/5069b47aa892630aae059584
curl -i -X POST -H 'Content-Type: application/json' -d '{"name": "New item", "year": "2009"}' http://rest-api.io/items
curl -i -X PUT -H 'Content-Type: application/json' -d '{"name": "Updated item", "year": "2010"}' http://rest-api.io/items/5069b47aa892630aae059584

Helminthic

I'm upvoting this even though it's a wrong answer to the question: it's what I needed to know instead. – Diplodocus

It doesn't fit the whole purpose, because it cannot attach cookies already set in a browser. For example, you might want to log in to a website manually, and then send a post request. With curl, this would be a huge pain if the login process is handled with javascript stuff – Perchloride

This doesn't work for me, I can't use single quotes on OSX with zsh and bash, shell is turning into quote> mode. I need to use -d "{\".. – Distinctive

Yeah, curl is awesome, you almost always already have it on Unix, and it's really lightweight for Windows. No registration or SMS! ;) – Fasces

Windows cmd.exe also doesn't like the single quotes, so for my POST I used: curl -i -X POST -H "Content-Type: application/json" -d "{\"name\": \"New item\", \"year\": 2009}" localhost:60524 – Alica

I recommend httpie as "like curl but better" (but still CLI-based, unlike Postman). Edit: Whoops, there's a separate answer for it. – Ophthalmology

Answer 3

Firefox

Open Network panel in Developer Tools by pressing Ctrl+Shift+E or by going Menubar -> Tools -> Web Developer -> Network. Select a row corresponding to a request.

Newer versions

Look for a resend button in the far right. Then a new editing form would open in the left. Edit it.

Older versions

Then Click on small door icon on top-right (in expanded form in the screenshot, you'll find it just left of the highlighted Headers), second row (if you don't see it then reload the page) -> Edit and resend whatever request you want

Willi

Is this feature broken for anyone else? When editing the parameters in the "Query String" box, after altering a single character, it refuses to alter the request any further. The only way to do it beyond that is to edit the entire URL/request (which is difficult because it's all smooshed together) – Wingover

@Wingover Can you post a screenshot or problem steps recorder please? I can edit query string just fine. To add a new query string, I either use &= or just start a new line. To edit, change individual k,v or I just delete and start over. – Willi

If you want a field for the query string (?key=value) where you can enter key value pairs line by line, just append a ? and a letter to the URL field at the top and the Query String field will show up. – Humectant

this does not work in the current version of Chrome – Deformity

@dima-lituiev, The screenshots above are for Firefox and I've confirmed it works in firefox version 88.0.1 – Elissaelita

I've also confirmed it works in Firefox 88.0.1 - However, in my case, the "Edit and Resend" button is not showing up. I have to right-click on the request then click "Open in Network Panel". From there, I am able to click the "Resend" dropdown in the upper right and select "Edit and Resend". Kudos to this solution going strong years later. You even have an option for it to create a fetch() command for the request to use in the console like OP was initially requesting. – Daredeviltry

this gives me "415 Unsupported Media Type" – Dagnah

In the latest version of Firefox, only "Resend" is there instead of "Edit & Resend"!!. I took 5 mins to figure it out that there is no other button to EDIT it. – Assertive

Answer 4

Forget the browser and try CLI. HTTPie is a great tool!

CLI HTTP clients:

• HTTPie
• Curlie
• HTTP Prompt
• Curl
• wget

If you insist on a browser extension then:

Chrome:

• Postman - REST Client (deprecated, now has a desktop program)
• Advanced REST client
• Talend API Tester - Free Edition

Firefox:

• RESTClient

Hollow

also resource test addon addons.mozilla.org/en-us/firefox/addon/http-resource-test – Separatrix

Poster last updated 28/06/11 - updates to Firefox means there's no way to launch it – Chessboard

@Separatrix i am unable to use resource test addon in mozilla the tool does not appear (even after installaion and restart) to me under developer tools in the lastest version of firefox. – Mantissa

Just tried REST Easy. Uninstalled on the spot: the interface does way too much hand-holding and forces the user into rigid use cases. Not good for API development. – Terryterrye

Tried all suggested above for Firefox but found nothing as handy as Postman for Chrome. REST Easy, by the way, doesn't handle empty responses. – Odense

I would rather use curlie than HTTPie. curlie is based on the more powerful curl. – Shit

Answer 5

Having been greatly inspired by Postman for Chrome, I decided to write something similar for Firefox.

REST Easy* is a restartless Firefox add-on that aims to provide as much control as possible over requests. The add-on is still in an experimental state (it hasn't even been reviewed by Mozilla yet) but development is progressing nicely.

The project is open source, so if anyone feels compelled to help with development, that would be awesome: https://github.com/nathan-osman/Rest-Easy

_{* the add-on available from http://addons.mozilla.org will always be slightly behind the code available on GitHub}

Evolute

Seems nice, but lacks the ability to control the request body fully. Currently, it offers key/value abilities, but full control of the post body would be nice. – Freewheel

PUT and DELETE support would win me over. Looks good otherwise. – Topmost

@NathanOsman, So is that now a feature or still a planned feature? – Lacteal

@Pacerier: it's a feature I'm currently working on and am about 90% complete. Hopefully it will be released before the end of the year. There does seem to be a backlog getting addons approved by Mozilla. – Evolute

After over a month of waiting, the new version has been approved. PUT and DELETE support has arrived! And in that month, I've also made a ton of other new changes that will show up soon in the next release. (Hopefully it gets approved sooner this time.) – Evolute

That is not available anymore, as it seems. (It likely is not a WebExtension and thus not compatible with Firefox >= 57.) This problem is tracked here: github.com/nathan-osman/REST-Easy/issues/78 – Absonant

Not to be confused with Postman...? "Postman is a toolchain for API developers to share, test, document and monitor APIs." – Snooty

Answer 6

You specifically asked for "extension or functionality in Chrome and/or Firefox", which the answers you have already received provide, but I do like the simplicity of oezi's answer to the closed question "How can I send a POST request with a web browser?" for simple parameters. oezi says:

With a form, just set method to "post"

<form action="blah.php" method="post">
  <input type="text" name="data" value="mydata" />
  <input type="submit" />
</form>

I.e., build yourself a very simple page to test the POST actions.

Harmattan

I will add, for the ones that don't know: what you specify as action is the resource you want to get (which can include GET-style query parameters), and value specifies the POST's data body. E.g. action="api/ids?name=John" and value="hello" will make a POST request to <hostname>/api/ids?name=John with a body of hello. – Fur

Answer 7

I think that Benny Neugebauer's comment on the OP question about the Fetch API should be presented here as an answer since the OP was looking for a functionality in Chrome to manually create HTTP POST requests and that is exactly what the fetch command does.

There is a nice simple example of the Fetch API here:

// Make sure you run it from the domain 'https://jsonplaceholder.typicode.com/'. (cross-origin-policy)
fetch('https://jsonplaceholder.typicode.com/posts',{method: 'POST', headers: {'test': 'TestPost'} })
  .then(response => response.json())
  .then(json => console.log(json))

Some of the advantages of the fetch command are really precious: It's simple, short, fast, available and even as a console command it stored on your chrome console and can be used later.

The simplicity of pressing F12, write the command in the console tab (or press the up key if you used it before) then press Enter, see it pending and returning the response is what making it really useful for simple POST requests tests.

Of course, the main disadvantage here is that, unlike Postman, this won't pass the cross-origin-policy, but still I find it very useful for testing in local environment or other environments where I can enable CORS manually.

Coiffure

This worked great to get "unstuck" when I had an app that was caught in a bad state that couldn't be cleared because a bug was keeping the UI locked. Got the user going again till the bug could be addressed. – Hedwighedwiga

Exactly like @SteveInCO, I needed a native Chrome method just to get my user (who can't be expected to have anything besides Chrome available) unstuck as an emergency measure. (Even though I use most of the other tools for my own day-to-day use.) – Arroyo

Answer 8

Here's the Advanced REST Client extension for Chrome.

It works great for me -- do remember that you can still use the debugger with it. The Network pane is particularly useful; it'll give you rendered JSON objects and error pages.

Kr

Answer 9

For Firefox there is also an extension called RESTClient which is quite nice:

RESTClient, a debugger for RESTful web services

Conditioner

Answer 10

It may not be directly related to browsers, but Fiddler is another good software.

Chlordane

Answer 11

You could also use Watir or WatiN to automate browsers. Watir is written for Ruby and Watin is for .NET languages. I am not sure if it's what you are looking for, though.

• http://watin.sourceforge.net/
• http://watir.com/

Lodger

Answer 12

There have been some other clients born since the rise of Postman that is worth mentioning here:

• Insomnia: with both desktop application and Chrome plugin
• Hoppscotch: previously known as Postwoman, and with a Chrome plugin available as well. You can also make it work locally with docker if you want to get funny
• Paw: if you are on Mac
• Advanced Rest Client: already mentioned as a Chrome plugin, but it is worth pointing out that it also has a desktop application
• soapUI: written in Java and with lots of testing functionality
• Boomerang: yet another way to test APIs. It comes with SOAP integration and it also has a Chrome plugin available
• Thunder Client: if you use VS Code as your text editor then you should go and check out this awesome extension

Latter

Answer 13

Try Runscope. A free tool sampling their service is provided at https://www.hurl.it/.

You can set the method, authentication, headers, parameters, and body. The response shows status code, headers, and body. The response body can be formatted from JSON with a collapsable hierarchy.

Paid accounts can automate test API calls and use return data to build new test calls.

COI disclosure: I have no relationship to Runscope.

Siloxane

There is a free tier for Runscope too, it just has a lower limit of request per month and only 1 team member. Disclosure: I do :-) – Therefore

Answer 14

The question being 12 years old now, it is easy to understand why the author asked a solution for Firefox or Chrome back then. After 12 years though, there are also other browsers and the best one which does not involve any add-ons or additional tools is Microsoft Edge.

Just open devtools (F12) and then Network Console tab (not the Network or Console tab. Click on + sign and open it, if it is not visible.).

And here is the official guide: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/network-console/network-console-tool

Have fun!

Outstare

Answer 15

Windows CLI solution

In PowerShell you can use Invoke-WebRequest. Example syntax:

Invoke-WebRequest -Uri http://localhost:3000 -Method POST -Body @{ username='clever_name', password='hunter2' } -UseBasicParsing

On systems without Internet Explorer, you need the -UseBasicParsing flag.

Polysynthetic

Answer 16

Check out http-tool for Firefox...

Aimed at web developers who need to debug HTTP requests and responses. Can be extremely useful while developing REST based API.

Features:

• GET
• HEAD
• POST
• PUT
• DELETE

Add header(s) to request.
Add body content to request.

View header(s) in response.
View body content in response.
View status code of response.
View status text of response.

Davita

That is not available anymore, as it seems. (It likely is not a WebExtension and thus not compatible with Firefox >= 57.) – Absonant

The link (effectively) broken: "Oops! We can’t find that page" – Snooty

Answer 17

I tried to use postman app, had some auth issues. If you have to do it exclusively using browser, go to network tab, right click on the call, say edit and send response. There is a similar ans on here about Firefox, this right click worked for me on edge and pretty sure it would work for chrome too

Humble

Option is available in Edge, but not in Chrome. – Sprawl

Answer 18

So it occurs to me that you can use the console, create a function, and just easily send requests from the console, which will have the correct cookies, etc.

so I just grabbed this from here: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#supplying_request_options

// Example POST method implementation:
async function postData(url = '', data = {}, options = {}) {
  // Default options are marked with *
let defaultOptions = {
    method: 'POST', // *GET, POST, PUT, DELETE, etc.
    mode: 'cors', // no-cors, *cors, same-origin
    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
    credentials: 'same-origin', // include, *same-origin, omit
    headers: {
      'Content-Type': 'application/json'
      // 'Content-Type': 'application/x-www-form-urlencoded',
    },
    redirect: 'follow', // manual, *follow, error
    referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
    body: JSON.stringify(data) // body data type must match "Content-Type" header
  }

// update the default options with specific options (e.g. { "method": "GET" } )
const requestParams = Object.assign(defaultOptions, options);

const response = await fetch(url, requestParams);
  return response.text(); // displays the simplest form of the output in the console. Maybe changed to response.json() if you wish
}

IF YOU WANT TO MAKE GET REQUESTS, you can just put them in your browser address bar!

if you paste that into your console, then you can make POST requests by repeatedly calling your function like this:

postData('https://example.com/answer', { answer: 42 })
  .then(data => {
    console.log(data); // you might want to use JSON.parse on this
  });

and the server output will be printed in the console (as well as all the data available in the network tab)

This function assumes you are sending JSON data. If you are not, you will need to change it to suite your needs

Stanwinn

Answer 19

You can post requests directly from the browser with ReqBin. No plugin or desktop application is required.

Rasia