Reactからapiサーバーのデータを取得できない

Question

前提・実現したいこと

Reactのaxiosを用いてAPIサーバーからjsonを取得したい。
フロントエンド：React.js
バックエンド：Laravel

API側でログインしている時のみJSONを返すようにしたいため、Laravelのルーティングでミドルウェア（auth）を利用。

発生している問題・エラーメッセージ

apiをブラウザから叩くと正常に表示されるが、Reactのaxios経由だと下記のエラーになってしまう。

404 not found もしくは 401 (Unauthorized)

\Auth::check();
``` でtrueが返ってくることは確認済みになります。

### 該当のソースコード
**API(Laravel)**
routes/web.php

Route::group(['prefix'=>'v1','middleware'=>['auth']],function(){

Route::group(['prefix'=>'movie'],function(){
    Route::get('/contents', 'MovieController@contents');
    Route::get('/addContents', 'MovieController@addContents');
    Route::get('/{id}/getChapter', 'MovieController@getChapter');
    Route::get('/{id}/getReview', 'MovieController@getReview');
    Route::post('/postReview', 'MovieController@postReview');
    Route::get('/review/commit', 'MovieController@reviewCommit');
    Route::get('/{id}', 'MovieController@detail');
    Route::get('/list', 'MovieController@index');
});

**React**

import axios from 'axios';
const host = window.location.protocol + '//api.' + window.location.hostname ;
const path = window.location.pathname

export const getIndex = nowId =>
axios
.get(host + '/v1/movie/' + nowId, { })
.then((results) => {
const status = results.status
if(typeof result === 'undefind'){
return status
}
const indexDatas = results.data[0]
return indexDatas
}).catch(
error => {}
);

### 試したこと
'middleware'=>['auth']を外してみるとうまく取得ができます。

### 補足情報（FW/ツールのバージョンなど）

php7.0
Laravel ：5.5.28

React：1.6.2

###追記
本文に漏れていましたが、認証はAuthを使ったログイン認証を用いております。
その際にフロント（React）側から送るリクエストヘッダーは COOKIE が正しい値になりますでしょうか？
API側はこのように分岐しております。
```ここに言語を入力
 protected function unauthenticated($request, AuthenticationException $exception)
       {
           if(!Auth::check()) {
               return response("unauthorized.", 401);
           }else{
              return response('true', 200);
          }
>     }

Answer 1

axios から api リクエストするときに適切なヘッダーが適用されてないため 401 (Authorization Required) エラーが出ていると思います。

X-Token と YOUR_TOKEN はプロジェクトによって変わります。

axios.get(`${host}/v1/movie/${nowId}`, {}, {
  headers: { 'X-Token':  'YOUR_TOKEN' },
});

Comments

[alberorana]

さっそくのご回答ありがとうございます。
おそらく認証に必要な情報だと思いますので、一度調べて実装してみます。
ご回答ありがとうございました。