helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(mobile) Add OAuth Login On Mobile (#990)

Browse source 
* Added return type for oauth/callback

* Remove console.log

* Redirect app

* Wording

* Added loading state change

* Added OAuth login on mobile

* Return correct status for  correct redirection

* Auto discovery OAuth Login
This commit is contained in:
Alex 2022-11-20 11:43:10 -06:00 • committed by GitHub
parent e01e4e6530
commit b3e51cc849
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 443 additions and 149 deletions
Download patch file Download diff file Expand all files Collapse all files

10
mobile/lib/modules/login/models/hive_saved_login_info.model.dart
View file

@ -5,21 +5,25 @@ part 'hive_saved_login_info.model.g.dart';
@HiveType(typeId: 0)
class HiveSavedLoginInfo {
@HiveField(0)
String email;
String email; // DEPRECATED
@HiveField(1)
String password;
String password; // DEPRECATED
@HiveField(2)
String serverUrl;
@HiveField(3)
@HiveField(3, defaultValue: false)
bool isSaveLogin;
@HiveField(4, defaultValue: "")
String accessToken;
HiveSavedLoginInfo({
required this.email,
required this.password,
required this.serverUrl,
required this.isSaveLogin,
required this.accessToken,
});
}

9
mobile/lib/modules/login/models/hive_saved_login_info.model.g.dart
View file

@ -20,14 +20,15 @@ class HiveSavedLoginInfoAdapter extends TypeAdapter<HiveSavedLoginInfo> {
email: fields[0] as String,
password: fields[1] as String,
serverUrl: fields[2] as String,
isSaveLogin: fields[3] as bool,
isSaveLogin: fields[3] == null ? false : fields[3] as bool,
accessToken: fields[4] == null ? '' : fields[4] as String,
);
}
@override
void write(BinaryWriter writer, HiveSavedLoginInfo obj) {
writer
..writeByte(4)
..writeByte(5)
..writeByte(0)
..write(obj.email)
..writeByte(1)
@ -35,7 +36,9 @@ class HiveSavedLoginInfoAdapter extends TypeAdapter<HiveSavedLoginInfo> {
..writeByte(2)
..write(obj.serverUrl)
..writeByte(3)
..write(obj.isSaveLogin);
..write(obj.isSaveLogin)
..writeByte(4)
..write(obj.accessToken);
}
@override

133
mobile/lib/modules/login/providers/authentication.provider.dart
View file

@ -74,15 +74,6 @@ class AuthenticationNotifier extends StateNotifier<AuthenticationState> {
return false;
}
// Store device id to local storage
var deviceInfo = await _deviceInfoService.getDeviceInfo();
Hive.box(userInfoBox).put(deviceIdKey, deviceInfo["deviceId"]);
state = state.copyWith(
deviceId: deviceInfo["deviceId"],
deviceType: deviceInfo["deviceType"],
);
// Make sign-in request
try {
var loginResponse = await _apiService.authenticationApi.login(
@ -97,65 +88,15 @@ class AuthenticationNotifier extends StateNotifier<AuthenticationState> {
return false;
}
Hive.box(userInfoBox).put(accessTokenKey, loginResponse.accessToken);
state = state.copyWith(
isAuthenticated: true,
userId: loginResponse.userId,
userEmail: loginResponse.userEmail,
firstName: loginResponse.firstName,
lastName: loginResponse.lastName,
profileImagePath: loginResponse.profileImagePath,
isAdmin: loginResponse.isAdmin,
shouldChangePassword: loginResponse.shouldChangePassword,
return setSuccessLoginInfo(
accessToken: loginResponse.accessToken,
isSavedLoginInfo: isSavedLoginInfo,
);
// Login Success - Set Access Token to API Client
_apiService.setAccessToken(loginResponse.accessToken);
if (isSavedLoginInfo) {
// Save login info to local storage
Hive.box<HiveSavedLoginInfo>(hiveLoginInfoBox).put(
savedLoginInfoKey,
HiveSavedLoginInfo(
email: email,
password: password,
isSaveLogin: true,
serverUrl: Hive.box(userInfoBox).get(serverEndpointKey),
),
);
} else {
Hive.box<HiveSavedLoginInfo>(hiveLoginInfoBox)
.delete(savedLoginInfoKey);
}
} catch (e) {
HapticFeedback.vibrate();
debugPrint("Error logging in $e");
return false;
}
// Register device info
try {
DeviceInfoResponseDto? deviceInfo =
await _apiService.deviceInfoApi.createDeviceInfo(
CreateDeviceInfoDto(
deviceId: state.deviceId,
deviceType: state.deviceType,
),
);
if (deviceInfo == null) {
debugPrint('Device Info Response is null');
return false;
}
state = state.copyWith(deviceInfo: deviceInfo);
} catch (e) {
debugPrint("ERROR Register Device Info: $e");
return false;
}
return true;
}
Future<bool> logout() async {
@ -215,6 +156,74 @@ class AuthenticationNotifier extends StateNotifier<AuthenticationState> {
return false;
}
}
Future<bool> setSuccessLoginInfo({
required String accessToken,
required bool isSavedLoginInfo,
}) async {
Hive.box(userInfoBox).put(accessTokenKey, accessToken);
_apiService.setAccessToken(accessToken);
var userResponseDto = await _apiService.userApi.getMyUserInfo();
if (userResponseDto != null) {
var deviceInfo = await _deviceInfoService.getDeviceInfo();
Hive.box(userInfoBox).put(deviceIdKey, deviceInfo["deviceId"]);
state = state.copyWith(
isAuthenticated: true,
userId: userResponseDto.id,
userEmail: userResponseDto.email,
firstName: userResponseDto.firstName,
lastName: userResponseDto.lastName,
profileImagePath: userResponseDto.profileImagePath,
isAdmin: userResponseDto.isAdmin,
shouldChangePassword: userResponseDto.shouldChangePassword,
deviceId: deviceInfo["deviceId"],
deviceType: deviceInfo["deviceType"],
);
if (isSavedLoginInfo) {
// Save login info to local storage
Hive.box<HiveSavedLoginInfo>(hiveLoginInfoBox).put(
savedLoginInfoKey,
HiveSavedLoginInfo(
email: "",
password: "",
isSaveLogin: true,
serverUrl: Hive.box(userInfoBox).get(serverEndpointKey),
accessToken: accessToken,
),
);
} else {
Hive.box<HiveSavedLoginInfo>(hiveLoginInfoBox)
.delete(savedLoginInfoKey);
}
}
// Register device info
try {
DeviceInfoResponseDto? deviceInfo =
await _apiService.deviceInfoApi.createDeviceInfo(
CreateDeviceInfoDto(
deviceId: state.deviceId,
deviceType: state.deviceType,
),
);
if (deviceInfo == null) {
debugPrint('Device Info Response is null');
return false;
}
state = state.copyWith(deviceInfo: deviceInfo);
} catch (e) {
debugPrint("ERROR Register Device Info: $e");
return false;
}
return true;
}
}
final authenticationProvider =

6
mobile/lib/modules/login/providers/oauth.provider.dart Normal file
View file

@ -0,0 +1,6 @@
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/modules/login/services/oauth.service.dart';
import 'package:immich_mobile/shared/providers/api.provider.dart';
final OAuthServiceProvider =
Provider((ref) => OAuthService(ref.watch(apiServiceProvider)));

39
mobile/lib/modules/login/services/oauth.service.dart Normal file
View file

@ -0,0 +1,39 @@
import 'package:immich_mobile/shared/services/api.service.dart';
import 'package:openapi/api.dart';
import 'package:flutter_web_auth/flutter_web_auth.dart';
// Redirect URL = app.immich://
class OAuthService {
final ApiService _apiService;
final callbackUrlScheme = 'app.immich';
OAuthService(this._apiService);
Future<OAuthConfigResponseDto?> getOAuthServerConfig(
String serverEndpoint,
) async {
_apiService.setEndpoint(serverEndpoint);
return await _apiService.oAuthApi.generateConfig(
OAuthConfigDto(redirectUri: '$callbackUrlScheme:/'),
);
}
Future<LoginResponseDto?> oAuthLogin(String oauthUrl) async {
try {
var result = await FlutterWebAuth.authenticate(
url: oauthUrl,
callbackUrlScheme: callbackUrlScheme,
);
return await _apiService.oAuthApi.callback(
OAuthCallbackDto(
url: result,
),
);
} catch (e) {
return null;
}
}
}

209
mobile/lib/modules/login/ui/login_form.dart
View file

@ -6,11 +6,14 @@ import 'package:hive/hive.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/constants/hive_box.dart';
import 'package:immich_mobile/modules/login/models/hive_saved_login_info.model.dart';
import 'package:immich_mobile/modules/login/providers/oauth.provider.dart';
import 'package:immich_mobile/routing/router.dart';
import 'package:immich_mobile/shared/providers/api.provider.dart';
import 'package:immich_mobile/shared/providers/asset.provider.dart';
import 'package:immich_mobile/modules/login/providers/authentication.provider.dart';
import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
import 'package:immich_mobile/shared/ui/immich_toast.dart';
import 'package:openapi/api.dart';
class LoginForm extends HookConsumerWidget {
const LoginForm({Key? key}) : super(key: key);
@ -23,10 +26,47 @@ class LoginForm extends HookConsumerWidget {
useTextEditingController.fromValue(TextEditingValue.empty);
final serverEndpointController =
useTextEditingController(text: 'login_form_endpoint_hint'.tr());
final apiService = ref.watch(apiServiceProvider);
final serverEndpointFocusNode = useFocusNode();
final isSaveLoginInfo = useState<bool>(false);
final isLoading = useState<bool>(false);
final isOauthEnable = useState<bool>(false);
final oAuthButtonLabel = useState<String>('OAuth');
getServeLoginConfig() async {
if (!serverEndpointFocusNode.hasFocus) {
var urlText = serverEndpointController.text.trim();
try {
var endpointUrl = Uri.tryParse(urlText);
if (endpointUrl != null) {
isLoading.value = true;
apiService.setEndpoint(endpointUrl.toString());
var loginConfig = await apiService.oAuthApi.generateConfig(
OAuthConfigDto(redirectUri: endpointUrl.toString()),
);
if (loginConfig != null) {
isOauthEnable.value = loginConfig.enabled;
oAuthButtonLabel.value = loginConfig.buttonText ?? 'OAuth';
} else {
isOauthEnable.value = false;
}
isLoading.value = false;
}
} catch (_) {
isLoading.value = false;
isOauthEnable.value = false;
}
}
}
useEffect(
() {
serverEndpointFocusNode.addListener(getServeLoginConfig);
var loginInfo = Hive.box<HiveSavedLoginInfo>(hiveLoginInfoBox)
.get(savedLoginInfoKey);
@ -37,6 +77,7 @@ class LoginForm extends HookConsumerWidget {
isSaveLoginInfo.value = loginInfo.isSaveLogin;
}
getServeLoginConfig();
return null;
},
[],
@ -67,7 +108,10 @@ class LoginForm extends HookConsumerWidget {
),
EmailInput(controller: usernameController),
PasswordInput(controller: passwordController),
ServerEndpointInput(controller: serverEndpointController),
ServerEndpointInput(
controller: serverEndpointController,
focusNode: serverEndpointFocusNode,
),
CheckboxListTile(
activeColor: Theme.of(context).primaryColor,
contentPadding: const EdgeInsets.symmetric(horizontal: 8),
@ -92,12 +136,52 @@ class LoginForm extends HookConsumerWidget {
}
},
),
LoginButton(
emailController: usernameController,
passwordController: passwordController,
serverEndpointController: serverEndpointController,
isSavedLoginInfo: isSaveLoginInfo.value,
),
if (isLoading.value)
const SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(
strokeWidth: 2,
),
),
if (!isLoading.value)
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.center,
children: [
LoginButton(
emailController: usernameController,
passwordController: passwordController,
serverEndpointController: serverEndpointController,
isSavedLoginInfo: isSaveLoginInfo.value,
),
if (isOauthEnable.value) ...[
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16.0,
),
child: Divider(
color: Brightness.dark == Theme.of(context).brightness
? Colors.white
: Colors.black,
),
),
OAuthLoginButton(
serverEndpointController: serverEndpointController,
isSavedLoginInfo: isSaveLoginInfo.value,
buttonLabel: oAuthButtonLabel.value,
isLoading: isLoading,
onLoginSuccess: () {
isLoading.value = false;
ref.watch(backupProvider.notifier).resumeBackup();
AutoRouter.of(context).replace(
const TabControllerRoute(),
);
},
),
],
],
)
],
),
),
@ -108,9 +192,12 @@ class LoginForm extends HookConsumerWidget {
class ServerEndpointInput extends StatelessWidget {
final TextEditingController controller;
const ServerEndpointInput({Key? key, required this.controller})
: super(key: key);
final FocusNode focusNode;
const ServerEndpointInput({
Key? key,
required this.controller,
required this.focusNode,
}) : super(key: key);
String? _validateInput(String? url) {
if (url?.startsWith(RegExp(r'https?://')) == true) {
@ -131,6 +218,7 @@ class ServerEndpointInput extends StatelessWidget {
),
validator: _validateInput,
autovalidateMode: AutovalidateMode.always,
focusNode: focusNode,
);
}
}
@ -200,13 +288,9 @@ class LoginButton extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
return ElevatedButton(
return ElevatedButton.icon(
style: ElevatedButton.styleFrom(
visualDensity: VisualDensity.standard,
backgroundColor: Theme.of(context).primaryColor,
foregroundColor: Colors.grey[50],
elevation: 2,
padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 25),
padding: const EdgeInsets.symmetric(vertical: 12),
),
onPressed: () async {
// This will remove current cache asset state of previous user login.
@ -238,10 +322,101 @@ class LoginButton extends ConsumerWidget {
);
}
},
child: const Text(
icon: const Icon(Icons.login_rounded),
label: const Text(
"login_form_button_text",
style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
).tr(),
);
}
}
class OAuthLoginButton extends ConsumerWidget {
final TextEditingController serverEndpointController;
final bool isSavedLoginInfo;
final ValueNotifier<bool> isLoading;
final VoidCallback onLoginSuccess;
final String buttonLabel;
const OAuthLoginButton({
Key? key,
required this.serverEndpointController,
required this.isSavedLoginInfo,
required this.isLoading,
required this.onLoginSuccess,
required this.buttonLabel,
}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
var oAuthService = ref.watch(OAuthServiceProvider);
void performOAuthLogin() async {
ref.watch(assetProvider.notifier).clearAllAsset();
OAuthConfigResponseDto? oAuthServerConfig;
try {
oAuthServerConfig = await oAuthService
.getOAuthServerConfig(serverEndpointController.text);
isLoading.value = true;
} catch (e) {
ImmichToast.show(
context: context,
msg: "login_form_failed_get_oauth_server_config".tr(),
toastType: ToastType.error,
);
isLoading.value = false;
return;
}
if (oAuthServerConfig != null && oAuthServerConfig.enabled) {
var loginResponseDto =
await oAuthService.oAuthLogin(oAuthServerConfig.url!);
if (loginResponseDto != null) {
var isSuccess = await ref
.watch(authenticationProvider.notifier)
.setSuccessLoginInfo(
accessToken: loginResponseDto.accessToken,
isSavedLoginInfo: isSavedLoginInfo,
);
if (isSuccess) {
isLoading.value = false;
onLoginSuccess();
} else {
ImmichToast.show(
context: context,
msg: "login_form_failed_login".tr(),
toastType: ToastType.error,
);
}
}
isLoading.value = false;
} else {
ImmichToast.show(
context: context,
msg: "login_form_failed_get_oauth_server_disable".tr(),
toastType: ToastType.info,
);
isLoading.value = false;
return;
}
}
return ElevatedButton.icon(
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context).primaryColor.withAlpha(230),
padding: const EdgeInsets.symmetric(vertical: 12),
),
onPressed: performOAuthLogin,
icon: const Icon(Icons.pin_rounded),
label: Text(
buttonLabel,
style: const TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
),
);
}
}