2017-02-20 17 views
0

私は、VueJS 2(斧)とLaravel 5.3を使って簡単なPOSTをしようとしています。 $request->all()を印刷しようとすると、私のメソッドは常に空の配列を返します。VueJSとLaravel - 投稿要求は常に空です

私は私の刃テンプレートに次のメタタグを持っている:

<meta name="csrf-token" content="{{ csrf_token() }}"> 

私はaxiosをロードしbootstrap.jsでそれにX-CSRFタグを追加している:

window.Vue = require('vue'); 
window.axios = require('axios'); 

require('vue-axios'); 

window.axios.defaults.headers.common['X-CSRF-Token'] = document.querySelector('meta[name="csrf-token"]').getAttribute('content') 

そして、これ

<template> 
    <div class="options"> 
     <div class="save-result" @click="saveResult()"> 
      Save result 
     </div> 
    </div> 
</template> 

<script> 
    export default { 
     methods: { 
      saveResult: function() { 
       axios.post('/api/user/save-results', {'test': 'testing'}).then(response => { 
        console.log(response.message) 
       }) 
      } 
     } 
    } 
</script> 

このルートは非常にシンプルなコントローラにつながります私の要求を印刷します。これは空です。

public function saveResults(Request $request) 
{ 
    echo '<pre>'; print_r($request->all()) and die(); 
} 

私は何かが私のCSRFヘッダの設定で不足している推測しているが、私はそれが何であるかわかりません。

+0

? –

+0

Axiosのpostメソッドの2番目のパラメータとして「通常の」配列を送信していて、オブジェクトでなければならないという問題が出ています。私は以下の答えを投稿します。私はなぜこれが暗黙のうちに設定されていないのかわかりません、どんな考えですか? – Anonymous

答えて

1

私はaxiosのpostメソッドの2番目のパラメータとして配列を送信していましたが、それはオブジェクトでなければなりません。

私はECMAScriptの6ポリフィル、Object.assignを利用しました:どのようなデータが送られているかどうかを確認するには、ブラウザのコンソールでご確認ネットワーク]タブを持って

let params = Object.assign({}, this.$store.getters.params) 

axios.post('/api/user/save-results', params).then(response => { 
    console.log(response.message) 
}) 
関連する問題