Skip to content
This repository has been archived by the owner on Apr 26, 2024. It is now read-only.

Improve the UX of the login fallback when using SSO #7152

Merged
merged 8 commits into from
Mar 27, 2020
Merged

Improve the UX of the login fallback when using SSO #7152

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
bfb939a
Improve the UX of the login fallback when using SSO
babolivier Mar 26, 2020
1c02f20
Changelog
babolivier Mar 26, 2020
adb38c0
Fix title updates
babolivier Mar 27, 2020
45409c2
Incorporate review
babolivier Mar 27, 2020
706e426
Drop CAS entirely
babolivier Mar 27, 2020
74e22d0
Incorporate review
babolivier Mar 27, 2020
71f21c2
Incorporate review
babolivier Mar 27, 2020
781f104
Typo
babolivier Mar 27, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions changelog.d/7152.feature
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Improve the support for SSO authentication on the login fallback page.
2 changes: 1 addition & 1 deletion synapse/static/client/login/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<body onload="matrixLogin.onLoad()">
<center>
<br/>
<h1>Log in with one of the following methods</h1>
<h1 id="title"></h1>

<span id="feedback" style="color: #f00"></span>

Expand Down
51 changes: 30 additions & 21 deletions synapse/static/client/login/js/login.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,37 +1,41 @@
window.matrixLogin = {
endpoint: location.origin + "/_matrix/client/r0/login",
serverAcceptsPassword: false,
serverAcceptsCas: false,
serverAcceptsSso: false,
};

var title_pre_auth = "Log in with one of the following methods";
var title_post_auth = "Logging in...";

var submitPassword = function(user, pwd) {
console.log("Logging in with password...");
set_title(title_post_auth);
var data = {
type: "m.login.password",
user: user,
password: pwd,
};
$.post(matrixLogin.endpoint, JSON.stringify(data), function(response) {
show_login();
matrixLogin.onLogin(response);
}).error(errorFunc);
};

var submitToken = function(loginToken) {
console.log("Logging in with login token...");
set_title(title_post_auth);
var data = {
type: "m.login.token",
token: loginToken
};
$.post(matrixLogin.endpoint, JSON.stringify(data), function(response) {
show_login();
matrixLogin.onLogin(response);
}).error(errorFunc);
};

var errorFunc = function(err) {
show_login();
// We want to show the error to the user rather than redirecting immediately to the
// SSO portal (if SSO is the only login option), so we inhibit the redirect.
show_login(true);
babolivier marked this conversation as resolved.
Show resolved Hide resolved

if (err.responseJSON && err.responseJSON.error) {
setFeedbackString(err.responseJSON.error + " (" + err.responseJSON.errcode + ")");
Expand All @@ -45,26 +49,33 @@ var setFeedbackString = function(text) {
$("#feedback").text(text);
};

var show_login = function() {
$("#loading").hide();

var show_login = function(inhibit_redirect) {
var this_page = window.location.origin + window.location.pathname;
$("#sso_redirect_url").val(this_page);

if (matrixLogin.serverAcceptsPassword) {
$("#password_flow").show();
// If inhibit_redirect is false, and SSO is the only supported login method, we can
// redirect straight to the SSO page
if (matrixLogin.serverAcceptsSso) {
if (!inhibit_redirect && !matrixLogin.serverAcceptsPassword) {
$("#sso_form").submit();
return;
}

// Otherwise, show the SSO form
$("#sso_form").show();
}

if (matrixLogin.serverAcceptsSso) {
$("#sso_flow").show();
} else if (matrixLogin.serverAcceptsCas) {
$("#sso_form").attr("action", "/_matrix/client/r0/login/cas/redirect");
$("#sso_flow").show();
if (matrixLogin.serverAcceptsPassword) {
$("#password_flow").show();
}

if (!matrixLogin.serverAcceptsPassword && !matrixLogin.serverAcceptsCas && !matrixLogin.serverAcceptsSso) {
if (!matrixLogin.serverAcceptsPassword && !matrixLogin.serverAcceptsSso) {
$("#no_login_types").show();
}

set_title(title_pre_auth);

$("#loading").hide();
};

var show_spinner = function() {
Expand All @@ -74,17 +85,15 @@ var show_spinner = function() {
$("#loading").show();
};

var set_title = function(title) {
$("#title").text(title);
};

var fetch_info = function(cb) {
$.get(matrixLogin.endpoint, function(response) {
var serverAcceptsPassword = false;
var serverAcceptsCas = false;
for (var i=0; i<response.flows.length; i++) {
var flow = response.flows[i];
if ("m.login.cas" === flow.type) {
matrixLogin.serverAcceptsCas = true;
console.log("Server accepts CAS");
}
if ("m.login.sso" === flow.type) {
matrixLogin.serverAcceptsSso = true;
console.log("Server accepts SSO");
Expand All @@ -102,7 +111,7 @@ var fetch_info = function(cb) {
matrixLogin.onLoad = function() {
fetch_info(function() {
if (!try_token()) {
show_login();
show_login(false);
}
});
};
Expand Down