是否可以使用javascript通过POST多次发送一个变量？

Question

Let me explain why I need to do this!

I need to send a request to another server that its format is something like this:

http://www.test.ccom/process?item=1AAA&item=2BBB&item=3CCC

This URL will add 3 different items (one of each) to the result page, like this:

Item = 1AAA   Count=1
Item = 2BBB   Count=1
Item = 3CCC   Count=1

If I want to add just 3 of just one item, I should use this:

http://www.test.ccom/process?item=1AAA&item=1AAA&item=1AAA

And result page will be like this:

Item = 1AAA   Count=3

My problem is that I can't send my request using GET method (because we want to add more than 100 per item and it will cause "Request-URI Too Large" error)

I used two different methods to send this request by POST, but without success.

First I used this function:

function post_by_form(path, params) {

    // The rest of this code assumes you are not using a library.
    // It can be made less wordy if you use one.
    var form = document.createElement("form");
    form.setAttribute("method", "post");
    form.setAttribute("action", path);
    form.setAttribute("style", "display: none")

    for(var key in params) {
        var hiddenField = document.createElement("input");
        hiddenField.setAttribute("type", "hidden");
        hiddenField.setAttribute("name", "item");
        hiddenField.setAttribute("value", params[key]);

        form.appendChild(hiddenField);
    }

    document.body.appendChild(form);
    form.submit();
}

It works when I test it with different variable names (name="item"+key), but it doesn't work when I use one variable name for all the inputs.

Then I used this function to send the POST request by ajax:

function post_by_ajax(path, params_arr){
    var http = new XMLHttpRequest();
    var url = path;

    var params = "";
    for(var key in params_arr) {
        if (params != "")
            params += "&item="+params_arr[key];
        else
            params += "item="+params_arr[key];
    }

    http.open("POST", url, true);

    //Send the proper header information along with the request
    http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    http.setRequestHeader("Content-length", params.length);
    http.setRequestHeader("Connection", "close");

    http.onreadystatechange = function() {//Call a function when the state changes.
        if(http.readyState == 4 && http.status == 200) {
            alert(http.responseText);
        }
    }
    http.send(params);
}

The same result, both of this methods will return just one quantity for just one item (last one)... While we can submit a form with many input fields all with the same name, why I can not do it using these methods?! Do I have any problem in the logic?! can somebody please help me?!

Answer 1

If you're passing all variables with the same name ie: 'item' then the request handler has no way to differentiate between them. That is why you're getting only 1 element. Try renaming the elements to item1=value&item2=value&item3=value.

If you're passing 100 elements then you should definitely be using the post method. The name problem will exist for both post and get so make sure that all the items are named differently.

Answer 2

Using Firefox with the TamperData plugin, and a form that simply has four fields all specified as <input type="text" name="item"> I can see that the POST data does indeed send four variables all named "item" but with different values for each.

It is then up to the receiving server to do something sensible with that. Most systems will just use one of the four values sent (maybe the first one, or the last one) but if there's already a server that correctly handles http://www.test.ccom/process?item=1AAA&item=1AAA&item=1AAA then your adding multiple fields all named "item" should work.

If that's not the case, then you need to write something to handle that on the server end of things - no amount of javascript coding will do it. That would involve getting the whole POST body and processing it yourself, as most server-side frameworks (like I said) will generally just use one of the values.

You can use TamperData or something similar to capture the HTTP data stream and see what is actually transmitted from the javascript you have now.

---

So ultimately, the answer to your question "Is it possible sending one variable multiple time via POST using javascript?" is yes , it is possible.