私は、認証ミドルウェアを使用してAPIルートから最新の問題を取得するために、Vueを使用してajaxリクエストを作成しようとしています。私は認証をチェックせずに動作させることができましたが、認証をチェックし、リクエストを作成しているユーザーIDも取得する必要があります。私は現在これを持っています。 マイビュー:Laravel AJAXルートへのリクエストVueエラー
<script type="text/javascript">
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
</script>
<script src="/public/js/adminApp.js"></script>
<template id="messages-template">
<div>
<ul class="menu" v-for="messages in list">
<li><!-- start message -->
<a href="#">
<div class="pull-left" style="margin-left: 9px;margin-right: 9px;">
<i class="fa fa-pencil"></i>
</div>
<h4>@{{ messages && messages.name }}
<small><i class="fa fa-clock-o"></i> 5 mins</small>
</h4>
</a>
</li>
</div>
</div>
</template>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script type="text/javascript" src="/public/js/messages.js">
</script>
マイapi.phpルート:
<?php
use Illuminate\Http\Request;
/*
|--------------------------------------------------------------------------
| API Routes
|--------------------------------------------------------------------------
|
| Here is where you can register API routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| is assigned the "api" middleware group. Enjoy building your API!
|
*/
Route::group(['middleware' => ['auth:api']], function() {
Route::get('/test', function (Request $request) {
return App\issue::latest()->get();
});
});
マイmessages.jsのVUEスクリプト:
Vue.component('messages', {
template: '#messages-template',
data: function(){
return {
list:[]
};},
created(){
$.getJSON('/api/test', function(messages){
this.list = messages;
}.bind(this))
}
});
new Vue({
el: '#messagesArea'
});
は、私は現在、取得エラーメッセージが401で、ルートがあります返品する:{"error":"Unauthenticated."}
このルートが属しているグループに 'auth:api'ミドルウェアを指定しました。おそらく、要求のある種類のトークンを期待しているでしょう。あなたは1つを提供していないので、認証できません。 –
私は:$ .ajaxSetupは、メタからトークンを取得する必要があると思っていました。なぜなら、それは私が@ ZacBrownのどこにあるのでしょうか。 – RPSystems
ああ、そうです。ごめんなさい。それを捕まえていない。私は@ asemahleの答えはあなたが探しているものだと思う。 –