2016-11-18 57 views
0

如题,我尝试用reactjs POST请求到我的新的表单数据发布到轨服务器,但我在控制台得到这个:如何在Ruby On Rails中使用ReactJs发布的请求?

Started POST "/comments.json" for ::1 at 2016-11-19 02:56:47 +0800 
Processing by CommentsController#create as JSON 
    Parameters: {"author"=>"v", "text"=>"c"} 
Completed 400 Bad Request in 1ms (ActiveRecord: 0.0ms) 

ActionController::ParameterMissing (param is missing or the value is empty: comment): 
    app/controllers/comments_controller.rb:73:in `comment_params' 
    app/controllers/comments_controller.rb:28:in `create' 

控制器:

class CommentsController < ApplicationController 
    skip_before_filter :verify_authenticity_token 
    before_action :set_comment, only: [:show, :edit, :update, :destroy] 

    def index 
    @comments = Comment.all 
    end 

    def create 
    @comment = Comment.new(comment_params) 

    respond_to do |format| 
     if @comment.save 
     format.html { redirect_to @comment, notice: 'Comment was successfully created.' } 
     format.json { render :show, status: :created, location: @comment } 
     else 
     format.html { render :new } 
     format.json { render json: @comment.errors, status: :unprocessable_entity } 
     end 
    end 
    end 
    private 
    def comment_params 
     params.require(:comment).permit(:author, :text) 
    end 
end 

阵营部分

class CommentForm extends React.Component{ 
constructor(props){ 
    super(props); 
    this.state ={ 
     author: '', 
     text: '' 
    }; 
    this.handleValueChange = this.handleValueChange.bind(this); 
    this.handleCreate = this.handleCreate.bind(this); 

} 
handleValueChange(event){ 
    valueName = event.target.name; 
    this.setState({[valueName]: event.target.value}); 
}; 
handleCreate(event){ 
    event.preventDefault(); 
    $.ajax({ 
     method: 'POST', 
     data: { 
      author: this.state.author, 
      text: this.state.text 
     }, 
     url: '/comments.json' 
    }); 
    console.log(this.state.author); 
    console.log(this.state.text); 
}; 
render(){ 
    console.log(this.state) 
    return(
    <form onSubmit = {this.handleCreate.bind(this)} > 
     <label>Author</label> 
     <input type="text" placeholder="Author" value= {this.state.author} onChange={this.handleValueChange} name="author" /> 
     <label>Text</label> 
     <input type="text" placeholder="Text" value= {this.state.text} onChange={this.handleValueChange} name="text" /> 
     <input type="submit" value="Create" /> 
    </form> 
    ); 
} 

}

我不知道w^hy post会得到400个请求,并且param不见了。 我该如何解决它?

回答

2

你忘了添加标题。 和rails控制器等待你的json模式与根注释键。 也调整了网址。

params.require(:comment).permit(:author, :text) 

=======

$.ajax({ 
     method: 'POST', 
     data: { comment:{ 
       author: this.state.author, 
       text: this.state.text 
       } 
     }, 
     headers: { 
     'Content-Type': 'application/json' 
     }, 
     url: '/comments' 
    }); 
+0

我有记录表明,新的问题: '开始POST “/comments.json” 为:: 1,在2016年11月19日04 :21:36 +0800 解析请求参数时发生错误。 内容: 笔者= DD&文本= AA ActionDispatch :: ParamsParser :: ParseError(795:在 '作者= DD&文本= AA' 意外的标记):' –

+0

我删除页眉和数据使用你的代码。我成功发布数据,谢谢 –