loggin issue with ajax and laravel

Whey I login in laravel with ajax , i get success response, and after that i make a get request from the success section by calling a methode to fetch some shops data, then it redirect to the login page (like if I am not logged in) In postman this works perfectly even weather my routes are inside or outside the auth middleware ( I'm using external single html file instead of laravel views ) Here is my code : 1 - api.php

Route::post('login', 'Auth\LoginController@login');
Route::get('logout', 'Auth\LoginController@logout');
Route::post('register', 'Auth\RegisterController@register');
Route::group(['middleware' => 'auth:api'], function () {

    Route::get( 'shops/likedshops/', 'ShopUserController@liked_shopes' );

    Route::resource( 'shops', 'ShopController', [
        'except' => [
            'create',
            'store',
            'edit',
            'update',
            'destroy'
        ]
    ] );

    Route::resource( 'shopusers', 'ShopUserController', [
        'except' => [
            'create',
            'show',
            'edit',
            'destroy'
        ]
    ] );
});

2 : ShopUserController.php

<?php
 namespace App\Http\Controllers;
 use App\Jobs\DeleteDislikedShop;
 use Illuminate\Http\Request;
 use App\ShopUser;
 use App\User;
 use Auth;
 class ShopUserController extends Controller
 {
      // .... 
      public function liked_shopes(){
         $user_id = Auth::user()->id;
         $user = User::find($user_id);
         $shops = $user->shops()->where('is_liked', 1)->paginate(12);
         return response()->json(compact('shops'));
      }
  }

3 : app.js for my html file

$('.form-signin').on('submit',function (e){
    var email = $('#email-log').val()
    var password = $('#pass-log').val()       
    e.preventDefault(); 
    login(email, password); // <--------- Login
    return false;
});

function login(email, password) {
    $.ajax({
        method: 'POST',
        url: 'http://127.0.0.1:8000/login',
        data: {'email': email, 'password': password},
        success: function(response){
            localStorage.setItem('token', response.success.token);
            preferred_shops();  // <--------- Login
        },
        error: function(jqXHR, textStatus, errorThrown) { 
            alert('Email and/or Password Incorrect');
            console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
        }
    });
}
function preferred_shops(page_number = 1) {
    $('#preferred-shops').remove();
    $('#nearby-shops').remove();
    $.ajax({
        method: 'GET', 
        url: 'http://127.0.0.1:8000/shops/likedshops',
        data: {'page' : page_number},
        headers: {"Authorization": localStorage.getItem('token')}, // This isn't helping
        success: function(response){
            var data = response.shops.data;
        },
        error: function(jqXHR, textStatus, errorThrown) { 
            console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
        }
}

4 - I added this in VerifyCsrfToken class

protected $except = [
        'stripe/*',
        'http://127.0.0.1:8000/*',
    ];