2017-01-20 2 views
3

Когда я использую метод jQuery $.ajax() или $.post() для отправки информации о форме на сервер, строка «данные» добавляется в конец URL-адреса. Почему запрос POST становится запросом GET? Форма код, приведенный нижеПочему запрос POST становится запросом GET?

<form role="form" class="form-horizontal"> 
    <div class="box-body"> 
     <div class="form-group"> 
      <label for="name" class="col-sm-2 control-label">Name</label> 
      <div class="col-sm-10"> 
       <input type="text" class="form-control" id="name" name="name" required> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label for="hospital" class="col-sm-2 control-label">Hospital</label> 
      <div class="col-sm-10"> 
       <input type="text" class="form-control" id="hospital" name="hospital" required> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label for="url" class="col-sm-2 control-label">URL</label> 
      <div class="col-sm-10"> 
       <input type="text" class="form-control" id="url" name="url" required> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label for="version" class="col-sm-2 control-label">Version</label> 
      <div class="col-sm-10"> 
       <input type="text" class="form-control" id="version" name="version" required> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label for="description" class="col-sm-2 control-label">Description</label> 
       <div class="col-sm-10"> 
        <textarea class="form-control" id="description" name="description" rows="3" required></textarea> 
       </div> 
     </div> 
    </div> 
    <div class="box-footer text-center"> 
     <button type="reset" class="btn btn-default">Reset</button> 
     <button type="submit" class="btn btn-primary" id="submitBtn">Submit</button> 
    </div> 
</form> 

Ajax код

$("#submitBtn").submit(function(event) { 
    event.preventDefault(); 
    var info = {}; 
    info.name = $("#name").val(); 
    info.hospital = $("#hospital").val(); 
    info.url = $("#url").val(); 
    info.version = $("#version").val(); 
    info.description = $("#description").val(); 
    $.post("/nuts/add", JSON.stringify(info), function(data) { 
      console.log(data); 
     }, "json"); 
} 

URL всегда как этот

http://localhost:8080/nuts/add.html?name=1&hospital=1&url=1&version=1&description=1 

рамки My Бэкэнд Spring MVC, и контроллер код показан ниже

@RestController 
@RequestMapping(value = "/nuts/add", produces = {APPLICATION_JSON_VALUE}) 
public class AddNutsApi { 

    private MongoBasicDao<Nuts> mongoBasicDao; 

    @Autowired 
    public void setMongoBasicDao(MongoBasicDao<Nuts> mongoBasicDao) { 
     this.mongoBasicDao = mongoBasicDao; 
    } 

    @RequestMapping(value = "", produces = {APPLICATION_JSON_VALUE}, method = RequestMethod.POST) 
    public ResponseEntity<Void> addNutsPost(@RequestBody Nuts nuts) throws NotFoundException { 
     if (nuts.getName() != null && nuts.getHospital() != null && nuts.getUrl() != null && nuts.getVersion() != null && nuts.getDescription() != null) { 
      try { 
       Nuts _nuts = new Nuts(); 
       _nuts.setName(new String(nuts.getName().getBytes("ISO-8859-1"), "UTF-8")); 
       _nuts.setHospital(new String(nuts.getHospital().getBytes("ISO-8859-1"), "UTF-8")); 
       _nuts.setUrl(new String(nuts.getUrl().getBytes("ISO-8859-1"), "UTF-8")); 
       _nuts.setVersion(new String(nuts.getVersion().getBytes("ISO-8859-1"), "UTF-8")); 
       _nuts.setDescription(new String(nuts.getDescription().getBytes("ISO-8859-1"), "UTF-8")); 
       _nuts.setCreationTime(new Date()); 
       Integer mark = mongoBasicDao.getCollectionMark(Constant.COLLECTION_NUTS); 
       _nuts.setMark(mark); 
       mongoBasicDao.addObject(_nuts, Constant.COLLECTION_NUTS); 
       return new ResponseEntity<>(HttpStatus.OK); 
      } catch (Exception e) { 
       return new ResponseEntity<>(HttpStatus.BAD_REQUEST); 
      } 
     } else { 
      return new ResponseEntity<>(HttpStatus.BAD_REQUEST); 
     } 

    } 
} 

Я добавил зависимость Jackson (jackson-databind) и установил <mvc:annotation-driven/> в конфигурационном файле Spring MVC. Кстати, url-шаблон DispatcherServlet - /. Может ли кто-нибудь сказать мне, где я ошибаюсь? Большое спасибо!

+0

Попробуйте добавить 'method = RequestMethod.POST' в ваш' @ RequestMapping', а также в форме html 'method =" post "' – drgPP

+0

что такое ошибка? проверьте вкладку сети на том, что отправлено методом request/http, а также у вас есть @RequestBody Nuts, вы правильно отправляете его в качестве тела запроса ?. поделиться информацией на вкладке сети – Barath

+0

Попробуйте удалить функцию 'JSON.stringify' –

ответ

2

Когда вы вызываете JSON.stringify(info), вы получите строку JSON, например. что-то вроде этого:

{ "name": "1", "hospital": "1", "url": "1", "version": "1", "description": "1" } 

Вы наверняка не получить строку запроса, как это:

?name=1&hospital=1&url=1&version=1&description=1 

Это должно быть ваш намек, что код JavaScript является не отвечает за GET прошу Вас видеть.

Проблема в том, что вы неправильно связываете функцию отправки. $("#submitBtn").submit(...) ничего не делает, потому что <button type="submit"> не срабатывает. submit событий. <form> делает.

Что происходит, что код JavaScript игнорируется, и нажав на кнопку Submit вызовет отправке формы, и так как <form> элемент не имеет атрибута method="post", форма будет представлена ​​в виде GET.

Решение: Привязать submit(...) к <form>.

+0

Благодарим вас за очень четкое объяснение. Я привязываю sumbit (...) к элементу формы, но теперь я встретил ошибку 415 http, в которой говорится «Unsupported Media Type» :( –

+1

Поскольку вы не указали тип содержимого, что означает, что по умолчанию используется приложение/x-www-form-urlencoded; charset = UTF-8', но вы фактически отправляете 'application/json'. Используйте' $ .ajax' вместо '$ .post', поэтому вы можете установить' contentType' , – Andreas

Смежные вопросы