如何解决错误:无效的JSON输入:无法反序列化启动\u数组令牌外主题的实例

如何解决错误:无效的JSON输入:无法反序列化启动\u数组令牌外主题的实例,json,reactjs,spring-boot,jpa,Json,Reactjs,Spring Boot,Jpa,我正在开发一个使用Springboot Rest API和ReactJS前端的调查应用程序,我面临着一个似乎无法解决的问题。在我的Springboot应用程序中,我有一个名为Topic的bean,其编写如下: @Entity public class Topic { @Id @GeneratedValue private Long id; private String question; @NotNull @Size(min=3, max=20

我正在开发一个使用Springboot Rest API和ReactJS前端的调查应用程序,我面临着一个似乎无法解决的问题。在我的Springboot应用程序中,我有一个名为Topic的bean,其编写如下:

@Entity
public class Topic {
    @Id
    @GeneratedValue
    private Long id;

    private String question;

    @NotNull
    @Size(min=3, max=20)
    private String topic;

    @Column(precision=4, scale=1)
    private double npm = 0;

    @OneToMany(mappedBy = "topic")
    private Set<Submission> submissions;

    public Topic()
    {
        super();
    }

    public Topic(Long id, String topic, double npm)
    {
        super();
        this.id = id;
        this.setTopic(topic);
        this.setNpm(npm);
    }

    public Long getID()
    {
        return this.id;
    }

    public void setId(Long id)
    {
        this.id = id;
    }

    /**
     * @return the topic
     */
    public String getTopic() {
        return topic;
    }

    /**
     * @param topic the topic to set
     */
    public void setTopic(String topic) {
        this.topic = topic;
    }

    /**
     * @return the npm
     */
    public double getNpm() {
        return npm;
    }

    /**
     * @param npm the npm to set
     */
    public void setNpm(double npm) {
        this.npm = npm;
    }

    /**
     * @return the question
     */
    public String getQuestion() {
        return question;
    }

    /**
     * @param question the question to set
     */
    public void setQuestion(String question) {
        this.question = question;
    }

}
在我的React应用程序中,我从以下组件类发出POST请求:

import React, { Component } from 'react';
import './Styling/createsurvey.css'

class CreateSurvey extends Component {

    constructor () {
        super();
        this.state = {
            topic: '',
            question: ''
        };

        this.handleTopicChange = this.handleTopicChange.bind(this);
        this.handleQuestionChange = this.handleQuestionChange.bind(this);
        //this.printState = this.printState.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }

    handleTopicChange(e) {
        this.setState({
            topic: e.target.value
        });
    }

    handleQuestionChange(e) {
        this.setState({
            question: e.target.value
        });
    }

    handleSubmit(event) {
        event.preventDefault();

        console.log(this.state.topic);
        console.log(this.state.question);

        fetch('http://localhost:8080/topics', {
            method: 'post',
            headers: {'Content-Type':'application/json'},
            body: {
                "npm": "0",
                "topic": "Turkey",
                "question": "How is life here",
                "submissions": {}
            }
           });


    }

    render() {
        return(
           <div>
               <form onSubmit={this.handleSubmit}>
                   <h2>Create a new Survey</h2>
                   <br></br>
                   <div className="form-group">
                        <label><strong>Enter the survery topic: </strong></label>
                        <br></br>
                        <input 
                        className="form-control" 
                        placeholder="Enter a cool topic to ask a question about"
                        align="left"
                        onChange={this.handleTopicChange}>        
                        </input>
                   </div>
                   <div className="form-group">
                        <label><strong>Enter a survey question: </strong></label>
                        <br></br>
                        <textarea
                        className="form-control" 
                        placeholder="Ask your question here. The customer will give an answer on a scale from 1 to 10."
                        align="left"
                        rows="3"
                        onChange={this.handleQuestionChange}>        
                        </textarea>
                   </div>
                   <div className="form-group">
                    <button type="submit" className="btn btn-primary">Submit Your Question</button>
                   </div>   
            </form>
           </div>
        );
    }

}

export default CreateSurvey;

有人能指出我的请求有什么问题吗?我尝试了所有形式的JSON请求格式,但似乎都不起作用。

在将序列化的主题对象发送到控制器时,您需要对身体进行字符串化JSON.stringify应该可以解决这个问题

检查下面的代码并链接到


提交是主题类下的一个集合,希望你们有反序列化提交的要求,因为我看不到任何setter-getter。您可以尝试在post json中使用“submissions”:[]而不是“submissions”:{}吗?我没有为Submission类设置任何反序列化要求。你能告诉我怎么做吗?此外,我还尝试将“提交”{}改为“提交”:[]但不起作用。是的,这解决了问题。非常感谢你!
@RestController
public class TopicResource {

    @Autowired
    private TopicRepository topicRepository;

    @CrossOrigin
    @PostMapping("/topics")
    public void createTopic(@RequestBody Topic topic)
    {
        Topic savedTopic = topicRepository.save(topic);
    }
}
import React, { Component } from 'react';
import './Styling/createsurvey.css'

class CreateSurvey extends Component {

    constructor () {
        super();
        this.state = {
            topic: '',
            question: ''
        };

        this.handleTopicChange = this.handleTopicChange.bind(this);
        this.handleQuestionChange = this.handleQuestionChange.bind(this);
        //this.printState = this.printState.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }

    handleTopicChange(e) {
        this.setState({
            topic: e.target.value
        });
    }

    handleQuestionChange(e) {
        this.setState({
            question: e.target.value
        });
    }

    handleSubmit(event) {
        event.preventDefault();

        console.log(this.state.topic);
        console.log(this.state.question);

        fetch('http://localhost:8080/topics', {
            method: 'post',
            headers: {'Content-Type':'application/json'},
            body: {
                "npm": "0",
                "topic": "Turkey",
                "question": "How is life here",
                "submissions": {}
            }
           });


    }

    render() {
        return(
           <div>
               <form onSubmit={this.handleSubmit}>
                   <h2>Create a new Survey</h2>
                   <br></br>
                   <div className="form-group">
                        <label><strong>Enter the survery topic: </strong></label>
                        <br></br>
                        <input 
                        className="form-control" 
                        placeholder="Enter a cool topic to ask a question about"
                        align="left"
                        onChange={this.handleTopicChange}>        
                        </input>
                   </div>
                   <div className="form-group">
                        <label><strong>Enter a survey question: </strong></label>
                        <br></br>
                        <textarea
                        className="form-control" 
                        placeholder="Ask your question here. The customer will give an answer on a scale from 1 to 10."
                        align="left"
                        rows="3"
                        onChange={this.handleQuestionChange}>        
                        </textarea>
                   </div>
                   <div className="form-group">
                    <button type="submit" className="btn btn-primary">Submit Your Question</button>
                   </div>   
            </form>
           </div>
        );
    }

}

export default CreateSurvey;
2020-03-03 01:15:17.862 DEBUG 17816 --- [nio-8080-exec-1] o.s.web.servlet.DispatcherServlet        : POST "/topics", parameters={}
2020-03-03 01:15:17.862 DEBUG 17816 --- [nio-8080-exec-1] s.w.s.m.m.a.RequestMappingHandlerMapping : Mapped to com.recommend.me.springboot.rest.recommendme.topic.TopicResource#createTopic(Topic)
2020-03-03 01:15:17.867 DEBUG 17816 --- [nio-8080-exec-1] .w.s.m.m.a.ServletInvocableHandlerMethod : Could not resolve parameter [0] in public void com.recommend.me.springboot.rest.recommendme.topic.TopicResource.createTopic(com.recommend.me.springboot.rest.recommendme.topic.Topic): Invalid JSON input: Cannot deserialize instance of `com.recommend.me.springboot.rest.recommendme.topic.Topic` out of START_ARRAY token; nested exception is com.fasterxml.jackson.databind.exc.MismatchedInputException: Cannot deserialize instance of `com.recommend.me.springboot.rest.recommendme.topic.Topic` out of START_ARRAY token
 at [Source: (PushbackInputStream); line: 1, column: 1]

fetch('http://localhost:8080/topics', {
            method: 'post',
            headers: {'Content-Type':'application/json'},
            body: JSON.stringify({
                "npm": "0",
                "topic": "Turkey",
                "question": "How is life here",
                "submissions": {}
            })
           })

    .then(function (response) {
    return response.json();
})
    .then(function (result) {
    alert(result)
})
    .
catch (function (error) {
    console.log('Request failed', error);
});