如何在jquery ajax请求的data参数内表示一个json数组？

Question

I am trying to post some data via ajax to our backend API, but the arrays within the json data get turned into weird things by jquery...for example, the backend (python) sees the jquery ajax data as a dict of two lists

{'subject': ['something'], 'members[]': ['joe','bob']} 

when it should be

{'subject':'something','members':['joe','bob']}

The HTML Form extracted from a react component:

  <div class="the_form">
    <form onSubmit={this.handleSubmit}>
      <input type="textarea" ref="members" placeholder="spongebob, patrick" />
      <input type="submit" value="Add Thread" />
    </form>
  </div>

The jquery ajax code:

$.ajax({
        beforeSend: function(xhr, settings) {
            // csrf validation
        },
        url: this.props.url,
        dataType: 'json',
        type: 'POST',
        data: {subject: "something", members: ["joe","bob"]},
        success: function(data) {
          this.setState({data: data});
        }.bind(this),
        error: function(xhr, status, err) {
          console.log(this.props.url, status, err.toString());
        }.bind(this)
});

I am able, however, to make such a request appropriately with httpie (simple http command line client):

echo '{"subject":"something", "members":["joe","bob"]}' | http  --auth test:test POST localhost:8000/api/some_page/ --verbose

What might I be doing wrong in the javascript request such that the inputs come into the server differently than expected?

Answer 1

在调用ajax函数之前尝试对对象进行字符串化

JSON.stringify({subject: "something", members: ["joe","bob"]})

Answer 2

Try this

data: {subject: "something", members: ["joe","bob"]},

Then in backend

request.POST.getlist('members[]')

IF you want to use application/json as contentType .Then try this

data: JSON.stringify({subject: "something", members: ["joe","bob"]}),
contentType: 'application/json; charset=utf-8',

In backend,

json.loads(request.body)['members']