如何通过react.js制作POST请求？

问题描述：

我试图通过反应使POST请求调用，但我得到错误。如果任何机构知道帮助我，请协助我，我必须改变。如何通过react.js制作POST请求？

错误是：{timestamp：1510396949738，status：415，error：“Unsupported Media exception：”org.springframework.web.HttpMediaTypeNotSupportedException“，message：”Content type'multipart/form-data; boundary = ---织网... daryTY6125I1exH8Ry7f;字符集= UTF-8' 不支持”，......}

我在这里的阵营代码：从fetch#post要求

import React from 'react'; 
import RaisedButton from 'material-ui/RaisedButton'; 
import TextField from 'material-ui/TextField'; 
const style = { 
    margin: 15, 
marginLeft: 600 
}; 
export default class Register extends React.Component { 
    constructor(props) { 
    super(props); 
    this.onSubmit=this.handleSubmit.bind(this); 
} 
handleSubmit(e) { 
    e.preventDefault(); 
    var self = this; 


    var data = new FormData(); 
    const payload = { 
    id: self.refs.id.getValue(), 
    studentName: self.refs.sname.getValue(), 
    age: self.refs.age.getValue(), 
    emailId: self.refs.emailId.getValue() 
}; 
data.append("myjsonkey", JSON.stringify(payload)); 

fetch('http://localhost:8083/students/', { 
    method: 'POST', 
    headers: { 
    'Accept': 'application/json' 
    }, 
    body: data 
    }) 
    .then(function(response) { 
     return response.json() 
     }).then(function(body) { 
     console.log(body); 
     }); 
    } 

render() { 
    return (
     <form onSubmit={this.onSubmit}> 
     <div style={style}> 
     <TextField ref='id' 
     hintText="Enter Student id" 
     floatingLabelText="id" 
     /> 
     <br/> 
     <TextField ref='sname' 
     hintText="Enter your Last Name" 
     floatingLabelText="StudentName" 
     /> 
     <br/> 
     <TextField ref='age' 
     hintText="Enter your Age" 
     floatingLabelText="age" 
     /> 
     <br/> 

     <TextField ref='emailId' 
     hintText="Enter your Email" 
     floatingLabelText="emailId" 
     /> 
     <br/> 
     <br/> 
     <input type="submit" /> 


     </div> 
      </form> 


    ); 
    } 


}

正如错误消息所示：_UserAlreadyExistException_。这不是问题吗？ – mersocarlin

@mersocarlin不，这不是问题，但默认显示该消息。 –

你为什么使用参考？它是depricated，相反，你应该[传递函数的参考]（https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element） –

答

的body缺少

body应在你的case.Or FormData实例可以是其他类型的实例一样ArrayBuffer，Blob/File ..等

var data = new FormData(); 
const payload = { 
    id: self.refs.id, 
    studentName: self.refs.sname, 
    age: self.refs.age, 
    emailId: self.refs.emailId 

}; 
data.append("myjsonkey", JSON.stringify(payload)); 

fetch('http://localhost:8083/students/', { 
    method: 'POST', 
    body: data 
})

欲了解更多你Fetch。

@RIYAZ KHAN现在我得到了“状态：415，错误：”不支持的媒体类型“，请你看看一次 –

如何通过react.js制作POST请求？

相关推荐