How to pass POST parameters via URL in browser address bar

Question

One can figure out from a webpage the parameters used for a POST request, e.g. How to view the address of the POST request made when an HTML button is clicked?

Is this possible for POST method to enter the url with parameters in the address bar or maybe from the debugger console?

For get request, one inserts a ? between address and parameters, e.g.

https://www.w3schools.com/action_page.php?fname=Albert&lname=Einstein.

(The analog post form calls the same script.)

You can only use GET with params in the address bar. You need to use POSTMAN if you want to make a post call. — arunmmanoharan, Mar 30 '20 at 22:12
Its an application with which you can test post calls by setting up request body. Try it — arunmmanoharan, Mar 30 '20 at 22:17

Fraser · Answer 1 · 2020-03-31T08:18:11.677

Sure it is possible for POST method to pass parameters in the address.

Set up a form to POST with an action /foo?bar=bat and the server will get POST form parameters and the query string parameters.

It would be trivial to create the action dynamically so that the query string in the action contains the form parameters. For example - here the when the form is submitted the POST data is appended to the query string before the form is posted via ajax. So you get the post parameters both in the URL and in the body data.

html

<!DOCTYPE html>
<html>
  <body>
    <form action="/something">
      <label for="fname">First name:</label><br>
      <input type="text" id="fname" name="fname" value="John"><br>
      <label for="lname">Last name:</label><br>
      <input type="text" id="lname" name="lname" value="Doe"><br><br>
      <input type="submit" value="Submit">
    </form>
  </body>
</html>

js

$("form").submit(function(e) {
  e.preventDefault();
  let f = $(e.currentTarget);
  $.ajax({
    type: "POST",
    url: `${f.attr("action")}?${f.serialize()}`,
    data: f.serialize(),
    success: function() {
      //success message maybe...
    }
  });
});

That said this is probably not a good idea at all.

But in that case, there won't be POST parameters in the request, only query params. — Oleksandr Kovpashko, Mar 30 '20 at 22:33
@OleksandrKovpashko - As I said - it would be trivial to create the action dynamically so that the query string in the action contains the form parameters. — Fraser, Mar 30 '20 at 22:42
For the record http://vizier.u-strasbg.fr/viz-bin/VizieR-2/foo?isource.value=Gaia will not work. — Friedrich -- Слава Україні, Mar 31 '20 at 01:27

score 0 · Answer 2 · answered Mar 31 '20 at 01:21

Here is my javascript solution.

E.g. the form on http://vizier.u-strasbg.fr/viz-bin/VizieR requires post.

The following command can be run in the debugger console. It manipulates one input field.

form=document.getElementsByName("form0")[0]; form.isource.value="Gaia";
form.target="_blank"; form.submit()

The url is already inherited from form.action.

score -1 · Answer 3 · answered Mar 30 '20 at 22:19

-1

It's not possible.

The POST params can be passed only via the request body.

You can use some kind of API client tool such as Postman, Paw or just use plain curl.

answered Mar 30 '20 at 22:19

Oleksandr Kovpashko

764
4
11

or you can just use method="POST" on the form – DCR Mar 30 '20 at 22:22
Is there a javascript possibility, so that it can be executed from the browser debugger command line? – Friedrich -- Слава Україні Mar 30 '20 at 22:27
Yes, but it's not quite handy when you often need to test your API. – Oleksandr Kovpashko Mar 30 '20 at 22:27
1

@Friedrich yes off course. See https://developer.mozilla.org/docs/Web/API/Fetch_API/Using_Fetch or https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest – Oleksandr Kovpashko Mar 30 '20 at 22:31
I found this one: https://stackoverflow.com/questions/5684303. I was hoping for a online. – Friedrich -- Слава Україні Mar 30 '20 at 22:51

How to pass POST parameters via URL in browser address bar

3 Answers3