mirror of
https://github.com/dreamhunter2333/cloudflare_temp_email.git
synced 2026-05-11 09:59:46 +08:00
* feat: add Turnstile CAPTCHA for login forms (#767) Add optional Turnstile verification for admin login, user login, and address password login via ENABLE_LOGIN_TURNSTILE_CHECK env var. Does not affect existing Turnstile on address creation / registration. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * docs: add ENABLE_LOGIN_TURNSTILE_CHECK to wrangler.toml.template Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: ensure openSettings loaded before admin login modal Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * feat: add Turnstile to site access password and fix settings field name - Add Turnstile to site access password modal in Header.vue - Add /open_api/site_login endpoint for password + Turnstile verification - Fix settings field name from enableTurnstileLogin to enableLoginTurnstileCheck Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * refactor: move login endpoints to open_api/auth.ts Move /open_api/site_login and /open_api/admin_login from commom_api.ts to a dedicated open_api/auth.ts file for better code organization. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: change Turnstile check failure status from 500 to 400 Turnstile validation failure is a client error, not a server error. Change all Turnstile check error responses from 500 to 400. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: use unique IDs for multiple Turnstile instances When multiple modals with Turnstile appear simultaneously (e.g., site access + admin login), the hardcoded id="cf-turnstile" causes conflicts. Generate a unique container ID per Turnstile instance to fix this. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: review fixes - cfToken separation, register Turnstile, error codes - Separate cfToken refs in Login.vue to avoid token sharing between login and new address creation Turnstile instances - Add Turnstile check to user registration endpoint (not just verify_code) - Show Turnstile on register tab regardless of enableMailVerify - Pass cf_token in register request body - Fix site_login error message to use CustomAuthPasswordMsg - Fix verifyCode Turnstile error status from 500 to 400 - Restore empty line in commom_api.ts Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: separate register Turnstile logic for with/without mail verify - With mail verify: verify_code already checks Turnstile, register skips Turnstile (token is one-time use) - Without mail verify: register checks Turnstile directly - Separate loginCfToken for login tab to avoid token sharing with register tab Turnstile Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: add enableLoginTurnstileCheck to store defaults, simplify changelog Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: add /open_api/credential_login for credential login verification Add credential_login endpoint that verifies both Turnstile token and JWT credential server-side, replacing the generic verify_turnstile endpoint. Credential login now validates the JWT before accepting it. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: improve login endpoints - hash passwords, expose Turnstile refresh, fix status codes - site_login/admin_login: always called, verify hashed password + optional Turnstile - credential_login: always called, verify JWT + optional Turnstile - Frontend sends hashed passwords instead of plaintext - Turnstile component exposes refresh method via defineExpose - Fix Turnstile error status 500→400 in mails_api and telegram_api Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * refactor: rename to ENABLE_GLOBAL_TURNSTILE_CHECK and add isGlobalTurnstileEnabled helper - Rename ENABLE_LOGIN_TURNSTILE_CHECK -> ENABLE_GLOBAL_TURNSTILE_CHECK - Add isGlobalTurnstileEnabled() in utils.ts: checks env var + Turnstile keys all present - Backend settings returns enableGlobalTurnstileCheck computed from the helper - All backend endpoints use isGlobalTurnstileEnabled(c) instead of raw env check - Update all frontend refs, docs, changelog, and wrangler template Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * refactor: use utils.isGlobalTurnstileEnabled instead of named import Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * test: add E2E tests for turnstile login endpoints - Test all 3 new /open_api/* endpoints when ENABLE_GLOBAL_TURNSTILE_CHECK is disabled - Verify settings returns enableGlobalTurnstileCheck: false - Test admin_login with correct/wrong/empty hashed password - Test site_login returns 401 when no PASSWORDS configured - Test credential_login with valid JWT, invalid JWT, empty credential - Test address_login with empty cf_token works when turnstile disabled - Add ADMIN_PASSWORDS to E2E wrangler config for admin_login tests Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * test: rename test file to login-endpoints.spec.ts Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: validate JWT payload has address field in credential_login Prevents user tokens or challenge tokens from being accepted as address credentials since they share the same JWT_SECRET. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: refresh Turnstile token on login failure to allow retry After a failed login attempt, the consumed Turnstile token is now refreshed so users can retry without manually refreshing. Also adds ref to signup Turnstile in UserLogin.vue to refresh after verification code is sent (single-use token consumed). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: separate Turnstile tokens for signup and reset password flows Split shared cfToken into signupCfToken and resetCfToken to prevent single-use Turnstile token conflicts between signup tab and reset password modal. Each flow now has its own token ref and refreshes the correct Turnstile widget after use. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: update comments from "login turnstile" to "global turnstile" Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dream Hunter
@@ -93,6 +93,7 @@ const getOpenSettings = async (message, notification) => {
|
||||
isS3Enabled: res["isS3Enabled"] || false,
|
||||
enableAddressPassword: res["enableAddressPassword"] || false,
|
||||
statusUrl: res["statusUrl"] || "",
|
||||
enableGlobalTurnstileCheck: res["enableGlobalTurnstileCheck"] || false,
|
||||
});
|
||||
if (openSettings.value.needAuth) {
|
||||
showAuth.value = true;
|
||||
|
||||
@@ -17,17 +17,21 @@ const { locale, t } = useI18n({
|
||||
}
|
||||
});
|
||||
|
||||
const containerId = `cf-turnstile-${Math.random().toString(36).slice(2, 9)}`
|
||||
const cfTurnstileId = ref("")
|
||||
const turnstileLoading = ref(false)
|
||||
|
||||
const refresh = () => checkCfTurnstile(true)
|
||||
defineExpose({ refresh })
|
||||
|
||||
const checkCfTurnstile = async (remove) => {
|
||||
if (!openSettings.value.cfTurnstileSiteKey) return;
|
||||
turnstileLoading.value = true;
|
||||
try {
|
||||
let container = document.getElementById("cf-turnstile");
|
||||
let container = document.getElementById(containerId);
|
||||
let count = 100;
|
||||
while (!container && count-- > 0) {
|
||||
container = document.getElementById("cf-turnstile");
|
||||
container = document.getElementById(containerId);
|
||||
await new Promise(r => setTimeout(r, 10));
|
||||
}
|
||||
count = 100;
|
||||
@@ -38,7 +42,7 @@ const checkCfTurnstile = async (remove) => {
|
||||
window.turnstile.remove(cfTurnstileId.value);
|
||||
}
|
||||
cfTurnstileId.value = window.turnstile.render(
|
||||
"#cf-turnstile",
|
||||
`#${containerId}`,
|
||||
{
|
||||
sitekey: openSettings.value.cfTurnstileSiteKey,
|
||||
language: locale.value == 'zh' ? 'zh-CN' : 'en-US',
|
||||
@@ -68,7 +72,7 @@ onMounted(() => {
|
||||
<n-spin description="loading..." :show="turnstileLoading">
|
||||
<n-form-item-row>
|
||||
<n-flex vertical>
|
||||
<div id="cf-turnstile"></div>
|
||||
<div :id="containerId"></div>
|
||||
<n-button text @click="checkCfTurnstile(true)">
|
||||
{{ t('refresh') }}
|
||||
</n-button>
|
||||
|
||||
@@ -39,6 +39,7 @@ export const useGlobalState = createGlobalState(
|
||||
disableAdminPasswordCheck: false,
|
||||
enableAddressPassword: false,
|
||||
statusUrl: '',
|
||||
enableGlobalTurnstileCheck: false,
|
||||
})
|
||||
const settings = ref({
|
||||
fetched: false,
|
||||
|
||||
@@ -5,7 +5,8 @@ import { useRouter } from 'vue-router'
|
||||
|
||||
import { useGlobalState } from '../store'
|
||||
import { api } from '../api'
|
||||
import { getRouterPathWithLang } from '../utils'
|
||||
import { getRouterPathWithLang, hashPassword } from '../utils'
|
||||
import Turnstile from '../components/Turnstile.vue'
|
||||
|
||||
import SenderAccess from './admin/SenderAccess.vue'
|
||||
import Statistics from "./admin/Statistics.vue"
|
||||
@@ -44,12 +45,23 @@ const SendMail = defineAsyncComponent(() => {
|
||||
.finally(() => loading.value = false);
|
||||
});
|
||||
|
||||
const cfToken = ref('')
|
||||
const turnstileRef = ref(null)
|
||||
|
||||
const authFunc = async () => {
|
||||
try {
|
||||
await api.fetch('/open_api/admin_login', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
password: await hashPassword(tmpAdminAuth.value),
|
||||
cf_token: cfToken.value
|
||||
})
|
||||
});
|
||||
adminAuth.value = tmpAdminAuth.value;
|
||||
location.reload()
|
||||
} catch (error) {
|
||||
message.error(error.message || "error");
|
||||
turnstileRef.value?.refresh?.();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -169,6 +181,8 @@ const currentLoginMethod = computed(() => {
|
||||
})
|
||||
|
||||
onMounted(async () => {
|
||||
// make sure openSettings is fetched for turnstile check
|
||||
if (!openSettings.value.fetched) await api.getOpenSettings(message);
|
||||
// make sure user_id is fetched
|
||||
if (!userSettings.value.user_id) await api.getUserSettings(message);
|
||||
})
|
||||
@@ -180,6 +194,7 @@ onMounted(async () => {
|
||||
preset="dialog" :title="t('accessHeader')">
|
||||
<p>{{ t('accessTip') }}</p>
|
||||
<n-input v-model:value="tmpAdminAuth" type="password" show-password-on="click" />
|
||||
<Turnstile ref="turnstileRef" v-if="openSettings.enableGlobalTurnstileCheck" v-model:value="cfToken" />
|
||||
<template #action>
|
||||
<n-button @click="authFunc" type="primary" :loading="loading">
|
||||
{{ t('ok') }}
|
||||
|
||||
@@ -12,7 +12,8 @@ import { GithubAlt, Language, User, Home } from '@vicons/fa'
|
||||
|
||||
import { useGlobalState } from '../store'
|
||||
import { api } from '../api'
|
||||
import { getRouterPathWithLang } from '../utils'
|
||||
import { getRouterPathWithLang, hashPassword } from '../utils'
|
||||
import Turnstile from '../components/Turnstile.vue'
|
||||
|
||||
const message = useMessage()
|
||||
const notification = useNotification()
|
||||
@@ -32,11 +33,22 @@ const menuValue = computed(() => {
|
||||
return "home";
|
||||
});
|
||||
|
||||
const cfToken = ref('')
|
||||
const turnstileRef = ref(null)
|
||||
|
||||
const authFunc = async () => {
|
||||
try {
|
||||
await api.fetch('/open_api/site_login', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
password: await hashPassword(auth.value),
|
||||
cf_token: cfToken.value
|
||||
})
|
||||
});
|
||||
location.reload()
|
||||
} catch (error) {
|
||||
message.error(error.message || "error");
|
||||
turnstileRef.value?.refresh?.();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -287,6 +299,7 @@ onMounted(async () => {
|
||||
:title="t('accessHeader')">
|
||||
<p>{{ t('accessTip') }}</p>
|
||||
<n-input v-model:value="auth" type="password" show-password-on="click" />
|
||||
<Turnstile ref="turnstileRef" v-if="openSettings.enableGlobalTurnstileCheck" v-model:value="cfToken" />
|
||||
<template #action>
|
||||
<n-button :loading="loading" @click="authFunc" type="primary">
|
||||
{{ t('ok') }}
|
||||
|
||||
@@ -47,6 +47,8 @@ const credential = ref('')
|
||||
const emailName = ref("")
|
||||
const emailDomain = ref("")
|
||||
const cfToken = ref("")
|
||||
const loginCfToken = ref("")
|
||||
const loginTurnstileRef = ref(null)
|
||||
const loginMethod = ref('credential') // 'credential' or 'password'
|
||||
const loginAddress = ref('')
|
||||
const loginPassword = ref('')
|
||||
@@ -72,7 +74,8 @@ const login = async () => {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
email: loginAddress.value,
|
||||
password: await hashPassword(loginPassword.value)
|
||||
password: await hashPassword(loginPassword.value),
|
||||
cf_token: loginCfToken.value
|
||||
})
|
||||
});
|
||||
jwt.value = res.jwt;
|
||||
@@ -85,6 +88,7 @@ const login = async () => {
|
||||
await router.push(getRouterPathWithLang("/", locale.value));
|
||||
} catch (error) {
|
||||
message.error(error.message || "error");
|
||||
loginTurnstileRef.value?.refresh?.();
|
||||
}
|
||||
return;
|
||||
}
|
||||
@@ -93,6 +97,13 @@ const login = async () => {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await api.fetch('/open_api/credential_login', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
credential: credential.value,
|
||||
cf_token: loginCfToken.value
|
||||
})
|
||||
});
|
||||
jwt.value = credential.value;
|
||||
await api.getSettings();
|
||||
try {
|
||||
@@ -103,6 +114,7 @@ const login = async () => {
|
||||
await router.push(getRouterPathWithLang("/", locale.value));
|
||||
} catch (error) {
|
||||
message.error(error.message || "error");
|
||||
loginTurnstileRef.value?.refresh?.();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -289,6 +301,9 @@ onMounted(async () => {
|
||||
</n-form-item-row>
|
||||
</div>
|
||||
|
||||
<Turnstile ref="loginTurnstileRef" v-if="openSettings.enableGlobalTurnstileCheck"
|
||||
v-model:value="loginCfToken" />
|
||||
|
||||
<div class="switch-login-button">
|
||||
<n-button v-if="openSettings?.enableAddressPassword"
|
||||
@click="loginMethod === 'password' ? loginMethod = 'credential' : loginMethod = 'password'"
|
||||
|
||||
@@ -69,7 +69,12 @@ const user = ref({
|
||||
password: "",
|
||||
code: ""
|
||||
});
|
||||
const cfToken = ref("")
|
||||
const signupCfToken = ref("")
|
||||
const resetCfToken = ref("")
|
||||
const loginCfToken = ref("")
|
||||
const signupTurnstileRef = ref(null)
|
||||
const resetTurnstileRef = ref(null)
|
||||
const loginTurnstileRef = ref(null)
|
||||
|
||||
const emailLogin = async () => {
|
||||
if (!user.value.email || !user.value.password) {
|
||||
@@ -82,13 +87,15 @@ const emailLogin = async () => {
|
||||
body: JSON.stringify({
|
||||
email: user.value.email,
|
||||
// hash password
|
||||
password: await hashPassword(user.value.password)
|
||||
password: await hashPassword(user.value.password),
|
||||
cf_token: loginCfToken.value
|
||||
})
|
||||
});
|
||||
userJwt.value = res.jwt;
|
||||
location.reload();
|
||||
} catch (error) {
|
||||
message.error(error.message || "login failed");
|
||||
loginTurnstileRef.value?.refresh?.();
|
||||
}
|
||||
};
|
||||
|
||||
@@ -105,7 +112,8 @@ const sendVerificationCode = async () => {
|
||||
message.error(t('pleaseInputEmail'));
|
||||
return;
|
||||
}
|
||||
if (openSettings.value.cfTurnstileSiteKey && !cfToken.value && userOpenSettings.value.enableMailVerify) {
|
||||
const currentCfToken = showModal.value ? resetCfToken.value : signupCfToken.value;
|
||||
if (openSettings.value.cfTurnstileSiteKey && !currentCfToken && userOpenSettings.value.enableMailVerify) {
|
||||
message.error(t('pleaseCompleteTurnstile'));
|
||||
return;
|
||||
}
|
||||
@@ -114,7 +122,7 @@ const sendVerificationCode = async () => {
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
email: user.value.email,
|
||||
cf_token: cfToken.value
|
||||
cf_token: currentCfToken
|
||||
})
|
||||
});
|
||||
if (res && res.expirationTtl) {
|
||||
@@ -131,6 +139,11 @@ const sendVerificationCode = async () => {
|
||||
} catch (error) {
|
||||
message.error(error.message || "send verification code failed");
|
||||
}
|
||||
if (showModal.value) {
|
||||
resetTurnstileRef.value?.refresh?.();
|
||||
} else {
|
||||
signupTurnstileRef.value?.refresh?.();
|
||||
}
|
||||
};
|
||||
|
||||
const emailSignup = async () => {
|
||||
@@ -149,7 +162,8 @@ const emailSignup = async () => {
|
||||
email: user.value.email,
|
||||
// hash password
|
||||
password: await hashPassword(user.value.password),
|
||||
code: user.value.code
|
||||
code: user.value.code,
|
||||
cf_token: showModal.value ? resetCfToken.value : signupCfToken.value
|
||||
}),
|
||||
message: message
|
||||
});
|
||||
@@ -218,6 +232,7 @@ onMounted(async () => {
|
||||
<n-form-item-row :label="t('password')" required>
|
||||
<n-input v-model:value="user.password" type="password" show-password-on="click" />
|
||||
</n-form-item-row>
|
||||
<Turnstile ref="loginTurnstileRef" v-if="openSettings.enableGlobalTurnstileCheck" v-model:value="loginCfToken" />
|
||||
<n-button @click="emailLogin" type="primary" block secondary strong>
|
||||
{{ t('login') }}
|
||||
</n-button>
|
||||
@@ -248,7 +263,7 @@ onMounted(async () => {
|
||||
<n-form-item-row :label="t('password')" required>
|
||||
<n-input v-model:value="user.password" type="password" show-password-on="click" />
|
||||
</n-form-item-row>
|
||||
<Turnstile v-if="userOpenSettings.enableMailVerify" v-model:value="cfToken" />
|
||||
<Turnstile ref="signupTurnstileRef" v-if="userOpenSettings.enableMailVerify" v-model:value="signupCfToken" />
|
||||
<n-form-item-row v-if="userOpenSettings.enableMailVerify" :label="t('verifyCode')" required>
|
||||
<n-input-group>
|
||||
<n-input v-model:value="user.code" />
|
||||
@@ -259,6 +274,7 @@ onMounted(async () => {
|
||||
</n-button>
|
||||
</n-input-group>
|
||||
</n-form-item-row>
|
||||
<Turnstile ref="signupTurnstileRef" v-if="!userOpenSettings.enableMailVerify" v-model:value="signupCfToken" />
|
||||
</n-form>
|
||||
<n-button @click="emailSignup" type="primary" block secondary strong>
|
||||
{{ t('register') }}
|
||||
@@ -273,7 +289,7 @@ onMounted(async () => {
|
||||
<n-form-item-row :label="t('password')" required>
|
||||
<n-input v-model:value="user.password" type="password" show-password-on="click" />
|
||||
</n-form-item-row>
|
||||
<Turnstile v-model:value="cfToken" />
|
||||
<Turnstile ref="resetTurnstileRef" v-model:value="resetCfToken" />
|
||||
<n-form-item-row :label="t('verifyCode')" required>
|
||||
<n-input-group>
|
||||
<n-input v-model:value="user.code" />
|
||||
|
||||
Reference in New Issue
Block a user