Access Token in REST API using Passport

I stucked in a logic & unable to find till yet that how to resolve it. Please find the below details for the same:

I am developing an application in Laravel 7. In this laravel section i have developed:

1. Admin section using the Laravel's AUTH module with bootstrap 4.
2. Developed REST API using Passport package. (The point to be noted in the API's, that these API's will be consumed via cross-domain by our external users or clients) .

Access Token is generated perfectly on the basis of Unique Client Id & Secret Key which we are providing to each clients specifically.

Now comes to the part where external users trying consuming our API's built under the LARAVEL 7 using Passport authentication. Please find the steps:

1. Client is using pure jQuery (3.x) & JavaScript to achieve it.
2. Client hits the login API by using Client Id & Secret Key via jQuery Ajax.
3. After validating the keys we return the token value to the client.

Post getting the Bearer Token, client able to access the other secured data via API's by setting that Bearer token at header in AJAX. Client consuming our API's via jQuery AJAX only.

The problem arises when client refreshes the web page. As client refreshes the web page the client won't be able to retain the received token. As client is already authenticated and received the token in the 2&3 step, but as client refreshes the web page client won't be able to find that generated access token.

So, is there any way we maintain the same token, instead of generating the new token each time without revoking the last generated access token, when client refreshes the web page. Shall we maintain that token using session cookies i.e.; it retains the token value until client closes the browser. .

Kindly help if anyone have idea to do that.

Thanks