Unable to get api server data from React

Premise · What you want to realize

I want to get json from API server using React's axios.

• Front end: React.js
• Back end: Laravel5.5

The authentication method uses Laravel default AUTH.

Since we want to return JSON only when logging in on the API side, we use middleware (auth) with Laravel routing.

Problems occurring · Error messages

If you hit api from the browser, it will be displayed normally, but if you go through React's axios you get the following error. 401 (Unauthorized)

It can be taken by accessing from the browser

Source Codes

■React.js

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, {
      headers: {
        'Accept': 'application/json',
       },
     })
    .then((results) => {
      const status = results.status
      if(typeof result === 'undefind'){
        return  status
      }
      const indexDatas = results.data[0]
      return  indexDatas
    }).catch(
    error => {}
);

■Laravel (API)

・/routes/web.php

Route::get('/auth/login/{token}', 'Auth\LoginController@auth');
Route::get('/auth/logout', 'Auth\LoginController@logout');
Route::get('/v1/sidemenu', 'ChallengersController@sidemenu');

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

    // Podcast
    // =======
    Route::group(['prefix'=>'audio'],function(){
        Route::get('/list', 'PodcastController@index');
        Route::get('/{id}', 'PodcastController@detail');
    });

    // Lecture
    Route::group(['prefix'=>'lecture'],function(){
        Route::get('/', 'LecturesController@index');
        Route::get('/{id}', 'LecturesController@show');
        Route::get('/{id}/schedules', 'LectureSchedulesController@index'); 
    });
});

・/config/auth.php

'guards' => [
    'web' => [
        'driver' => 'session',
        'provider' => 'users',
    ],

    'api' => [
        'driver' => 'token',
        'provider' => 'users',
    ],
],

Is the solution to this problem to give authentication information to the header of the request side (React's axios)?

Then, what kind of things should be put in the header? I tried putting the same thing as the figure below, but it did not move.

API Header

    axios
    .get(host + '/v1/movie/' + nowId, {
      headers: {
        'Accept': 'application/json',
        'Set-Cookie': 'laravel_session=eyJpdiI6IitBVldGM0VORzFZRk1ick1IY2Z5d1E9PSIsInZhbHVlIjoiT3JPeUVHc3BSaE5vRXF0KzB3N2xXRkdXb0xwMDVvS0RZR1VQM0xmMFkySnNrS01KRHVXMTFWNVhTU1wvMTVwa3RDRmNvajVMZGhiU2t4dFEzY1FxdkFnPT0iLCJtYWMiOiJjMjJhYWQ3ZjczMDgwOTExZDI5Njc5OTY4YTg5ZjgxMGI1MDlmYmNkZDJkZTFmNDA5YWMyZjRjOTYxYzc0YzNlIn0%3D;'
       },
     })
    .then((results) => {
      const status = results.status
      if(typeof result === 'undefind'){
        return  status
      }
      const indexDatas = results.data[0]
      return  indexDatas
    }).catch(
    error => {}
);

via Chebli Mohamed