I’m writing a lot of code most evenings. Here is some code I wrote in JavaScript to submit an AJAX request using multipart/form-data encoding. This is better than the more typical application/x-www-form-urlencoded encoding because data does not need to be reformatted if it contains things that are not allowed in a URL like spaces and ampersands. Spaces might be ok but the ampersands are delimiters for application/x-www-form-urlencoded data.
The PHP script on the server side is so simple that I won’t include it. It has at least one line that reads the appropriate form field in the $_POST array.
The JavaScript:
function SumbitAJAXConfig()
{
ConfigUpdateRequest = new XMLHttpRequest();
if( ConfigUpdateRequest == undefined || ConfigUpdateRequest == null )
return;
ConfigUpdateRequest.onreadystatechange = function()
{
if( ConfigUpdateRequest.readyState == 4 && ConfigUpdateRequest.status == 200 )
{
alert( "Did the update." );
}
else if( ConfigUpdateRequest.readyState == 4 && ConfigUpdateRequest.status == 404 )
{
alert( "Unable to update at this time." );
}
}
ConfigUpdateRequest.open( "POST", "updateconfig.php?t=" + Math.random(), true );
var boundary = '---------------------------' + Math.floor(Math.random()*32768) + Math.floor(Math.random()*32768) + Math.floor(Math.random()*32768);
ConfigUpdateRequest.setRequestHeader( "Content-Type", 'multipart/form-data; boundary=' + boundary );
var body = '';
body += '--' + boundary + '\r\n' + 'Content-Disposition: form-data; name="';
body += "newconfig";
body += '"\r\n\r\n';
var ConfigField = document.getElementById( "configfield" );
body += ConfigField.value;
body += '\r\n'
body += '--' + boundary + '--';
ConfigUpdateRequest.send( body );
}
This is not all my code. I got this from the internet. I am essentially duplicating someone else’s post from their blog or forum because this seems useful.
The content-length header is not written here because most browsers now reject it and figure out the value themselves. That keeps evil JavaScript from using incorrect values for nefarious purposes. I’m not sure why they bother since writing a non-client-browser program to submit incorrect data like that is trivial to an experienced programmer. Maybe they want to make sure someone doesn’t use someone else’s browser for that purpose.
If there was more than one form field to submit, each would be preceded by a boundary string and have the same formatting as the single field that I am sending.
OK, thanks for checking.
There is a little more up-to-date code and more realistic form data in this post I made more recently: https://blog.rectorsquid.com/more-ajax-and-multipartform-data/
I realize that this blog is dated 2011, but it applies to my problem and I was hoping you could help me out. From my browser code, I can upload a file using ‘enctype=”multipart/form-data”‘. I want to test whether the multipart was honored by looking to see if the server generates multiple get requests as I expect it to, or just 1 get request. I can run a sniffer on the server and see the multiple get requests, but I want to put together some client side java/ajax code that will tell me if the multipart value was honored by the server. I think your javascript might be a good starting point. Can you help me get started?
Thanks,
Andy
Andy, I am not an expert. As far as I know, the multipart/form data is an encoding method for the data sent to the server in a post operation. The alternative is URL encoding where each value is passed as a name=value pair separated by ampersands, just like sending values in a URL for a GET operation. I was not aware of the server ever getting multiple requests. Since this is an encoding scheme, you will know it worked because it worked. If you screw up the encoding or use the wrong encoding type then your PHP script on the server will not get called or it will not be able to parse the data properly.