User authentication with ASP MVC and React

Question

In C# and with claims it is easy to set up a login system. I am wondering how to correctly do it with React and C# as a back-end?

Do I have to send login and password from React's form with an xmlhttp post request and check if it exist? Should I then setup claims and then what? Send and ID as a JSON result back and save it to my local storage? This makes no sense to me since there are claims already. Or should I check if there are any claims on every refresh, and if there are, send back at least the ID to React's view?

Any ideas?

Answer 1

The common authentication for SPAs and REST backends nowadays is bearer token. See RFC 6750. A common extension on the bearer token is JWT (JSON Web tokens). The linked page has links to many JWT .Net libraries, like System.IdentityModel.Tokens.Jwt.

Your app should display a login form then do a REST POST on an authentication endpoint to obtain the JWT token. Then token can contain anything you wish, including IDs and claims. The next step is to make sure your SPA injects the token in every single request it makes, in order to be authenticated by the back end. This, of course, is entirely dependent on how your app interacts with the back end, since 'react' does not address that part. For example, for Redux see this.