I'm familiar with the .Net and React applications individually. What I want to do is to create a hybrid app of MVC and React for SaaS. Below are the details,
.NET MVC application for our website (can't create this in react as
it is a website and intended to use for google crawl, SEO, and all)
Once users log in using the MVC application LOGIN form, I want to redirect
them to ReactApp which is basically a portion after login
I already have a website built using MVC. Now want to load React application after successful login
Note: This needs to be run under the same domain. No redirection to sub-domain or so. Although, we can have an additional paths like /user
Questions:
Is it possible to traverse users between both applications?
Is it possible to manage the same session between the two?
Related
We have asp.net core(v3.0) Web API backend(no auth yet). A frontend is going to be a SPA(React).
A frontend basically will be an admin panel, it means the website's home page should be just the login page. We are planning on using IdentityServer4 for auth(separate project). If we create the IdentityServer4 project(MVC) it will have its own login form/page. Since opening our client website(react) login form should be opened, popout and iframe is not the way we are considering to use, what is the best way to accomplish this?
I've done some research and it seems it is possible to make our login form in react client and send the users login and password to IdentityServer4 if the client is set as ResourceOwnerPassword flow. But, it is not a secure and recommended way. I've read a lot of questions in SO and a lot of articles, but that is outdated and most of the samples are in IdentityServer4's repo is deprecated.
Questions:
Another way we are thinking is, on home page load, just redirect to the IdentityServer4 login page(MVC) and after login redirects back to our website. Is this a proper way of doing it? will the user see the redirection or it will not be much difference since the user opens our website and it seems like the home page?
What type of GrantType should I use for this case? Hybrid?
Is it possible to make a custom login page like in React?
What is the best way of implementing it?
Thanks for any advice, and my bad if the question is duplicated since I spend a couple of days to figure this out but couldn't.
Edit:
Now, IdentityServer4 with JavaScript client is available in IdneityServer4 official repositoty:https://github.com/IdentityServer/IdentityServer4/tree/master/samples/Quickstarts/4_JavaScriptClient
Also, I cloned and changed a little bit, so IdentityServer4 and WebApi are in a single project: https://github.com/Jamaxack/IdentityServerSPA
Is this a proper way of doing it? will the user see the redirection or it will not be much difference since the user opens our website and it seems like the home page?
That is recommended by redirecting user to identity provider's login page for sign-in , Resource Onwer Flow is not recommended as you said for security reasons.
What type of GrantType should I use for this case? Hybrid?
You can use Proof Key for Code Exchange (PKCE) which is already the official recommendation for native applications and SPAs . See Grant Types for more details .
Is it possible to make a custom login page like in React?
You can fully custmize the identity server's login user interface and identity management system , custmize the IdentityServer4.Quickstart.UI/ASP.NET Identity/Your own identity provider services .
In addition , ASP.NET Core 3.0 or later offers authentication in Single Page Apps (SPAs) using the support for API authorization. ASP.NET Core Identity for authenticating and storing users is combined with IdentityServer for implementing Open ID Connect :
https://learn.microsoft.com/en-us/aspnet/core/security/authentication/identity-api-authorization?view=aspnetcore-3.1
1) You can use a flow something like below
'First, load the react project. then check for the token/user object. If there is no token/user, then redirect to the MVC project from react project. You can have the login page in MVC'
2) Use Implicit grant type
3) Yes. You can make customization in MVC login page
4) In order to do that, you can use the oidc-client npm package in react project. For the identity, use the Quickstart template from identity server 4 documentation.
Here it is
Are there any examples on how to implement Azure AD with React web application the example I see include .net core examples only. Mine is pure React web application. Any suggestions?
it is ok to bundle the tenantid and clientid/application inside the react web application? would that have any security implications
We implemented similar structure as follows:
There is a webappservice, which is created from standart web application template. It handles all the authentication parts. Once user is authenticated, the web application service, serves react files with proper parameters (e.g. logged in, user token etc)
Just wondering if anybody has done this.
What I'm looking for is a full React app with access to API Controllers inside an ASP Core app that uses a layout and Identity, etc.
My reason is that I need Facebook login using .NET Cores Facebook Identity. If I was to separate the front end from the back end completely, when Facebook is authenticating the user, there is no connection between the front end and the route Facebook returns to after authentication is successful. E.G /signin-Facebook or /Account-ExternalLogin.
Thanks in advance.
I need your guidance/suggestion on the scenario I am into.
We have a legacy GWT application(version 2.7), this application has 2 controllers which implement EntryPoint class - LoginController and OTSController. These have their respective presenter and viewer.
N.B. - this GWT application runs as a spring-boot application.
This GWT application is a ui application(and there is another spring-boot application which would act as a server app). The GWT app uses default way of handling user authentication i.e. using /j_spring_security_check.
Now I am trying to re-write the Login functionality in React(and I am quite new with React). I am trying to use oauth2 for authentication, can you please point which oauth2 library I should use and is their any sample which I can look into.
I have searched for authentication for React web-app and seen examples for -
Okta Sign-In Widget
Auth0 - provides authentication-as-a-service
Stormpath React SDK
JWT(JSON Web Token)
But couldn't find any specific js library that gives oauth2 implementation(and which doesn't have much strict license obligations) that I can use in my react app, please give me pointers so I can use any existing/implement oauth2 authentication for my Login page(using react).
Thanks,
Saurabh.
You can use these two libraries from Okta for integrating authentication into a React app with Okta - #okta/okta-auth-js and #okta/okta-react. You can also checkout the guide here - https://developer.okta.com/code/react/okta_react. Hope this helps.
May be I am overcomplicating things and overthinking of a solution but this is what I am trying to accomplish:
I have an app that uses Ionic Angular JS as the frontend with multiple restful services from the backend. I am using a combination of Drupal and Yii2. Both of the apps can support Facbook login / sign up as web apps as the modules are available. Ionic app by itself can use FBLogin by using NGCordova. However, I need to do the following:
Login to Ionic app using Facebook Login.
Using this login create an account in both my Yii2 and Drupal 7 apps. (I can sacrifice one or the other if I really need to. I have two backends because I need one to store the custom logic an another for the content management.).
User should be able to create new nodes in both of the apps. (Yii2 will have a higher priority).
Any guidance will be great. Eventually I may expand FB login capability to Google ID as well.