Changing default XMLHTTPRequest which is sending after form submit - html

I have some field in form, lets say:
<FORM action="http://server.com/cgi/handle"
enctype="multipart/form-data"
method="post">
<P>
What is your name? <INPUT type="text" name="submit-name"><BR>
What files are you sending? <INPUT type="file" name="files"><BR>
<INPUT type="submit" value="Send"> <INPUT type="reset">
</FORM>
and on submission of this form is XMLHTTPrequest generated, for example:
Content-Type: multipart/form-data; boundary=AaB03x
--AaB03x
Content-Disposition: form-data; name="submit-name"
Larry
--AaB03x
Content-Disposition: form-data; name="files"; filename="file1.txt"
Content-Type: text/plain
... contents of file1.txt ...
--AaB03x--
and I want to change this request, I need to change the name and content of the file which is send. Could it be done? Is it not security issue?

I'm not sure I grasp the situation but I think you mean a normal POST request, not a XMLHTTPrequest which is specific to JavaScript (Ajax requests are based on this method).
If you are asking how to modify the request the browser sends to the server when using multipart/form-data then I am pretty sure the answer is: You can't. This is a matter completely beyond the site's control.
I also strongly doubt there is a JavaScript based way of doing this because you are using a file upload. The contents of an uploaded file are not available to the web page for security reasons, so you will have no chance of encoding that file yourself and making a raw request using XMLHTTPRequest or any other client-side method.

Related

Upload PDF File without FormData

I want to upload a PDF file but can't seem to serialize it correctly. Because of specific requirements I cannot use the FormDataAPI nor an HTML form.
I'm manually creating the multipart/form-data body like so.
------WebKitFormBoundaryFb3Biw9LyOW5jlUQ
Content-Disposition: form-data; name="username"
bill
------WebKitFormBoundaryFb3Biw9LyOW5jlUQ
Content-Disposition: form-data; name="file"; filename="test.pdf"
Content-Type: application/pdf
[object ArrayBuffer]
------WebKitFormBoundaryFb3Biw9LyOW5jlUQ--`
and sending the request via xhr.send(body) where body is my built up string. Is this even possible?
When I've tested using the FormDataAPI I can see the file as a nice big (encoded?) blob in the Chrome network request inspector. Is FormDataAPI doing something that I cannot achieve via JS?

How to tell which html element sent http request on server side?

I have registration and login form on same page and both of them are sent via POST request. How can i distinguish them in my post request handler function so that server responds accordingly. Is the element that sent request included in request body?
You need to include some sort of metadata with the request to indicate which operation is sending the information.
This could be a hidden field or just an additional bit of JSON added on the client side:
<input type="hidden" id="formID" name="formID" value="login">
<input type="hidden" id="formID" name="formID" value="registration">
Another option would be to set up different targets on your server (i.e. different paths) that each form submits to separately.

HTML Form Downloading Response of POST Request

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.

"Save as" on response from HTML form

I am working on a project where my backend returns a PDF file on a POST request, which as standard has a name, but I would like the client to be able to specify name and location of where to save the file. I am kinda lost, and all my searches end up with "html to pdf"-links, hope someone can help me.
What I do now:
<form class="pull-right" action="{{Api2PDF}}" ng-submit="generateJSON()" method="POST">
<input type='hidden' name="body" value="{{JSONBody}}">
<input type="submit" class="btn btn-primary" value="getPDF">
</form>
If you want to force download, set these response headers:
Content-Type: application/octet-stream
Content-Disposition: attachment
But this bypasses the users decision how he wants to handle PDF files in the browser. That's why I don't like that solution.

Sending files through email - multipart

I want to make a HTML document that allows the user to send files through email. I've read I have to use the "multipart/form-data".
<HTML>
<HEAD>
<TITLE>File test</TITLE>
</HEAD>
<BODY>
<FORM ACTION="mailto:user#mail.com" METHOD="POST" ENCTYPE="multipart/form-data">
Send a file
<BR><INPUT NAME="File" TYPE="file">
<BR><INPUT TYPE="submit" VALUE="Send">
</FORM>
</BODY>
</HTML>
This is a simple example that I cannot fix. What am I missing?
Edit:
The problem is that I receive the email without any content.
The mailto: URI scheme, when used for form actions, requires a combination of a compatible browser and email client. These are not so common as to be practical for use on the WWW (see also The Mythical Mailto:).
I'm not aware of any combination that supports file attachments via that scheme.
You need to use an HTTP (or HTTPS) URI with a server side form handler.
Mail will be sent successfully with your default mail client that is set-up in your machine. Make sure you have default mail client set-up. Eg: Outlook Express, Office Outlook.