How to use best use Google/Facebook signin using expo AuthSession to authenticate with a custom backend API - authentication

I am working on creating an mobile app using Expo (managed workflow). I have a backend server which this app will connect to. The backend server has its own authentication with username and password and all other endpoints are protected based on a token that you would receive by signing in to the API using a /authenticate endpoint.
Now, I would like to add a 'Sign in with Google' feature to my app. From the Expo's AuthSession documentations, it looks like somehow the app can authenticate with Google. I want to use this identity to authenticate with my backend API.
I created a /api/auth/google endpoint in my API that uses passport google-oauth, redirects user to google and get authorization code sent to /api/auth/google/callback. I then use the authorization code to access Google's people API, to get the email to validate the user and respond back with a access token for my API if the Google sign in was successful. This works fine when using in a browser.
I want to do something similar for the react-native app. When I use the Google example in Expo's AuthSession, it gives me back a access_token. I have no idea how it gets an access_token because the app does not know my client secret. But still, I don't know how to use it to login to my API and get my API's token.
I have thought about using AuthSession to directly open my API's /api/auth/google, so it would redirect correctly and my backend can then send my API's token to the app. The problem with this is, when someone clicks on the 'Sign in with Google' button in the app, apple will tell you 'App name wants to use myapi.com to sign in' or something along those lines instead of Google.com. Additionally when I add more sign in options like Sign in with Facebook and Sign in with Something else, the user's phone will always say that the app wants to use myapi.com to sign in and then in turn be redirected to Google/Facebook or something else. I am not sure if this is allowed and would count as misleading the user and get rejected form the app store. I tried logging into some of the apps on my phone and clicking on 'Sign in with Google' tells the app is trying to sign in with Google.com and 'Sign in with Facebook' tells that the app is trying to sign in with Facebook.com correctly. But then I also know that the app eventually authenticates with its own API somehow. I don't know what is the right way to do that.
Can someone help? Thanks.

Related

How to tie an account from a backend server to a google assistant user

I have a web application setup to handle webhook requests from an Actions-on-Google/Dialogflow application using the Google Assistant. Users don't need to sign-in to a google account in order to use my web application and I'd prefer to keep it that way, so that users can sign in with any email address.
I also want my users to be able to interact with my application using the Google Assistant, and be able to access personal/contextual data via the assistant (i.e. when a speaker says, "what's on my shopping list", the web app needs to be able to know what my means).
Currently, I have this working by using my web app to issue a unique short code to my user (in the web app UI) and then with an intent on the Assistant where the speaker says "My code is 1-2-3-4" and then my web app can identify the user from then on (by saving the userId from the webhook request to whatever user got the short code 1234 and then using that userId to lookup the user on each subsequent request.)
My question is, is there a better way to do this? Ideally, in my web app, I'd like to have something like an "Authorize Google Assistant" button, which would then link the user's google account to their web-app account, so that the conversation on the Assistant is seamless.
Has anyone done this before?
Thanks
This is the perfect use case for Account Linking with the Google Assistant.
From your users' perspective, they will start to use your Action. If they're doing so through a speaker and they haven't linked the account yet, they'll be directed to a mobile device to do so. On a mobile device, they'll be redirected to a page on your website where they will been to authenticate themselves and authorize your server to let them in through the Assistant. Once they have done so, they won't need to log in again, the accounts will be linked, and they'll be able to use the voice Action without further obstruction.
From your perspective as a developer, you'll need to setup an OAuth2 server (I suggest the code flow). That login process I mentioned is the first step in the OAuth dance, and will end up with you issuing a code to Google. They will then exchange this code for an Auth Token (with a limited lifetime) and a Refresh Token (which does not expire). They will periodically use the Refresh Token to get new, valid, Auth Tokens for this user. When the user issues a voice command, the Auth Token will be passed as a field in the JSON to your fulfillment server, and you can use this to verify who the user is and that they are authorized to use your service.

Automatically fill auth code for Google's OAuth for devices API

I have a console application that uses Google's OAuth for devices workflow to authenticate users using their Google accounts (see: https://developers.google.com/identity/protocols/OAuth2ForDevices).
During the authentication process, the user is required to visit https://www.google.com/device and copy-paste a code printed by my app.
Is it possible to include the code as part of the auth url such that the code will already be filled in, and the user only has to click on to authenticate (I'm thinking on opening a browser window programatically)?
Looking for an option like https://www.google.com/device?code=ABCD-EFGH

Facebook Login for Web

According to this link Facebook Login for the Web, I can let my users login with facebook accounts (after logging to my facebook app).
now, all the work is done here in javascript which is a client-based code, it means it is insecure and a hacker could easily trespass my login step.
I know i should be using PHP SDK (for example) to secure the login process, but my question is why would I use this method ????

Google Plus login with Javascript and Authenticating with PHP

While implementing the Facebook Connect to a web application , its possible to show Facebook Sign up page in a pop up and once logging in and Granting permissions are complete, its possible to Authenticate Again in PHP and to get the necessary details of the user, - id, email etc.
I believe, thats secure because, the User Insertion is not based on the Ajax Request Parameters.
Is it possible to do the same with Google Plus Login also ?
Means - Logging in to Google - Using Javascript SDK, asking permissions, Authenticating all done in a Pop Up Window. and then, Creating a new user with the Help of google-api-php-client ??
Yes, what you're trying to do is outlined with https://developers.google.com/+/web/signin/server-side-flow which includes some PHP code samples to help you do this. In general, the steps at authentication time are:
User clicks the "Sign in with Google" button which may pop-up a new window at Google prompting them to log in and authorize your webapp.
After they do so, a one-time code is sent to a JavaScript callback you specify.
Your Javascript method sends this code to your PHP server.
Your PHP server uses the client library to contact Google's server and exchange this one-time code for an access token and refresh token, which you keep and use to perform actions on the user's behalf.

The use of FacebookAuthProvider in apps

I've been working with ServiceStack for quite some time now and i love it. But there is one thing i can't figure out.
How are app's (ios, android etc.) that are using my servicestack endpoints, suppose to use the facebook endpoint "/auth/facebook"?
When using this url "/auth/facebook" from the browser it works fine, but the response is html, and not an AuthResponse og something serializable.
Is this endpoint only to be used from websites with servicestack in the same solution?
The way that stuff works is by redirecting the user to Facebook with an API key that matches your app. The user then tells Facebook that your app is ok, and Facebook redirects them back. This can only be done via a browser. You really have two options to work around this:
Make the user authenticate with Facebook using a website and then authenticate your user with credentials from the app.
Use the built in iOS Facebook stuff and send the resulting auth tokens to an endpoint on your app, where you can save them for later use.
Edit, a bit more clarification:
Option 1
User Goes to your website
User Clicks on your Auth With Facebook button
User is sent your your Facebook endpoint set up in Service Stack
User is redirected by Service Stack to Facebook
User is redirected back to Service Stack from Facebook, with a token in the url
You save the token in your database and tell the user they can now user your app with Facebook.
Option 1.5
The same as Option 1 but instead of making the user go through their browser you create a UIWebView control and point it to your Facebook Auth endpoint. Then you listen for a response from your site that says the user is authenticated. I'm not a objective c, so I can't really get more detailed on how to do that.
Option 2
Use the iOS Facebook API and handle authentication as seen here.
POST the credentials to Service Stack via a Custom Endpoint
Save credentials in the db, and use them in the future to make calls on behalf of the user.
Facebook Login requires a browser of some sort, because Facebook's cookies must be passed along with a request to authorize your website. That is how Facebook knows which of it's users wants to authorize your site, and that they are the ones making the request.