AxiosError 'Request failed with status code 500' after upgrading to PHP 8.x and Laravel 9.x

I am trying to upgrade the version of my project's PHP to 8.2 and the version of my Laravel to 9.x.
The old versions were PHP 7.3 and Laravel 8.x. Before upgrading everything worked as expected.
After upgrading to the said versions I encountered a problem with some of my API Calls.

The problem is currently happening locally for me, didn't try to upload it to the server. Sometimes (but not always), random API calls I have in my project are returning the following error:

AxiosError {message: 'Request failed with status code 500', name: 'AxiosError', code: 'ERR_BAD_RESPONSE', config: {…}, request: XMLHttpRequest, …}
code: 
"ERR_BAD_RESPONSE"

config: 
{transitional: {…}, adapter: Array(2), transformRequest: Array(1), transformResponse: Array(1), timeout: 0, …}

message: 
"Request failed with status code 500"

name: 
"AxiosError"

request: 
XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}

response: 
{data: '{\n    "message": "Server Error"\n}{\n    "message": "Server Error"\n}', status: 500, statusText: 'Internal Server Error', headers: AxiosHeaders, config: {…}, …}

stack: 
"AxiosError: Request failed with status code 500\n    at settle (webpack-internal:///./node_modules/axios/lib/core/settle.js:24:12)\n    at XMLHttpRequest.onloadend (webpack-internal:///./node_modules/axios/lib/adapters/xhr.js:120:66)"

[[Prototype]]: 
Error

This is what I receive in my console. The network tab just says: "message": "Server Error"

I'll mention:

I'm using Vue 2 as my frontend and PHP/Laravel as my backend.
My API calls are made with axios package.
I'm on a Windows 10 OS and I'm using XAMPP.
My IDE is Visual Studio Code if that matters.

I know the error I mentioned doesn't say too much probably and it sounds just like some general server error, but what could be the cause?

The upgrades did work fine, and I made sure I'm at PHP 8.2 with the command php -v.

I adjusted all the config files such as php.ini, httpd.conf, etc. (I can upload them if its needed).

One last thing I'd like to mention is that for some weird reason, when I use the Xdebug to debug my project and place breakpoints in the start of every controller function (the direction to where my API call goes in the backend) - The errors are never appearing. But this is obviously not a solution since I don't want to fill all my backend functions with breakpoints and have the Visual studio pop up every API call.

EDIT: After looking at the Laravel log I saw the following: "production.ERROR: No application encryption key has been specified.". After a look I found the solution to use the following commands: php artisan key:generate, php artisan config:cache. They caused a different error, the very first API call of my project bugs out - .env file became none readable anymore after the commands. a code row like: "env('OKTA_CLIENT_ID')" returns null now instead of the actual value.

Any help will be appreciated, Thanks.

Solution

SOLVED!

The error: production.ERROR: No application encryption key has been specified was solved by using the command: php artisan config:cache.

".env file became none readable anymore after the commands" was fixed with the command php artisan config:clear.

Afterwards, in order to fix the repeating issue every time I cleared the browser cache what I did was adding the 2 following lines to my UserController.php file, a part of that file is being called only when the user is a new user or when the configuration has been reseted. the lines are:

Artisan::call('config:clear'); Artisan::call('config:cache');

That way, those lines will only run after a browser cache clean or when a new user logs in the website, seemed to work perfectly and fix all the problems.