I have this simple web form which has just a single button so the user can open a static PDF file when they click it.
Now that I've updated the PDF file, I updated the query string timestamp cache-busting parameter so they see a new version of the file.
<form action="Path/To/My/PDF Document.pdf?v=1234" target="_blank">
<button>Get your PDF here!</button>
</form>
Well, the PDF opens up alright, but the querystring is automatically reduced to just the question mark.
What opens up is: Path/To/My/PDF Document.pdf?
This shows the original version and not the new one, and I'm wondering what is the matter with this process?
*I know method="GET" is not in my example, but it does the same with or without it.
Give this a go:
<form
action="Path/To/My/PDF Document.pdf"
method="GET">
<input type="hidden" name="v" value="1234" />
<button>Get your PDF here!</button>
</form>
Key points:
specify the method as GET
provide the query-string parameter as a hidden input, with the name set to the name of the query-string
The reason this works is because of how forms process input data.
Demo: https://jsfiddle.net/1tszbe5o/
Recommended reading for WHY this works: https://developer.mozilla.org/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data
TLDR: when you use the GET method, any form data provided with form inputs will be included in the query-string of the HTTP request resulting from the form action.
Why does it get stripped out in the first place? Because the form data was empty, hence the query-string was empty also ;)
Related
So I'm scraping a website (instacart.com) and it requires a zip code to determine what data it displays. I want to use Python requests to post an arbitrary zip code. The only problem is I don't know what url to post it to and whether it requires any other arguments like an authenticity token or a user cache key. The zip code is entered via an text box that looks like this:
<form data-radium="true">
<input id="postalcode-16749"
name="postal_code"
type="text"
aria-invalid="false"
aria-describedby=""
autocomplete="on"
placeholder=""
data-radium="true"
value="" style=(super long block of css stuff)>
</form>
and then posted via a button that looks like this:
<button type="submit"
data-radium="true"
style="touch-action: manipulation; (long block of more css)">
Continue
</button>
I don't know a lot about web programming, but I was taught in school that HTML forms would look more like this: <form action="/action_page.php" method="get"> and you could use the action attribute to find where it was posting to. Is there a way to use the developer console to find what I'm looking for? How can I post a zip code to this website with Python?
Edit: I did a little more digging and I found that the request payload is {"current_zip_code":"some_zip_code"}, and that it's actually not using POST, it's using PUT. There's still a problem though, the request url looks like this: https://www.instacart.com/v3/bundle?source=web&cache_key= and then there's a different code each time for the cache_key. How do I know what url to post to?
I'm posting this answer in case anyone tries to do a similar thing. I found the url the button posts to and its parameters by looking in the network tab of the developer console and clicking the button. Then I ran into the problem that the url it sends the PUT request to changes every time, always ending in a different cache_key.
The solution was to use a python module called seleniumwire to simulate a browser and then grab all the network traffic. From there I looped through it and found urls containing cache_key= and stored everything after that as a string. Then tacked that string to the end of this url: https://www.instacart.com/v3/bundle?source=web&cache_key= and went back to using requests.
hope this helps someone!
Can someone please tell me what happens behind the scenes in the following case (i.e. explain the whole technical process)?
<form method="get" action="#">
<input type="text" name="d" value="flowers">
<button type="submit">send</button>
</form>
In this case after one has clicks on “send” a new webpage opens saying: "You have searched for "flowers" " and an image of some flowers below.
In the browser tab right after the URL of the newly opened page there is
“/?s=flowers”. What is that?
Thank you in advance for your answers!
When you click Send, the page data specified in the form information and values is passed to the server via HTTP.
The /?s=flowers is the GET data being passed back to the server. Although, based on the form code you've provided, the "name" of that value is d. So the URL would actually have /?d=flowers
The PHP or server side language then handles that information to do specific tasks. It can access the info using the name "d". This method of sending data is called GET, there are also other ways of doing this. The most common, POST, does not display the data in the URL and send the data through HTTP headers.
The code you've shown has an action of "#" which means the HTTP method is being sent the same page. Meaning this page code would have some PHP located in it. This can also be done by using a seperate file, such as action='send.php'
following code is working but with 2 issues: It is part of bigger form on the web page it appears on.
<FORM id="my_file_upld_form"
style="display: inline;"
METHOD="POST"
ACTION="/cgi-bin/fileupload_ajax.pl"
ENCTYPE="multipart/form-data">
<INPUT TYPE="file" class="ajaxfileupload" NAME="myfile" SIZE="42">
<input type="hidden" class="ajaxfileupload" name="fileupload" value="ajax_fileupload">
<input class="ajaxfileupload" type="submit" value="Upload"/>
</FORM>
it is allowing "blank" or empty (no file selection and upload button clicked) to upload. which is causing 500 error on server.
bigger problem is: after the file is uploaded, a new blank page is opened in browser and user has to use back button to go back to the page from where this was run. This happens irrespective of the fact that the ajax script returns anything back or not.
how to fix? I am open to replace this piece of code on the page, if needed.
It's hard to tell exactly what is going wrong without your java script code. However I think I know how to fix some of your problems.
Don't trust the client you need to handle in your backend code the ability to handle a form that gives you bad data. You can validate the form client side but you always need to validate server side as well.
I suspect this problem is happening because you aren't preventing the default event in javascript. In jquery you would do
$("#my_file_upld_form").submit(function(e){
e.preventDefault()
})
I am trying to make a form in html that uses the value you enter to form the destination URL.
<form action="../search/${params.q}" method="post" id="q">
Busqueda: <input type="text" name="q" /><br />
</form>
This is what i am doing, but it does not work, any cluess? thanks!
You'd need to handle this using a script - either server-side or on the client (JavaScript).
HTML alone can't handle parameters in the way you're using them.
So you'd need to either POST the form (as you're already doing) and handle the postback by redirecting your request to the new address, or use JavaScript to capture the field's value when a submit button is clicked and loading the new address in the browser window.
I'd suggest server-side is the best option as JavaScript might be disabled or unavailable.
I have a web page which have 3 controls:
form using the post command.
in the form i have an input file control named "myFile".
a button
the upload process works just fine, until I'm trying to post the form and handle the upload in another form.
Request["myFile"] and request.Params["myFile"] gave me nothing
It's the Request.Files collection you need - look it up in the .NET Framework docs:
Request.Files["myFile"]
Also make sure that the enctype attribute of your upload form is set correctly - it should be "multipart/form-data" if the form contains file inputs.
Maybe this will help
<input type="file" size="50" id="ipFile" runat="server"/>
runat="server" gives you access tot the HtmlInputFile structure