Here is description of my app I'm working on. On the client-side (index.html) a user can interact with a data. When he needs to call a server operation for example reading or writing a file on the server, he must authenticate himself and send JS async request. The index.html and API are hosted on the same domain.
The first way I see is to pass at every request an identifier (it may be username, email or phone number), authenticator i.e. password, operation name e.g. read or write and argument i.e. file path (and file content if writing). Since we talk about async requests without reloading the page in the browser, user can type credentials only once and JS will store them in its memory until the user reloads the page (it will mean signing out). I think to store user data in JSON files above the public directory.
When a user sends an async call with the credentials, with the server operation name and the argument(s), the server verifies the user credentials, retrieves his role, sees whether the role has permission to run the passed server operation with the passed argument and if so, performs the operation. I mean one role can not run writing operation at all and can only read files, another role can write files, but only in a specific directory (i.e. specific argument) and so on. That is how I see the scenario.
I don't know authentication solutions and issues very well, so I need your useful advices. Maybe it would be better to use modern OAuth-based scheme in my case with redirect to authentication service and JWT? If so, is there a custom and fully self-hosted solution which is made like the scheme (i.e. instantiating authentication client signIn() object in JS, then using its status and tokens etc.) so that I can use it on my server without additional third-party server, but can switch to another the same solution with authentication service at anytime? Or maybe you see another better scenario for my case?
Would be thankful for any ideas, advices and information