llvy.ltd/casdoor
1
0
Fork 0
mirror of https://github.com/casdoor/casdoor.git synced 2025-09-08 04:00:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: refresh inline captcha on login failure (#4108)

Browse Source
This commit is contained in:
Attack825
2025-08-21 10:29:56 +08:00
committed by GitHub
parent e533ff1ee1
commit f7bc822087
2 changed files with 18 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
web/src/auth/LoginPage.js
View File

@@ -46,6 +46,7 @@ const FaceRecognitionModal = lazy(() => import("../common/modal/FaceRecognitionM
class LoginPage extends React.Component { class LoginPage extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.captchaRef = React.createRef();
this.state = { this.state = {
classes: props, classes: props,
type: props.type, type: props.type,
@@ -466,6 +467,7 @@ class LoginPage extends React.Component {
login(values) { login(values) {
// here we are supposed to determine whether Casdoor is working as an OAuth server or CAS server // here we are supposed to determine whether Casdoor is working as an OAuth server or CAS server
values["language"] = this.state.userLang ?? ""; values["language"] = this.state.userLang ?? "";
const usedCaptcha = this.state.captchaValues !== undefined;
if (this.state.type === "cas") { if (this.state.type === "cas") {
// CAS // CAS
const casParams = Util.getCasParameters(); const casParams = Util.getCasParameters();
@@ -492,6 +494,9 @@ class LoginPage extends React.Component {
Setting.checkLoginMfa(res, values, casParams, loginHandler, this); Setting.checkLoginMfa(res, values, casParams, loginHandler, this);
} else { } else {
Setting.showMessage("error", `${i18next.t("application:Failed to sign in")}: ${res.msg}`); Setting.showMessage("error", `${i18next.t("application:Failed to sign in")}: ${res.msg}`);
if (usedCaptcha) {
this.captchaRef.current?.loadCaptcha?.();
}
} }
}).finally(() => { }).finally(() => {
this.setState({loginLoading: false}); this.setState({loginLoading: false});
@@ -565,6 +570,9 @@ class LoginPage extends React.Component {
Setting.checkLoginMfa(res, values, oAuthParams, loginHandler, this); Setting.checkLoginMfa(res, values, oAuthParams, loginHandler, this);
} else { } else {
Setting.showMessage("error", `${i18next.t("application:Failed to sign in")}: ${res.msg}`); Setting.showMessage("error", `${i18next.t("application:Failed to sign in")}: ${res.msg}`);
if (usedCaptcha) {
this.captchaRef.current?.loadCaptcha?.();
}
} }
}).finally(() => { }).finally(() => {
this.setState({loginLoading: false}); this.setState({loginLoading: false});
@@ -1124,6 +1132,7 @@ class LoginPage extends React.Component {
}} }}
onCancel={() => this.setState({openCaptchaModal: false, loginLoading: false})} onCancel={() => this.setState({openCaptchaModal: false, loginLoading: false})}
isCurrentProvider={true} isCurrentProvider={true}
innerRef={this.captchaRef}
/>; />;
} }

10
web/src/common/modal/CaptchaModal.js
View File

@@ -20,7 +20,7 @@ import {CaptchaWidget} from "../CaptchaWidget";
import {SafetyOutlined} from "@ant-design/icons"; import {SafetyOutlined} from "@ant-design/icons";
export const CaptchaModal = (props) => { export const CaptchaModal = (props) => {
const {owner, name, visible, onOk, onUpdateToken, onCancel, isCurrentProvider, noModal} = props; const {owner, name, visible, onOk, onUpdateToken, onCancel, isCurrentProvider, noModal, innerRef} = props;
const [captchaType, setCaptchaType] = React.useState("none"); const [captchaType, setCaptchaType] = React.useState("none");
const [clientId, setClientId] = React.useState(""); const [clientId, setClientId] = React.useState("");
@@ -59,6 +59,14 @@ export const CaptchaModal = (props) => {
onCancel?.(); onCancel?.();
}; };
useEffect(() => {
if (innerRef) {
innerRef.current = {
loadCaptcha: loadCaptcha,
};
}
}, [innerRef]);
const loadCaptcha = () => { const loadCaptcha = () => {
UserBackend.getCaptcha(owner, name, isCurrentProvider).then((res) => { UserBackend.getCaptcha(owner, name, isCurrentProvider).then((res) => {
if (res.type === "none") { if (res.type === "none") {