arcane_auth 1.2.1 arcane_auth: ^1.2.1 copied to clipboard
Authentication Service Provider & UI for Authentication in Arcane Style
arcane_auth #
A Flutter package for authenticating with firebase_auth providers using the arcane package for UI.
Web | iOS | Android | MacOS | Windows | |
---|---|---|---|---|---|
Anonymous | firebase_auth | firebase_auth | firebase_auth | firebase_auth | firebase_auth |
firebase_auth | firebase_auth | firebase_auth | firebase_auth | firebase_auth | |
Email Link | NYI | NYI | NYI | NYI | NYI |
Phone | NYI | NYI | NYI | NYI | NYI |
firebase_auth | google_sign_in | google_sign_in | google_sign_in | arcane_auth | |
Apple | NYI | sign_in_with_apple | NYI | sign_in_with_apple | NYI |
firebase_auth | arcane_auth | arcane_auth | arcane_auth | arcane_auth | |
Microsoft | firebase_auth | arcane_auth | arcane_auth | arcane_auth | arcane_auth |
Github | NYI | NYI | NYI | NYI | NYI |
Yahoo | NYI | NYI | NYI | NYI | NYI |
X | NYI | NYI | NYI | NYI | NYI |
Play Games | NYI | NYI | NYI | NYI | NYI |
Game Center | NYI | NYI | NYI | NYI | NYI |
OpenID | NYI | NYI | NYI | NYI | NYI |
SAML | NYI | NYI | NYI | NYI | NYI |
Setup #
Apple #
Currently only IOS and MacOS are easily supported for Apple Sign In which do not require any setup. There is a way to get it to work on windows / android / web, see here
Google #
- Head to https://console.cloud.google.com/apis/credentials
- Under
OAuth 2.0 Client IDs
click on Web client (auto created by Google Service) - Set
Authorized redirect URIs
url tohttps://[YOUR FIREBASE PROJECT ID].firebaseapp.com/__/auth/handler
- Under
Additional information
you will find yourClient ID
which is needed for the provider - Under
Client Secrets
you will find yourClient Secret
which is needed for the provider
Microsoft #
- Login Azure portal and click Azure Active Directory, and then, in the navigation panel, click App registrations to register an application.
- Enter your Application Name and pick Accounts in any organizational directory (Any Azure AD directory - Multitenant) and personal Microsoft accounts(eg. Skype, Xbox) to allow for Sign-in from both organization and public accounts.
- Choose Web as the Redirect URI and enter the Redirect URI in Firebase Console under Authentication > Sign-In Method > Enable Microsoft provider.
- Add new client secret in Certificates and secrets. & copy the VALUE not the secret id. That is the secret to use
- Specify your app's Client ID, Client Secret you just created in the project.
- Plug these values into the microsoft provider on both firebase and a sign in config in main
Facebook #
- Start the app creation process in Meta for Developers.
- Choose a use case which determines permissions, products and APIs are available to your app.
- Set your app name and email.
- Specify your app's Client ID, Client Secret you just created in the project .
Aut Setup #
First add arcane auth if you haven't flutter pub add arcane_auth
Then in your main, setup arcane_auth
Future<void> main() async {
// ensure widgets binding is initialized and setup firebase first
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
// init arcane auth
initArcaneAuth(
signInConfigs: [
// Add the sign in providers you would like to use
GoogleSignInConfig(
clientId:
"CLIENT-ID.apps.googleusercontent.com",
clientSecret: "CLIENT-SECRET",
redirectUrl: "https://YOURAPP.firebaseapp.com/__/auth/handler")
],
// This is called when the user is signed in, you can use this to
// subscribe to user data or initialize stuff for that user
onBind: (s) async {
print("BOUND ${s}");
},
// This is called when the user is signed out or before the next sign in
// you can use this to unsubscribe from user data or clean up stuff
onUnbind: () async {
print("UNBOUND");
});
// wait for services to start up
await services().waitForStartup();
// Finally run your app
runApp(MyApp());
}
Then in your app, you can use the AuthenticatedArcaneApp
to handle dual app states.
If the user is not signed in, a different app with the same style / properties will be used
with a single home of the login screen. The second they are authenticated it switches back
to your app with the home screen / routes you have.
class MyApp extends StatelessWidget {
const MyApp({super.key});
// Use an AuthenticatedArcaneApp instead of ArcaneApp
@override
Widget build(BuildContext context) => AuthenticatedArcaneApp(
// Define the sign in providers you would like to use
loginButtons: [
GoogleSignInButton(),
AppleSignInButton(),
],
// Define the screen that will be shown when the user is not signed in
loginScreenBuilder: (context, buttons) => LoginScreen(
loginButtons: buttons,
header: Text("My Cool App").x9Large(),
// If you want to allow email/password sign in enable this
allowEmailPassword: true,
// Match this with your firebase password policy
// Defaults to the default firebase password policy
passwordPolicy: ArcanePasswordPolicy(
maxPasswordLength: 4096,
minPasswordLength: 6,
requireLowercaseLetter: false,
requireNumericCharacter: false,
requireSpecialCharacter: false,
requireUppercaseLetter: false,
),
),
title: 'My App',
home: HomeScreen(),
theme: ArcaneTheme(
scheme: ContrastedColorScheme.fromScheme(ColorSchemes.zinc),
radius: 0.5,
surfaceOpacity: 0.66,
surfaceBlur: 18,
themeMode: ThemeMode.system),
);
}
// This widget is only built when the user is signed in
// It is impossible to see this screen or any other routes if the user is not signed in
class HomeScreen extends StatelessWidget {
const HomeScreen({super.key});
@override
Widget build(BuildContext context) => FillScreen(
child: OutlineButton(
child: Text("Home (tap to sign out)"),
onPressed: () => svc<AuthService>().signOut(),
));
}
Utilities #
There are several actions & utilities you can use
import 'package:arcane_auth/arcane_auth.dart';
// This is always true if allowAnonymous is enabled
bool isSignedIn = $signedIn;
// The uid is never null if allowAnonymous is enabled
String userID = $uid ?? "not-logged-in";
// This is always false if allowAnonymous is disabled
// This is only true if the signed in user is signed in anonymously
bool isAnonymous = $anonymous;