I have a login API as seen below:

api.php

Route::post('/login', [LoginController::class, 'login']);

LoginController.php

public function login(Request $request) {
        $fields = $request->validate([
            'email' => 'required|string',
            'password' => 'required|string'
        ]);

        // Check email
        $user = User::where('email', $fields['email'])->first();

        // Check password
        if(!$user || !Hash::check($fields['password'], $user->password)) {
            return response([
                'message' => 'Bad creds'
            ], 401);
        }

        $token = $user->createToken('myapptoken')->plainTextToken;

        $response = [
            'user' => $user,
            'token' => $token
        ];

        return response($response, 201);
    }

I call this API from my Vue.js frontend component:

Script in Login.Vue

<script>
export default {
  name: 'Login',

  data() {
    return {
      user: {
        email: null,
        password: null
      },
      loading: false,
      error: null
    }
  },

  methods: {
    async login() {
      this.error = null;
      try {
        await this.$store.dispatch('login', this.user);
        await this.$router.push({ name: 'posts' });

      } catch (error) {
        this.error = error;
      } 
      finally {
        this.loading = false;
      }
    }
  }
}
</script>

store/index.js

async login({ commit }, user) {
          await repository.createSession();
          const { data } = await repository.login(user);
          commit('SET_USER', data);
          sessionStorage.user = JSON.stringify(data);
          sessionStorage.user_token = data.token;
        }

The problem is that it works only when Fiddler is also running. Without Fiddler, i dont get any errors, but i also cannot login. What could be wrong?