mirror of https://github.com/portainer/portainer
feat(oauth): update authentication panel with OAuth provider details
parent
e325ad10dd
commit
9918c1260b
|
@ -29,13 +29,22 @@
|
|||
<div class="form-group">
|
||||
<div class="col-sm-12" >
|
||||
<a ng-href="{{OAuthLoginURI}}" ng-if="AuthenticationMethod === 3">
|
||||
<div class="btn btn-primary btn-sm pull-left" style="margin-left:2px">
|
||||
<i class="fa fa-sign-in-alt" aria-hidden="true"></i> Login with OAuth
|
||||
<div class="btn btn-primary btn-sm pull-left" style="margin-left:2px" ng-if="state.OAuthProvider === 'Microsoft'">
|
||||
<i class="fab fa-microsoft" aria-hidden="true"></i> Login with Microsoft
|
||||
</div>
|
||||
<div class="btn btn-primary btn-sm pull-left" style="margin-left:2px" ng-if="state.OAuthProvider === 'Google'">
|
||||
<i class="fab fa-google" aria-hidden="true" ></i> Login with Google
|
||||
</div>
|
||||
<div class="btn btn-primary btn-sm pull-left" style="margin-left:2px" ng-if="state.OAuthProvider === 'Github'">
|
||||
<i class="fab fa-github" aria-hidden="true" ></i> Login with Github
|
||||
</div>
|
||||
<div class="btn btn-primary btn-sm pull-left" style="margin-left:2px" ng-if="state.OAuthProvider === ''">
|
||||
<i class="fa fa-sign-in-alt" aria-hidden="true" ></i> Login with OAuth
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<button type="submit" class="btn btn-primary btn-sm pull-right" ng-click="authenticateUser()"><i class="fa fa-sign-in-alt" aria-hidden="true"></i> Login</button>
|
||||
|
||||
|
||||
<span class="pull-right" style="margin: 5px;" ng-if="state.AuthenticationError">
|
||||
<i class="fa fa-exclamation-triangle red-icon" aria-hidden="true" style="margin-right: 2px;"></i>
|
||||
<span class="small text-danger">{{ state.AuthenticationError }}</span>
|
||||
|
|
|
@ -1,130 +1,146 @@
|
|||
angular.module('portainer.app').controller('AuthenticationController', ['$q', '$scope', '$state', '$stateParams', '$sanitize', 'Authentication', 'UserService', 'EndpointService', 'StateManager', 'Notifications', 'SettingsService', 'URLHelper',
|
||||
function($q, $scope, $state, $stateParams, $sanitize, Authentication, UserService, EndpointService, StateManager, Notifications, SettingsService, URLHelper) {
|
||||
$scope.logo = StateManager.getState().application.logo;
|
||||
angular.module('portainer.app')
|
||||
.controller('AuthenticationController', ['$q', '$scope', '$state', '$stateParams', '$sanitize', 'Authentication', 'UserService', 'EndpointService', 'StateManager', 'Notifications', 'SettingsService', 'URLHelper',
|
||||
function($q, $scope, $state, $stateParams, $sanitize, Authentication, UserService, EndpointService, StateManager, Notifications, SettingsService, URLHelper) {
|
||||
$scope.logo = StateManager.getState().application.logo;
|
||||
|
||||
$scope.formValues = {
|
||||
Username: '',
|
||||
Password: ''
|
||||
};
|
||||
$scope.formValues = {
|
||||
Username: '',
|
||||
Password: ''
|
||||
};
|
||||
|
||||
$scope.state = {
|
||||
AuthenticationError: '',
|
||||
isInOAuthProcess: true
|
||||
};
|
||||
$scope.state = {
|
||||
AuthenticationError: '',
|
||||
isInOAuthProcess: true,
|
||||
OAuthProvider: ''
|
||||
};
|
||||
|
||||
$scope.authenticateUser = function() {
|
||||
var username = $scope.formValues.Username;
|
||||
var password = $scope.formValues.Password;
|
||||
$scope.authenticateUser = function() {
|
||||
var username = $scope.formValues.Username;
|
||||
var password = $scope.formValues.Password;
|
||||
|
||||
Authentication.login(username, password)
|
||||
.then(function success() {
|
||||
checkForEndpoints();
|
||||
})
|
||||
.catch(function error() {
|
||||
SettingsService.publicSettings()
|
||||
.then(function success(settings) {
|
||||
if (settings.AuthenticationMethod === 1) {
|
||||
return Authentication.login($sanitize(username), $sanitize(password));
|
||||
}
|
||||
return $q.reject();
|
||||
})
|
||||
.then(function success() {
|
||||
$state.go('portainer.updatePassword');
|
||||
})
|
||||
.catch(function error() {
|
||||
$scope.state.AuthenticationError = 'Invalid credentials';
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
function unauthenticatedFlow() {
|
||||
EndpointService.endpoints()
|
||||
.then(function success(endpoints) {
|
||||
if (endpoints.length === 0) {
|
||||
$state.go('portainer.init.endpoint');
|
||||
} else {
|
||||
$state.go($stateParams.redirect || 'portainer.home');
|
||||
}
|
||||
})
|
||||
.catch(function error(err) {
|
||||
Notifications.error('Failure', err, 'Unable to retrieve endpoints');
|
||||
});
|
||||
}
|
||||
|
||||
function authenticatedFlow() {
|
||||
UserService.administratorExists()
|
||||
.then(function success(exists) {
|
||||
if (!exists) {
|
||||
$state.go('portainer.init.admin');
|
||||
}
|
||||
})
|
||||
.catch(function error(err) {
|
||||
Notifications.error('Failure', err, 'Unable to verify administrator account existence');
|
||||
});
|
||||
}
|
||||
|
||||
function checkForEndpoints() {
|
||||
EndpointService.endpoints()
|
||||
.then(function success(data) {
|
||||
var endpoints = data;
|
||||
var userDetails = Authentication.getUserDetails();
|
||||
|
||||
if (endpoints.length === 0 && userDetails.role === 1) {
|
||||
$state.go('portainer.init.endpoint');
|
||||
} else {
|
||||
$state.go($stateParams.redirect || 'portainer.home');
|
||||
}
|
||||
})
|
||||
.catch(function error(err) {
|
||||
Notifications.error('Failure', err, 'Unable to retrieve endpoints');
|
||||
});
|
||||
}
|
||||
|
||||
function initView() {
|
||||
Authentication.login(username, password)
|
||||
.then(function success() {
|
||||
checkForEndpoints();
|
||||
})
|
||||
.catch(function error() {
|
||||
SettingsService.publicSettings()
|
||||
.then(function success(settings) {
|
||||
$scope.AuthenticationMethod = settings.AuthenticationMethod;
|
||||
$scope.OAuthLoginURI = settings.OAuthLoginURI;
|
||||
});
|
||||
.then(function success(settings) {
|
||||
if (settings.AuthenticationMethod === 1) {
|
||||
return Authentication.login($sanitize(username), $sanitize(password));
|
||||
}
|
||||
return $q.reject();
|
||||
})
|
||||
.then(function success() {
|
||||
$state.go('portainer.updatePassword');
|
||||
})
|
||||
.catch(function error() {
|
||||
$scope.state.AuthenticationError = 'Invalid credentials';
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
if ($stateParams.logout || $stateParams.error) {
|
||||
Authentication.logout();
|
||||
$scope.state.AuthenticationError = $stateParams.error;
|
||||
$scope.state.isInOAuthProcess = false;
|
||||
return;
|
||||
}
|
||||
|
||||
if (Authentication.isAuthenticated()) {
|
||||
$state.go('portainer.home');
|
||||
}
|
||||
|
||||
var authenticationEnabled = $scope.applicationState.application.authentication;
|
||||
if (!authenticationEnabled) {
|
||||
unauthenticatedFlow();
|
||||
function unauthenticatedFlow() {
|
||||
EndpointService.endpoints()
|
||||
.then(function success(endpoints) {
|
||||
if (endpoints.length === 0) {
|
||||
$state.go('portainer.init.endpoint');
|
||||
} else {
|
||||
authenticatedFlow();
|
||||
$state.go($stateParams.redirect || 'portainer.home');
|
||||
}
|
||||
})
|
||||
.catch(function error(err) {
|
||||
Notifications.error('Failure', err, 'Unable to retrieve endpoints');
|
||||
});
|
||||
}
|
||||
|
||||
var code = URLHelper.getParameter('code');
|
||||
if (code) {
|
||||
oAuthLogin(code);
|
||||
} else {
|
||||
$scope.state.isInOAuthProcess = false;
|
||||
function authenticatedFlow() {
|
||||
UserService.administratorExists()
|
||||
.then(function success(exists) {
|
||||
if (!exists) {
|
||||
$state.go('portainer.init.admin');
|
||||
}
|
||||
})
|
||||
.catch(function error(err) {
|
||||
Notifications.error('Failure', err, 'Unable to verify administrator account existence');
|
||||
});
|
||||
}
|
||||
|
||||
function checkForEndpoints() {
|
||||
EndpointService.endpoints()
|
||||
.then(function success(data) {
|
||||
var endpoints = data;
|
||||
var userDetails = Authentication.getUserDetails();
|
||||
|
||||
if (endpoints.length === 0 && userDetails.role === 1) {
|
||||
$state.go('portainer.init.endpoint');
|
||||
} else {
|
||||
$state.go($stateParams.redirect || 'portainer.home');
|
||||
}
|
||||
})
|
||||
.catch(function error(err) {
|
||||
Notifications.error('Failure', err, 'Unable to retrieve endpoints');
|
||||
});
|
||||
}
|
||||
|
||||
function determineOauthProvider(LoginURI) {
|
||||
if (LoginURI.indexOf('login.microsoftonline.com') !== -1) {
|
||||
return 'Microsoft';
|
||||
}
|
||||
else if (LoginURI.indexOf('accounts.google.com') !== -1) {
|
||||
return 'Google';
|
||||
}
|
||||
else if (LoginURI.indexOf('github.com') !== -1) {
|
||||
return 'Github';
|
||||
}
|
||||
return 'OAuth';
|
||||
}
|
||||
|
||||
function initView() {
|
||||
SettingsService.publicSettings()
|
||||
.then(function success(settings) {
|
||||
$scope.AuthenticationMethod = settings.AuthenticationMethod;
|
||||
$scope.OAuthLoginURI = settings.OAuthLoginURI;
|
||||
$scope.state.OAuthProvider = determineOauthProvider(settings.OAuthLoginURI);
|
||||
});
|
||||
|
||||
if ($stateParams.logout || $stateParams.error) {
|
||||
Authentication.logout();
|
||||
$scope.state.AuthenticationError = $stateParams.error;
|
||||
$scope.state.isInOAuthProcess = false;
|
||||
return;
|
||||
}
|
||||
|
||||
function oAuthLogin(code) {
|
||||
return Authentication.OAuthLogin(code)
|
||||
.then(function success() {
|
||||
URLHelper.cleanParameters();
|
||||
$state.go('portainer.home');
|
||||
})
|
||||
.catch(function error() {
|
||||
$scope.state.AuthenticationError = 'Unable to login via OAuth';
|
||||
$scope.state.isInOAuthProcess = false;
|
||||
});
|
||||
if (Authentication.isAuthenticated()) {
|
||||
$state.go('portainer.home');
|
||||
}
|
||||
|
||||
var authenticationEnabled = $scope.applicationState.application.authentication;
|
||||
if (!authenticationEnabled) {
|
||||
unauthenticatedFlow();
|
||||
} else {
|
||||
authenticatedFlow();
|
||||
}
|
||||
|
||||
initView();
|
||||
}]);
|
||||
var code = URLHelper.getParameter('code');
|
||||
if (code) {
|
||||
oAuthLogin(code);
|
||||
} else {
|
||||
$scope.state.isInOAuthProcess = false;
|
||||
}
|
||||
}
|
||||
|
||||
function oAuthLogin(code) {
|
||||
return Authentication.OAuthLogin(code)
|
||||
.then(function success() {
|
||||
URLHelper.cleanParameters();
|
||||
$state.go('portainer.home');
|
||||
})
|
||||
.catch(function error() {
|
||||
$scope.state.AuthenticationError = 'Unable to login via OAuth';
|
||||
$scope.state.isInOAuthProcess = false;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
initView();
|
||||
}]);
|
||||
|
|
Loading…
Reference in New Issue