-1

I have a problem with the @requestbody annotation of spring.In fact I can not recover and convert the data of my form. I have this exception:

There was an unexpected error (type=Unsupported Media Type, status=415).
Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported

I'm using version 1.5.8 of spring boot

Here is my spring code :

    @RequestMapping(value = "/insert",method = RequestMethod.POST,consumes = MediaType.APPLICATION_FORM_URLENCODED)
public void createType(@RequestBody Type type) {
     typeService.createType(type);
}

I tried without @RequestBody, it does not work too.

And here is my html using vuejs and axios :

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Getting Started: Handling Form Submission</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <div id="app">
    <h1>TEST FORM</h1>
     <form action="#" method="post">
        <p>Type description: <input type="text" v-model="description"/></p>
        <li v-for="some in someData"> {{ some }} </li>
        <p><button v-on:click="addType()"> Send </button><input type="reset" value="Reset" /></p>
    </form>
    </div>


    <script src="http://cdn.jsdelivr.net/vue/1.0.10/vue.min.js"></script> 
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

      <script>
        Vue.prototype.$http = axios;
        new Vue({
            el:'#app',
            data:{
                description:'',
                someData:[]
            },
            methods:{
                addType(){
                    this.$http.post('/types/insert',{description:this.description}).then(response => {
                        this.someData:response.data;
                    });
                }
            }
        });
      </script>
</body>
</html>

thank you in advance...

kasko
  • 131
  • 1
  • 4
  • 14
  • Possible duplicate of [application/x-www-form-urlencoded and charset="utf-8"?](https://stackoverflow.com/questions/16819502/application-x-www-form-urlencoded-and-charset-utf-8) – tkruse Dec 21 '17 at 02:07
  • Also see https://stackoverflow.com/questions/34782025/http-post-request-with-content-type-application-x-www-form-urlencoded-not-workin/38252762#38252762, https://stackoverflow.com/questions/33796218/content-type-application-x-www-form-urlencodedcharset-utf-8-not-supported-for – tkruse Dec 21 '17 at 02:08
  • I have already visited this post but it does not solve my problem. – kasko Dec 22 '17 at 01:50

1 Answers1

0

You client calls with Type application/x-www-form-urlencoded;charset=UTF-8, should only use application/x-www-form-urlencoded.

Maybe you can do this in your html:

const config = { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } };
this.$http.post(
   '/types/insert',
   {description:this.description}).then(response => {
                    this.someData:response.data;
                },
   config);

Maybe you can also try

@RequestMapping(... @consumes = "application/x-www-form-urlencoded;charset=UTF-8")

But that looks like a bad solution, even if it works.

tkruse
  • 10,222
  • 7
  • 53
  • 80
  • Hello, i don't understand your response.how can I do that? – kasko Dec 22 '17 at 01:53
  • I am not a vuejs expert, but somewhere you need to change the contenttype used. Maybe look here: https://github.com/axios/axios/issues/362 – tkruse Dec 22 '17 at 01:56
  • I added some code suggestions you can try out. Modify your question if you find out more. – tkruse Dec 22 '17 at 04:59