0

I am currently trying to design a new web-application for a rest-api service I have running. In basic I am trying to realize the login/logoff system. For authorization-management the API provides three endpoints:

  • /login, which takes username and password via a POST request and returns a token embedded in a json answer. This token is not a JWT, but its some arbitrary unique string. It is valid for X hours and everytime it used it is reset to be X hours valid again. The validity is check on the server in each request.
  • /logout, which makes the token invalid on the server.
  • /validate, which takes a token as json in POST request and checks if it is valid. If not it returns a 401.

Now I realized a login procedure following https://www.digitalocean.com/community/tutorials/how-to-add-login-authentication-to-react-applications . The application finally should used the react-router to provide the different pages. My problem is not how to integrate the validation of the token on each page change and if a 401 is returned, switch to the login page again.

PS: The server is written in C++ and accesses a custom database.

Improve this question

1 Answer 1

Reset to default
1

As Suggested By You That You Want To Integrate Validation, So You Need To Create A Component Over The Current Route Component.

It would serve as the private Route and as soon as you get a 401 Response From Your Server You Would Redirect To The Login Page By Updating the Token as empty depenedending upon the storage you are using i.e. session storage or localstorage.

This way whenever your token expires the next request responds with 401 and you are logged out.

Further I am Linking An Example Gist For Creating Private Routes And Logging Out https://gist.github.com/EduVencovsky/f8f6c275f42f7352571c92a59309e31d

Improve this answer
Sign up to request clarification or add additional context in comments.

6 Comments

In general that sounds good. A small questuion what is in your ../services/auth module ? Since I am normally a C/C++/Fortran programmer, it is a bit hard for me to think in the JavaScript world. And I am still not aware of all the features that are available.
yes please ask any further doubts you have
that file contains functions for login signup basically the api request you will make those are extracted into a file and imported into the context of the react application so that you can check the authentication and logout the user from any component of your react app . i am linking one more link here the route is made without using context medium.com/@thanhbinh.tran93/…
as synchronous or asynchronous calls?
these are synchronous calls as you can not let any other thing run under the private component till the time you know that the user has the permission you can further make more over these private routes and set them restricted for specific users
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.