feat: fix the bug that autoSignin generates two callback AJAX calls (#1682)

This commit is contained in:
Yaodong Yu
2023-03-24 23:17:54 +08:00
committed by GitHub
parent 989fec72bf
commit 337ee2faef
4 changed files with 73 additions and 93 deletions

View File

@ -32,7 +32,6 @@ class ForgetPage extends React.Component {
this.state = {
classes: props,
applicationName: props.applicationName ?? props.match.params?.applicationName,
application: null,
msg: null,
userId: "",
username: "",
@ -49,7 +48,7 @@ class ForgetPage extends React.Component {
}
componentDidMount() {
if (this.getApplicationObj() === null) {
if (this.getApplicationObj() === undefined) {
if (this.state.applicationName !== undefined) {
this.getApplication();
} else {
@ -66,14 +65,11 @@ class ForgetPage extends React.Component {
ApplicationBackend.getApplication("admin", this.state.applicationName)
.then((application) => {
this.onUpdateApplication(application);
this.setState({
application: application,
});
});
}
getApplicationObj() {
return this.props.application ?? this.state.application;
return this.props.application;
}
onUpdateApplication(application) {
@ -436,6 +432,9 @@ class ForgetPage extends React.Component {
render() {
const application = this.getApplicationObj();
if (application === undefined) {
return null;
}
if (application === null) {
return Util.renderMessageLarge(this, this.state.msg);
}

View File

@ -38,10 +38,9 @@ class LoginPage extends React.Component {
this.state = {
classes: props,
type: props.type,
applicationName: props.applicationName !== undefined ? props.applicationName : (props.match === undefined ? null : props.match.params.applicationName),
owner: props.owner !== undefined ? props.owner : (props.match === undefined ? null : props.match.params.owner),
application: null,
mode: props.mode !== undefined ? props.mode : (props.match === undefined ? null : props.match.params.mode), // "signup" or "signin"
applicationName: props.applicationName ?? (props.match?.params?.applicationName ?? null),
owner: props.owner ?? (props.match?.params?.owner ?? null),
mode: props.mode ?? (props.match?.params?.mode ?? null), // "signup" or "signin"
msg: null,
username: null,
validEmailOrPhone: false,
@ -58,21 +57,19 @@ class LoginPage extends React.Component {
};
if (this.state.type === "cas" && props.match?.params.casApplicationName !== undefined) {
this.state.owner = props.match?.params.owner;
this.state.applicationName = props.match?.params.casApplicationName;
this.state.owner = props.match?.params?.owner;
this.state.applicationName = props.match?.params?.casApplicationName;
}
this.form = React.createRef();
}
componentDidMount() {
if (this.getApplicationObj() === null) {
if (this.state.type === "login" || this.state.type === "cas") {
if (this.getApplicationObj() === undefined) {
if (this.state.type === "login" || this.state.type === "cas" || this.state.type === "saml") {
this.getApplication();
} else if (this.state.type === "code") {
this.getApplicationLogin();
} else if (this.state.type === "saml") {
this.getSamlApplication();
} else {
Setting.showMessage("error", `Unknown authentication type: ${this.state.type}`);
}
@ -80,14 +77,35 @@ class LoginPage extends React.Component {
}
componentDidUpdate(prevProps, prevState, snapshot) {
if (this.state.application && !prevState.application) {
const captchaProviderItems = this.getCaptchaProviderItems(this.state.application);
if (!captchaProviderItems) {
return;
if (prevProps.application !== this.props.application) {
const captchaProviderItems = this.getCaptchaProviderItems(this.props.application);
if (captchaProviderItems) {
this.setState({enableCaptchaModal: captchaProviderItems.some(providerItem => providerItem.rule === "Always")});
}
this.setState({enableCaptchaModal: captchaProviderItems.some(providerItem => providerItem.rule === "Always")});
if (this.props.account && this.props.account.owner === this.props.application?.organization) {
const params = new URLSearchParams(this.props.location.search);
const silentSignin = params.get("silentSignin");
if (silentSignin !== null) {
this.sendSilentSigninData("signing-in");
const values = {};
values["application"] = this.props.application.name;
this.login(values);
}
if (params.get("popup") === "1") {
window.addEventListener("beforeunload", () => {
this.sendPopupData({type: "windowClosed"}, params.get("redirect_uri"));
});
}
if (this.props.application.enableAutoSignin) {
const values = {};
values["application"] = this.props.application.name;
this.login(values);
}
}
}
}
@ -96,46 +114,49 @@ class LoginPage extends React.Component {
AuthBackend.getApplicationLogin(oAuthParams)
.then((res) => {
if (res.status === "ok") {
this.onUpdateApplication(res.data);
this.setState({
application: res.data,
});
const application = res.data;
this.onUpdateApplication(application);
} else {
this.onUpdateApplication(null);
this.setState({
application: res.data,
msg: res.msg,
});
}
});
return null;
}
getApplication() {
if (this.state.applicationName === null) {
return;
return null;
}
if (this.state.owner === null || this.state.owner === undefined || this.state.owner === "") {
if (this.state.owner === null || this.state.type === "saml") {
ApplicationBackend.getApplication("admin", this.state.applicationName)
.then((application) => {
this.onUpdateApplication(application);
this.setState({
application: application,
}, () => Setting.getTermsOfUseContent(this.state.application.termsOfUse, res => {
this.setState({termsOfUseContent: res});
}));
if (application !== null && application !== undefined) {
Setting.getTermsOfUseContent(application.termsOfUse, res => {
this.setState({termsOfUseContent: res});
});
}
});
} else {
OrganizationBackend.getDefaultApplication("admin", this.state.owner)
.then((res) => {
if (res.status === "ok") {
this.onUpdateApplication(res.data);
const application = res.data;
this.onUpdateApplication(application);
this.setState({
application: res.data,
applicationName: res.data.name,
}, () => Setting.getTermsOfUseContent(this.state.application.termsOfUse, res => {
this.setState({termsOfUseContent: res});
}));
});
if (application !== null && application !== undefined) {
Setting.getTermsOfUseContent(application.termsOfUse, res => {
this.setState({termsOfUseContent: res});
});
}
} else {
this.onUpdateApplication(null);
Setting.showMessage("error", res.msg);
@ -144,21 +165,8 @@ class LoginPage extends React.Component {
}
}
getSamlApplication() {
if (this.state.applicationName === null) {
return;
}
ApplicationBackend.getApplication(this.state.owner, this.state.applicationName)
.then((application) => {
this.onUpdateApplication(application);
this.setState({
application: application,
});
});
}
getApplicationObj() {
return this.props.application ?? this.state.application;
return this.props.application;
}
onUpdateAccount(account) {
@ -310,7 +318,6 @@ class LoginPage extends React.Component {
Setting.goToLink(link);
} else if (responseType === "code") {
this.postCodeLoginAction(res);
// Setting.showMessage("success", `Authorization code: ${res.data}`);
} else if (responseType === "token" || responseType === "id_token") {
const accessToken = res.data;
Setting.goToLink(`${oAuthParams.redirectUri}#${responseType}=${accessToken}?state=${oAuthParams.state}&token_type=bearer`);
@ -626,32 +633,10 @@ class LoginPage extends React.Component {
}
const application = this.getApplicationObj();
if (this.props.account.owner !== application.organization) {
if (this.props.account.owner !== application?.organization) {
return null;
}
const params = new URLSearchParams(this.props.location.search);
const silentSignin = params.get("silentSignin");
if (silentSignin !== null) {
this.sendSilentSigninData("signing-in");
const values = {};
values["application"] = application.name;
this.onFinish(values);
}
if (params.get("popup") === "1") {
window.addEventListener("beforeunload", () => {
this.sendPopupData({type: "windowClosed"}, params.get("redirect_uri"));
});
}
if (application.enableAutoSignin) {
const values = {};
values["application"] = application.name;
this.onFinish(values);
}
return (
<div>
<div style={{fontSize: 16, textAlign: "left"}}>
@ -661,7 +646,7 @@ class LoginPage extends React.Component {
<SelfLoginButton account={this.props.account} onClick={() => {
const values = {};
values["application"] = application.name;
this.onFinish(values);
this.login(values);
}} />
<br />
<br />
@ -803,6 +788,9 @@ class LoginPage extends React.Component {
render() {
const application = this.getApplicationObj();
if (application === undefined) {
return null;
}
if (application === null) {
return Util.renderMessageLarge(this, this.state.msg);
}

View File

@ -40,7 +40,7 @@ class SelfLoginButton extends React.Component {
};
const SelfLoginButton = createButton(config);
return <SelfLoginButton text={this.getAccountShowName()} onClick={() => this.props.onClick()} align={"center"} />;
return <SelfLoginButton text={this.getAccountShowName()} onClick={this.props.onClick} align={"center"} />;
}
}

View File

@ -65,8 +65,7 @@ class SignupPage extends React.Component {
super(props);
this.state = {
classes: props,
applicationName: props.match.params?.applicationName ?? authConfig.appName,
application: null,
applicationName: props.match?.params?.applicationName ?? authConfig.appName,
email: "",
phone: "",
countryCode: "",
@ -83,20 +82,17 @@ class SignupPage extends React.Component {
}
componentDidMount() {
let applicationName = this.state.applicationName;
const oAuthParams = Util.getOAuthGetParameters();
if (oAuthParams !== null) {
applicationName = oAuthParams.state;
this.setState({applicationName: oAuthParams.state});
const signinUrl = window.location.href.replace("/signup/oauth/authorize", "/login/oauth/authorize");
sessionStorage.setItem("signinUrl", signinUrl);
}
if (this.getApplicationObj() === null) {
if (applicationName !== undefined) {
this.getApplication(applicationName);
if (this.getApplicationObj() === undefined) {
if (this.state.applicationName !== null) {
this.getApplication(this.state.applicationName);
} else {
Setting.showMessage("error", `Unknown application name: ${applicationName}`);
Setting.showMessage("error", `Unknown application name: ${this.state.applicationName}`);
}
}
}
@ -109,9 +105,6 @@ class SignupPage extends React.Component {
ApplicationBackend.getApplication("admin", applicationName)
.then((application) => {
this.onUpdateApplication(application);
this.setState({
application: application,
});
if (application !== null && application !== undefined) {
Setting.getTermsOfUseContent(application.termsOfUse, res => {
@ -134,7 +127,7 @@ class SignupPage extends React.Component {
}
getApplicationObj() {
return this.props.application ?? this.state.application;
return this.props.application;
}
onUpdateAccount(account) {
@ -596,7 +589,7 @@ class SignupPage extends React.Component {
render() {
const application = this.getApplicationObj();
if (application === null) {
if (application === undefined || application === null) {
return null;
}