2017-01-12 63 views
0

我正嘗試在rails中執行跨平臺請求。跨平臺請求無法驗證rails上的CSRF令牌真實性

我的HTML代碼是: -

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Title</title> 
 
    <link type="text/css" rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"> 
 
    <link type="text/css" rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css"> 
 
    <link type="text/css" rel="stylesheet" href="css/style.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
    <div class="container"> 
 
     <form class="new_batches" id="new_batch" accept-charset="UTF-8" > 
 
      <div class="well"> 
 
       <div class="form-group row"> 
 
        <label class="control-label col-md-2" for="name">Name </label> 
 
        <div class="col-md-4"> 
 
         <input class="form-control" id="name" placeholder="Enter Batch Name" type="text" > 
 
        </div> 
 
       </div> 
 

 
       <div class="form-group row"> 
 
        <label class="control-label col-md-2">Course ID</label> 
 
        <div class="col-md-4"> 
 
         <input class="form-control" id="course_id" placeholder="Enter Your Course ID" type="text" > 
 
        </div> 
 
       </div> 
 

 
       <div class="form-group row"> 
 
        <label class="control-label col-md-2">Start Date</label> 
 
        <div class="col-md-4"> 
 
         <input class=" form-control" id="start_date" placeholder="Enter Start Date" type="text" > 
 
        </div> 
 
       </div> 
 

 
       <div class="form-group row"> 
 
        <label class="control-label col-md-2"> End Date</label> 
 
        <div class="col-md-4"> 
 
         <input class="datepicker form-control" id="end_date" placeholder=" Enter End date" type="text" > 
 
        </div> 
 
       </div> 
 
       <div class="form-group row"> 
 
        <label class="control-label col-md-2">Status</label> 
 
        <div class="col-md-2"> 
 
         <input name="batch[status]" type="hidden" value="0"><input type="checkbox" value="1" checked="checked" id="batch_status"> Checked 
 
        </div> 
 
       </div> 
 

 
       <div style="margin-left: 110px;"> 
 
        <button type="submit" id="submit-button" class="btn btn-primary ">Submit</button> 
 
       </div> 
 
      </div> 
 
     </form> 
 
    </div> 
 
    <script src="bower_components/jquery/dist/jquery.min.js"></script> 
 
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> 
 
</body> 
 
</html> 
 
<script> 
 
\t $(document).ready(function(){ 
 
\t \t $.ajaxSetup({ 
 
\t \t headers: { 
 
\t \t  'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') 
 
\t \t } 
 
\t \t }); 
 
\t }) 
 
    $(document).ready(function() { 
 
     $('#submit-button').click(function() { 
 
      $.ajax({ 
 
\t \t \t  type: "POST", 
 
\t \t \t  url: "http://localhost:3000/batches", 
 
\t \t \t  beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))}, 
 
\t \t \t  xhrFields: { 
 
\t \t \t  \t withCredentials: true 
 
\t \t \t \t }, 
 
\t \t \t  data: {  
 
        batch: { 
 
         name: $("#name").val(), 
 
         course_id: $("#course_id").val(), 
 
         start_date: $("#start_date").val(), 
 
         end_date: $("#end_date").val(), 
 
         status: $("#batch_status").val(), 
 
         } 
 
\t \t \t  }, 
 
\t \t \t  dataType: "JSON", 
 
\t \t \t error: function(error) { 
 
\t \t \t \t \t console.log(error); 
 
\t \t \t   }, 
 
\t \t \t success: function(data) { 
 
\t \t \t    console.log(data); 
 
\t \t \t    return false; 
 
\t \t \t   }, 
 
\t \t \t }) 
 
     }); 
 
    }) 
 
</script>

我的後端代碼是如下: -

class BatchesController < ApplicationController 
      def new 
      @batch = Batch.new 
      respond_to do |format| 
       format.json 
       format.html 
      end 
      end 

     def create 
     @batch = Batch.new(batch_param) 
     respond_to do |format| 
      if @batch.save 
      format.json { render json: @batch, status: :created, location: @batch } 
      format.html { redirect_to @batch, notice: "Save process completed!" } 
      else 
       format.html { 
       flash.now[:notice]="Save proccess coudn't be completed!" 
       render json: @batch.errors, status: :unprocessable_entity 
       } 
       format.json { render json: @batch.errors, status: :unprocessable_entity} 
      end 
     end 
     end 

    def batch_param 
      params.require(:batch).permit(:name, :course_id, :start_date, :end_date, :status) 
     end 

end 

我也開始加入<%= csrf_meta_tag%>到myapplication.html.erb文件。

但是當我提交我的表單時,我仍然遇到以下錯誤。所以任何人都可以幫助我解決這個問題。

Started POST "/batches" for 127.0.0.1 at 2017-01-12 20:11:12 +0545 
    ActiveRecord::SchemaMigration Load (0.6ms) SELECT "schema_migrations".* FROM "schema_migrations" 
Processing by BatchesController#create as HTML 
    Parameters: {"batch"=>{"name"=>"xyz", "course_id"=>"9", "start_date"=>"2016-12-12", "end_date"=>"2016-12-14", "status"=>"1"}} 
Can't verify CSRF token authenticity. 
Completed 422 Unprocessable Entity in 13ms (ActiveRecord: 0.0ms) 

ActionController::InvalidAuthenticityToken (ActionController::InvalidAuthenticityToken): 

回答

1

如果這是有道理的,你可以刪除CSRF令牌驗證。只需添加到您的控制器

skip_before_action :verify_authenticity_token 
+0

是的它做到了訣竅...但每一次我嘗試添加記錄它的響應爲html但不響應json ...所以如何結束它 –

+0

來自跨平臺形式的數據獲取提交併獲得添加到數據庫也沒有通過json響應....而是通過html響應 –

+0

你要設置格式,默認是html。它可能只需要一個URL上的.js。 – Swards

0

在你的Ajax代碼使用的是$('meta[name="csrf-token"]').attr('content')

,這意味着你需要這樣的事情在你的頭標記

<meta content="code...=" name="csrf-token" /> 

其丟失。

您還可以使用

<input type="hidden" name="csrf-token" value="code.."> 

你的表單標籤

之間的csrf_code訪問: Rails - How to add CSRF Protection to forms created in javascript?

+0

什麼是「代碼代表 –

+0

它是從服務器 – codenut

+0

CSRF令牌如何讓一個... –

相關問題