Optimize Turnstile load

This commit is contained in:
2024-03-01 17:50:34 +08:00
parent 3b11b262b9
commit c67b7b911a
7 changed files with 58 additions and 10 deletions

View File

@@ -6,6 +6,7 @@ import {
PERMISSION_RETRIEVE_CODE_ERROR_OR_EXPIRED,
PERMISSION_RETRIEVE_SUCCESS,
PERMISSION_USER_NOT_FOUND,
SIZE_ICON_MD,
SYSTEM_INVALID_CAPTCHA_CODE
} from '@/constants/common.constants'
import { r_auth_forget, r_auth_retrieve } from '@/services/auth'
@@ -160,11 +161,21 @@ const Forget = () => {
/>
</AntdForm.Item>
<AntdForm.Item>
{!turnstileRef.current && (
<div className={'loading-turnstile'}>
<Icon
component={IconOxygenLoading}
style={{ fontSize: SIZE_ICON_MD }}
spin
/>
</div>
)}
<Turnstile
id={'forget-turnstile'}
ref={turnstileRefCallback}
siteKey={H_CAPTCHA_SITE_KEY}
options={{ theme: 'light', execution: 'execute' }}
hidden={!turnstileRef.current}
options={{ theme: 'light' }}
onSuccess={setCaptchaCode}
/>
</AntdForm.Item>
@@ -232,11 +243,21 @@ const Forget = () => {
/>
</AntdForm.Item>
<AntdForm.Item>
{!turnstileRef.current && (
<div className={'loading-turnstile'}>
<Icon
component={IconOxygenLoading}
style={{ fontSize: SIZE_ICON_MD }}
spin
/>
</div>
)}
<Turnstile
id={'retrieve-turnstile'}
ref={retrieveTurnstileRefCallback}
siteKey={H_CAPTCHA_SITE_KEY}
options={{ theme: 'light', execution: 'execute' }}
hidden={!turnstileRef.current}
options={{ theme: 'light' }}
onSuccess={setRetrieveCaptchaCode}
/>
</AntdForm.Item>

View File

@@ -8,6 +8,7 @@ import {
PERMISSION_TWO_FACTOR_VERIFICATION_CODE_ERROR,
PERMISSION_USER_DISABLE,
PERMISSION_USERNAME_NOT_FOUND,
SIZE_ICON_MD,
SYSTEM_INVALID_CAPTCHA_CODE
} from '@/constants/common.constants'
import { getUserInfo, setToken } from '@/util/auth'
@@ -226,11 +227,21 @@ const SignIn = () => {
/>
</AntdForm.Item>
<AntdForm.Item>
{!turnstileRef.current && (
<div className={'loading-turnstile'}>
<Icon
component={IconOxygenLoading}
style={{ fontSize: SIZE_ICON_MD }}
spin
/>
</div>
)}
<Turnstile
id={'sign-in-turnstile'}
ref={turnstileRefCallback}
siteKey={H_CAPTCHA_SITE_KEY}
options={{ theme: 'light', execution: 'execute' }}
hidden={!turnstileRef.current}
options={{ theme: 'light' }}
onSuccess={setCaptchaCode}
/>
</AntdForm.Item>

View File

@@ -4,6 +4,7 @@ import {
DATABASE_DUPLICATE_KEY,
H_CAPTCHA_SITE_KEY,
PERMISSION_REGISTER_SUCCESS,
SIZE_ICON_MD,
SYSTEM_INVALID_CAPTCHA_CODE,
SYSTEM_MATCH_SENSITIVE_WORD
} from '@/constants/common.constants'
@@ -200,11 +201,21 @@ const SignUp = () => {
/>
</AntdForm.Item>
<AntdForm.Item>
{!turnstileRef.current && (
<div className={'loading-turnstile'}>
<Icon
component={IconOxygenLoading}
style={{ fontSize: SIZE_ICON_MD }}
spin
/>
</div>
)}
<Turnstile
id={'sign-up-turnstile'}
ref={turnstileRefCallback}
siteKey={H_CAPTCHA_SITE_KEY}
options={{ theme: 'light', execution: 'execute' }}
hidden={!turnstileRef.current}
options={{ theme: 'light' }}
onSuccess={setCaptchaCode}
/>
</AntdForm.Item>