Loopback facebook login - authentication

I trying to implement login facebook by using Loopback as API,
Following http://loopback.io/doc/en/lb3/Tutorial-third-party-login.html
and https://github.com/strongloop/loopback-example-passport I can't apply the tutorial to my case because at the example,
client side and server side are on the same project.
My app:
Web application (NextJS custom express server)
example endpoint: www.myapp.com
User click login by facebook button to get access_token after that send to API.
API application (Loopback)
example endpoint: www.api-myapp.com
API get access_token from client then fetch data from facebook graph API.
If email is existed then auto-login and return token to the client.
Else register a new user and return token to the client.
From the following flow, I can't implement this flow by using Loopback :(
I can register/login via username and password in a normal case but I confusing to register/login by facebook login.

This behavior would be very easy to implement using Loopback. Assuming you are following the third party login documentation, you would simply:
Enable facebook-passport authentication.
Create a button in your frontend for "login with facebook" which redirects the user to the authpath (ie http://<api-server>/auth/facebook).
Set the successRedirect to http://<app-server>/<post-login-url>.

Related

React Native on Web for développement : How send credential cookie

I am developing a React Native apps that use a .net core web API back end.
When I develop, I would like to use the web interface that I get when I type :
expo start --web
This command open this url : http://localhost:19006
My back end listen on : http://localhost:51186
I configure my back end to allow CORS (Cross Origin Request).
I can do some GET and POST request and I work fine since I don't need to be authenticated.
I can call Login api with success but after this step, I can not access to authenticated url.
I have the same problem if I replace localhost by my IP (192.168.x.x).
If I do the same with postman or with my phone, that work fine.
If i look the login response, the back office send a cookie (.AspNetCore.Identity.Application)
I also examined the request send to my back office and it did not contain this credential cookie.
Without this credential cookie, the back end refuse to send the desired resource and redirect me to login page.
How can I send this cookie ?
Is there another way to get authenticated url ?
Thank you for any help

FusionAUth : How to merge user signup + sign in FusionAuth, to make user Auto login to web application

We are trying FusionAuth & looking to have a single step flow for Sign up + Sign In.
After user signs up, we want to show/land him directly to our application's dashboard page (without showing him login page in between the flow). The authentication should happen but internally i.e we are expecting OAuth2 standard IdToken in response to "WebApplication" so that web application can use IdToken to allow user to application.
Please note that we don't want to use approaches where we need to pass Username/password to our web application, don't want to handle user credentials. Also that we dont want to use Authentication Tokens returned in Registration flow because AuthenticationTokens are not that secure, looking to use OAuth2 based IdToken instead.
I have came across this post "https://fusionauth.io/community/forum/topic/165/taking-a-user-directly-to-the-registration-page/3" and tried following request, but it is showing Login page instead of registration.
/oauth2/register?client_id=<Configured_client_id>&redirect_uri=<Configured_redirect_uri>&response_type=code
(I have not used CSRF parameter though)
Please can you suggest why its showing Login Page?
You should be able to have a user register and be sent directly to your application, as long as you set the correct redirect_uri and put that on the registration URL:
https://local.fusionauth.io/oauth2/register?client_id=c50329fa-93e5-4618-8d9f-73d0ab069a23&response_type=code&redirect_uri=https%3A%2F%2Fapp.example.com%2F
The application will then receive a code that can be exchanged for an access token. You can call the userinfo endpoint with that token and get user information like email address, etc.
What you won't get that it seems like you might want is an id token. For that you'll have to send the user through the login process with a scope of profile. However, you could mind your own 'id token'-lite using the values from the userinfo endpoint and the JWT vending: https://fusionauth.io/docs/v1/tech/apis/jwt/#vend-a-jwt

Implement OpenIdDict auth backend(Asp.Net core) to be able to auth with model entity and LinkedIn authorization

The goal is to be able to login in mobile app(react native) with:
in app username and password
"Login with LinkedId" feature.
I've researched a lot on this topic, and read the Kévin Chalet's(#Pinpoint) blog series and also cloned the sampels from: https://github.com/openiddict/openiddict-samples
I've created test server app:https://github.com/Jamaxack/OpenIdConnectAuthLinkedIn
I'm able to test the authorization to LinkedIn with https://oidcdebugger.com but now, I'm confused. Without https://oidcdebugger.com how can I test the LinkedIn authorization? for example with Postman? For my case what Auth flow should I use?
options.AllowImplicitFlow()
.AllowPasswordFlow()
.AllowAuthorizationCodeFlow()
.AllowRefreshTokenFlow();
Thanks in advance.
You can use Authorization Code Flow to login using Linkedin and request permission from the member .
If using Postman , you can try below steps :
Add a new request , click the Authorization , choose OAuth 2.0 as TYPE , and set Add authorization data to to Request Headers . If you want to inspect the authorization headers and parameters that Postman generates, click the Preview Request button.
Click the Get New Access Token button . Input the correct callback url, auth url, token url , client id, client secret and scopes , callback url should match the one register in linkedin application portal .
Now you should now see a screen prompting you to login to your LinkedIn account. After click Allow in Application Authorization Confirmation page , you will get token in Postman .
Making a Get request to api https://api.linkedin.com/v2/me with token as authorization bearer token header , and you will get the correct response from linkedin API endpoint .

Authorization between nuxtjs and the backend API

I have a Vuejs application created using Nuxtjs. I am also using Django as the backend server, and I made an API to interact with the backend server (Django) and front-end app (Vuejs/Nuxtjs). And any API related fetch are done in the AsyncData function of the page to render the data on the server-side using axios. Also, I am using json web token authentication, and the API generates a jwt token after successful login which is stored in the cookie. So on the backend, it will always check for the request's authorization header for the token. If the request is from a logged in user (authorized token) then return authenticated json data, or else return non authenticated data.
The problem:
When the user navigates to the app, I would like to check if the user is authenticated. If the user is authenticated, render the authenticated page. If not then display non authenticated page.
My thoughts:
When the fetch is done from the App on the AsyncData function, I would check whether there is any value for the cookie. If there is then send the token with the request's authorization header. But, since the page will be rendered on the server first, and not on the client side (where the cookie actually is) it will never find the token for the authorization.
How can I check if the user is already logged in or not so that I can get authenticated and non authenticated data respectively from the API?
Update
When I successfully log in (post authorized email and password), I get a json response back with the token, which I set in the cookie like this:
this.$cookie.set('my_auth_token', this.token, {expires: 15})
How can I retrieve client side cookie and into the nuxt server for server side rendering?
Cookies are exposed in the (Express) Nuxt server through middleware.
Specifically, they can be read from the req.headers.cookie property. You can see an example implementation of this in the Nuxt documentation.
Regarding your implementation: fetching the privileged data from your API using Node would seem to be the ideal way to delegate session handling to that single service (rather than both) and provide SSR for your users.
If you've chosen to instead implement your session handling on the Django service then you'll need to "forward" your cookies by passing them into your axios request headers.
I did something similar using Firebase authentication. There is an example project on Github as well as a blog entry outlining the important files and configuration used in the application.

User authentication and login flow with Ember and JSON web tokens

I'm trying to figure out how is best to do authentication and login flow with Ember. I'll also add that this is the first web app I've built so it's all a bit new to me.
I have an Express.js backend with protected endpoints using JWTs (I'm using Passport, express-jwt and jsonwebtoken for that) and that all works.
On the client-side, I'm using Ember
Simple Auth with the JWT authenticator. I have the login flow working (I'm using the login-controller-mixin) and correctly see the isAuthenticated flag in the inspector after a successful login.
The thing I'm struggling with is what to do after login: once a user logs in and gets the token, should I make a subsequent call to get the user details, e.g. GET /me, so that I can then have a representative user model client side? These details would then let me transition to the appropriate route.
See this example in the repo for an example of how to add a property to the session that provides access to the current user.