3

I am trying to send a XMLHttpRequest with a header and add a FormData. Is there an (elegant) way i can do something like this:

var formData = new FormData();
formData.append("file", file);
var xhr = new XMLHttpRequest();

xhr.open("POST", "/ajax_gateway.php?mod=fileupload", true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded")
xhr.send(formData, "token=add");
LocalHorst
  • 1,048
  • 2
  • 11
  • 24

1 Answers1

5

You cannot specify the Content-Type header when sending FormData because that header automatically gets set to "multipart/form-data" by the browser. You can set other headers though, try this:

var formData = new FormData();
formData.append("file", file);
formData.append("mod", "fileupload");
formData.append("token", "add");

var xhr = new XMLHttpRequest();
xhr.open("POST", "/ajax_gateway.php");
xhr.setRequestHeader("X-Answer", "42");
xhr.send(formData);
idbehold
  • 16,833
  • 5
  • 47
  • 74
  • Would you mind explaining why you chose "X-Answer" as a header name ? I ask as I don't see it listed under standard or non-standard field names in this listing https://en.wikipedia.org/wiki/List_of_HTTP_header_fields Is it possible for people to enter any text string that they fancy as a header field name ? – Trunk Apr 29 '19 at 11:46
  • Non-standard header names are generally prefixed with `X-` to avoid future conflicts. I used `X-Answer` simply as an example to show that you _could_ set additional headers, just not `Content-Type`. – idbehold Apr 29 '19 at 19:54
  • 'X-Answer' is a non-standard header . . . I would have said that it was a made-up header (i.e. it has no general connotation bar what meaning the app coder may give it) except that I Googled 'setRequestHeader("X-Answer", "42")' and found 2 pages of references to code using it . . . This seems more than a coincidence! – Trunk Apr 29 '19 at 20:15
  • All headers are made up. Some of them just happen to have been standardized. – idbehold Apr 30 '19 at 14:53
  • It's hardly a case of them 'just happening' to have been standardized. There was some purpose behind the standardization. But from what you are saying that the chaps in China, Japan, etc found in my Google search under 'setRequestHeader("X-Answer", "42")' who applied this "example header" of yours did so more or less idiotically . . . – Trunk May 01 '19 at 15:48
  • "Header fields are fully extensible: there is no limit on the introduction of new field names. [...] New header fields can be defined such that, when they are understood by a recipient, they might override or enhance the interpretation of previously defined header fields, define preconditions on request evaluation, or refine the meaning of responses." - [RFC7230 §3.2.1](https://tools.ietf.org/html/rfc7230#section-3.2.1) – idbehold May 02 '19 at 14:13
  • "Answer" and "42" refers to the book, The Hitchhiker's Guide to the Galaxy by Douglas Adams, the "Answer to the Ultimate Question of Life, the Universe, and Everything", It is commonly used in text books like YDKJS – Robgit28 Jan 27 '21 at 13:24