HTML Form Downloading Response of POST Request - html

I am trying to use an HTML form to execute a post request. I know that in general AJAX is probably a better way to go about this, but my use case is very simple and I have to upload a file in this form submission (which is really easy just using HTML forms). Anyways, everything works, but for some reason my browser is downloading the contents of my POST request response, which I do not want to happen. I want nothing to actually occur when I submit the post request other than the post request being sent out.
Here is the HTML portion of my code:
<form enctype="multipart/form-data" action="/action" method="POST">
<input type="hidden" name="MAX_FILE_SIZE" value="30000"/>
<input type="text" name="email" id="email">
<input type="file" name="file" id="file" accept="image/*">
<input type="submit">
</form>
I am not sure that it is relevant, but I am using a Flask webserver and here is the response I am returning:
response = {"status": 200}
return Response(json.dumps(response), mimetype='applications/json')
The issue is that I keep having files downloaded from my browser with '{"status": 200}' in them.

Status : 200 indicates.
The request has succeeded.
So an OK status response is sent to the location, /action as you have mentioned in action="/action". So I'm guessing this is the view you wanted to send the POST request too.
I don't have the code for your /action view, but either :
This is not the view you intended to send it too.
It is the view you intended to send it too.
So if its not the correct view, what you can do is, use jinja templating and mention your view like this.
<form method="POST" action="{{url_for('xyz')}}">
Notice how I use the url_for() in jinja templating to specify route.
And if its the correct view, i can answer the question by seeing your code for the view called action.
Most likely what could be wrong though is,
your return function is erroneous. Check the return function again.

Related

How to find out what url HTML button submits to

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!

Capture POST response in HTML page

I am sending a form post to a third party and it is returning a page with Success if the action is done. Once I get the success page, I need to redirect user to a Thank You page. Can somebody tell me how the see if the success page is returned and redirect to another page?
<form name="abc" method="POST" action="third party url" >
<input />
<input />
</form>
... how about submitting the form and receiving response in an iframe? If you can use an iframe you'll be able to detect the change then.
the code goes like this:
<form name="abc" method="POST" action="third party url" >
<input/>
<input/>
</form>
but i am not sure how to capture the response
You won't be able to do this easily with plain javascript. When you post a form, the form inputs are sent to the server and your page is refreshed - the data is handled on the server side. That is, the submit() function doesn't actually return anything, it just sends the form data to the server.
If you really wanted to get the response in Javascript (without the page refreshing), then you'll need to use AJAX, and when you start talking about using AJAX, you'll need to use a library. jQuery is by far the most popular, and my personal favourite. There's a great plugin for jQuery called Form which will do exactly what it sounds like you want.

Batch Paged Requests

I need to retrieve the news feed for a user, and using the Graph API that returns multiple pages. I'd like to get four pages, and that's pretty slow, so I'd like to batch a request for all pages into one request using batching. I can't figure out how to batch-request multiple pages - clearly each request in the batch is dependent on the previous.
I wrote up a webpage to let me test this all out, containing the following form:
<form method="GET" action="https://graph.facebook.com">
<input type="hidden" name="access_token" value="blahblahblah">
<input type="hidden" name="batch" value="[{'method':'GET', 'name':'getnews',
'omit_response_on_success':false, 'relative_url':'me/home'},{'method':'GET',
'relative_url':'{result=getnews:$.paging.next}'}]">
<input type="hidden" name="method" value="post">
<input type="submit">
</form>
Of course, when I get a response from Facebook that requires paging, the paging.next value is a full URL and the batching functionality wants a relative_url, so my first request works and my second request returns with the paging.next URL in a "body" key.
I found a piece of facebook documentation which states that a request like the following works, where you graph.facebook.com is followed by a full URL specifying a request://graph.facebook.com/http://graph.facebook.com/me/home?_fb_url=me/home&access_token=blahblahblah"
I was surprised to find that this works, but it does when I just make that GET request to the Graph API. Unfortunately, the batching functionality does not allow me to put that full URL in the "relative_url" field - it just does that "body" thing.
Does anybody have a good way to batch requests for multiple pages? kongo09 and I were wondering this over in the facebook dev forum, but I guess that's on its way out... http://forum.developers.facebook.net/viewtopic.php?id=107098
Thanks,
-Karl
I have found a way:
You should use
"relative_url":"me/home?after={result=getnews:$.paging.cursors.after}"

Using <input type="file"> in Django

When someone clicks Submit after selecting a file with the <input type="file"> element, how do I access the contents of the file in Django?
(It seems like the request sent to the request handler has no trace of the file anywhere -- not even in request.FILES.)
Currently my template is like:
<form method="post" enctype="multipart/form-data">
<input type="file" enctype="multipart/form-data" name="file" accept="text/csv"/>
<input type="submit" value="Upload" />
</form>
View:
def HandleRequest(request):
print "**** request:", request
I don't see anything being printed about the file.
Note:
There's probably other ways to do this in Django, but I'm looking a solution using the simple input tag, and not something else (which would probably involve Javascript).
The code you posted, as it is posted, works fine. The HTML is sound (though I think the enctype on the <input> is redundant at best), and a very simple view shows an InMemoryFile after the POST. The problem must lie in something between the browser and your view. Some things to check:
Middleware.
Apache.
Nginx.
Decorators on your view.
mod_wsgi configuration.

Is there anyway to use the Imageshack API without PHP?

If I use the ImageShack API just in a form like this:
<form method="post" enctype="multipart/form-data" action="http://www.imageshack.us/upload_api.php">
<p><input type="file" name="fileupload"></p>
<p><input type="text" name="key" value="Your_Developer_Key"></p>
<p><input type="submit" value="Go"></p>
</form>
the browser gets taken to an XML doc, which has the image URL, but is no use because I'm no longer on my site. I've tried loading it in an iFrame and that works, but I can't access it because it's cross-domain.
A Http Post in jquery won't work because I can't send a file in it. I don't know any PHP so using that would take lots of time to learn & setup etc. Do I have any other options?
You mention you know Ruby on Rails.
Posting a file with Ruby is rather simple. See: Ruby: How to post a file via HTTP as multipart/form-data?