How to implement non-teams auth for teamsfx created react app? - microsoft-teams

Is there an example of adding authentication to a teamsfx created react app for when accessed directly with the browser, no teams? The teamfx specific mgt-element version is giving me trouble when trying to implement this.
Thanks!
Ed

Since TeamsFx SDKs needs to run in Teams, you can create a Tab project with TeamsFx Toolkit and add your auth provider in the project.
To create a Tab project, you can run the following command with latest TeamsFx CLI:
teamsfx new --interactive false --capabilities tab-non-sso --app-name yourApp
To add your auth provider, this package may help you, and you can also refer to this wiki to learn more.

Related

Error: Could not determine active Firebase project directory in firebase while switching account with firebase login:use

I used Firebase CLI to create a new firebase project for my flutter app. now, my client wants to use another email with it's own firebase project. That project already has the datas (production data) that I need. However after doing firebase login:add I have added both the emails, now when I do firebase login:use , I'm getting
Error: Could not determine active Firebase project directory
Having trouble? Try firebase [command] --help
in my cli. I hope my question was clear. thank you for reading this far.
Use this command: firebase login --reauth
It generates a link on the terminal which redirects you to Google Sign In on the web, where you can choose an new account to log in with.

TeamsFx Hello World Auth Service

I am running the Hello-World-Tab-With-Backend example from TeamsFx. As expected when debugging it launches the Front end and back end services but I noticed that its also launching an Auth service (see image below). Can someone help me understand what the Auth service is doing? Does this also need to be deployed when I deploy my app to production? The README does not provide any information on this.
Simple Auth (Auth Service you motioned) is a backend service helping Teams tab app access first/third party services from client side. TeamsFx SDK calls the Simple Auth Service to get Access Token in Tab apps. You can find the source code and ReadMe of Simple Auth here.
When local debugging, toolkit will launch a local session to host the Simple Auth Service.
When provisioning from Teams Toolkit, toolkit will provision a Web app on Azure and deploy the source code, thus you don't need to care about the deploying.

Is it possible to replace Keycloak's build in account-console?

Is it possible to connect to Keycloak an Angular 10+ spa, which gives almost the same functionality as Keycloaks Account-Console? Does anyone have experience with this?
New account console looks like "just an openid-connect"-ed reactjs webapp, i think.
Or am I better if I give up on this, and thinking in the theme functionality of account-console?
New account console is shipped also with new account API (!= admin REST API), so nothing stopping you to build own independent SPA (in your favorite platform: Angular, React, Vue, ...), which will utilize that account API.
See (random) blog post about that: https://www.marcus-povey.co.uk/2020/10/12/using-the-keycloak-accounts-management-api/

Implementing Sign in with google on react native application with PHP Sociallite laravel backend

I'm trying to implement a sign in with google button on a react native application, there is 0 documentation nor any help online with my scenario, there are only firebase examples.
This already works perfectly on React js app, everything is configured correctly, however on the react native app, I'm just stuck with a library that takes the client ID, I recieve authUserCode, and some other google credentials, but no redirects occur, normally on the react js, it redirects to another url, and to the backend and retrieves the token and saves it as a cookie. How can I continue with this on react native? should I call the redirect url manually?
Laravel with Socialite on the backend, react native on the front end, callback function and url work perfectly.
I had developer error on react-native-google-signin, but was solved when adding localhost to authorized javascript origins. Can someone explain this
in react native you can't use cookie, so use AssyncStorage for save state of new user, and when you use google login in react native you may set firebase:
create new project
2- create android application in your firebase
project
3- when you try number 2 : enter your package name
correctly, be careful! and enter your application SHA1 code.
3-1- for getting SHA1 code go to the android studio, in right side, click
on Gradle>Tasks>android>signingReport double click on
signignReport.
3-2- in the Terminal ( of android studio ) you should see SHA1 codes, don't hurry, Look for
Task :app:signingReport
Variant: debugAndroidTest
Config: debug
copy their SHA1 code and go back to the firebase.
4- enter your SHA1 code and create application, in the next firebase gives you a file, google-services.json.
4-1- download the file and copy it to android>app in your project.
your firebase set is complete.
These steps will allow us to return to your application when the validation is complete.

Migrate application developed with the Provisioning API to the new api (Admin SDK)

Reviewing the new api (Admin SDK) Admin SDK. I found the following problem, none of these APIs have support 2 legged for the google apps marketplace, there is a way to integrate these new apis or if in the future the google apps marketplace will support for OAuth 2.0.
The Admin SDK APIs function with Two Legged OAuth just fine, I'm using the Directory API in my marketplace app today. You'll need to go into your Vendor Profile page on the marketplace, click "Register for additional APIs" and enable Admin SDK. You'll also need to add the needed API scopes to your manifest.
Also note that the google-api-python-client at least does not support OAuth 1.0 any longer so you'll need to either perform the authentication manually or utilize the old GData library to get the correct auth headers.

Resources