upd: add FriendlyCaptcha as a captcha solution
FriendlyCaptcha is a german captcha solution which is GDPR compliant and has a non-commerical free license
This commit is contained in:
Marie
parent
8824422cb5
commit
d786e96c2b
18 changed files with 175 additions and 7 deletions
|
|
@ -27,9 +27,12 @@ export type Captcha = {
|
|||
execute(id: string): void;
|
||||
reset(id?: string): void;
|
||||
getResponse(id: string): string;
|
||||
WidgetInstance(container: string | Node, options: {
|
||||
readonly [_ in 'sitekey' | 'doneCallback' | 'errorCallback' | 'puzzleEndpoint']?: unknown;
|
||||
}): void;
|
||||
};
|
||||
|
||||
export type CaptchaProvider = 'hcaptcha' | 'recaptcha' | 'turnstile' | 'mcaptcha';
|
||||
export type CaptchaProvider = 'hcaptcha' | 'recaptcha' | 'turnstile' | 'mcaptcha' | 'fc';
|
||||
|
||||
type CaptchaContainer = {
|
||||
readonly [_ in CaptchaProvider]?: Captcha;
|
||||
|
|
@ -60,6 +63,7 @@ const variable = computed(() => {
|
|||
case 'recaptcha': return 'grecaptcha';
|
||||
case 'turnstile': return 'turnstile';
|
||||
case 'mcaptcha': return 'mcaptcha';
|
||||
case 'fc': return 'friendlyChallenge';
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -70,6 +74,7 @@ const src = computed(() => {
|
|||
case 'hcaptcha': return 'https://js.hcaptcha.com/1/api.js?render=explicit&recaptchacompat=off';
|
||||
case 'recaptcha': return 'https://www.recaptcha.net/recaptcha/api.js?render=explicit';
|
||||
case 'turnstile': return 'https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit';
|
||||
case 'fc': return 'https://cdn.jsdelivr.net/npm/friendly-challenge@0.9.18/widget.min.js';
|
||||
case 'mcaptcha': return null;
|
||||
}
|
||||
});
|
||||
|
|
@ -110,6 +115,14 @@ async function requestRender() {
|
|||
key: props.sitekey,
|
||||
},
|
||||
});
|
||||
} else if (variable.value === 'friendlyChallenge' && captchaEl.value instanceof Element) {
|
||||
new captcha.value.WidgetInstance(captchaEl.value, {
|
||||
sitekey: props.sitekey,
|
||||
doneCallback: callback,
|
||||
errorCallback: callback,
|
||||
});
|
||||
// The following line is needed so that the design gets applied without it the captcha will look broken
|
||||
captchaEl.value.className = 'frc-captcha';
|
||||
} else {
|
||||
window.setTimeout(requestRender, 1);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -70,6 +70,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkCaptcha v-if="instance.enableMcaptcha" ref="mcaptcha" v-model="mCaptchaResponse" :class="$style.captcha" provider="mcaptcha" :sitekey="instance.mcaptchaSiteKey" :instanceUrl="instance.mcaptchaInstanceUrl"/>
|
||||
<MkCaptcha v-if="instance.enableRecaptcha" ref="recaptcha" v-model="reCaptchaResponse" :class="$style.captcha" provider="recaptcha" :sitekey="instance.recaptchaSiteKey"/>
|
||||
<MkCaptcha v-if="instance.enableTurnstile" ref="turnstile" v-model="turnstileResponse" :class="$style.captcha" provider="turnstile" :sitekey="instance.turnstileSiteKey"/>
|
||||
<MkCaptcha v-if="instance.enableFC" ref="fc" v-model="fcResponse" :class="$style.captcha" provider="fc" :sitekey="instance.fcSiteKey"/>
|
||||
<MkButton type="submit" :disabled="shouldDisableSubmitting" large gradate rounded data-cy-signup-submit style="margin: 0 auto;">
|
||||
<template v-if="submitting">
|
||||
<MkLoading :em="true" :colored="false"/>
|
||||
|
|
@ -112,6 +113,7 @@ const host = toUnicode(config.host);
|
|||
const hcaptcha = ref<Captcha | undefined>();
|
||||
const recaptcha = ref<Captcha | undefined>();
|
||||
const turnstile = ref<Captcha | undefined>();
|
||||
const fc = ref<Captcha | undefined>();
|
||||
|
||||
const username = ref<string>('');
|
||||
const password = ref<string>('');
|
||||
|
|
@ -128,6 +130,7 @@ const hCaptchaResponse = ref<string | null>(null);
|
|||
const mCaptchaResponse = ref<string | null>(null);
|
||||
const reCaptchaResponse = ref<string | null>(null);
|
||||
const turnstileResponse = ref<string | null>(null);
|
||||
const fcResponse = ref<string | null>(null);
|
||||
const usernameAbortController = ref<null | AbortController>(null);
|
||||
const emailAbortController = ref<null | AbortController>(null);
|
||||
|
||||
|
|
@ -137,6 +140,7 @@ const shouldDisableSubmitting = computed((): boolean => {
|
|||
instance.enableMcaptcha && !mCaptchaResponse.value ||
|
||||
instance.enableRecaptcha && !reCaptchaResponse.value ||
|
||||
instance.enableTurnstile && !turnstileResponse.value ||
|
||||
instance.enableFC && !fcResponse.value ||
|
||||
instance.emailRequiredForSignup && emailState.value !== 'ok' ||
|
||||
usernameState.value !== 'ok' ||
|
||||
passwordRetypeState.value !== 'match';
|
||||
|
|
@ -266,6 +270,7 @@ async function onSubmit(): Promise<void> {
|
|||
'm-captcha-response': mCaptchaResponse.value,
|
||||
'g-recaptcha-response': reCaptchaResponse.value,
|
||||
'turnstile-response': turnstileResponse.value,
|
||||
'frc-captcha-solution': fcResponse.value,
|
||||
});
|
||||
if (instance.emailRequiredForSignup) {
|
||||
os.alert({
|
||||
|
|
@ -297,6 +302,7 @@ async function onSubmit(): Promise<void> {
|
|||
hcaptcha.value?.reset?.();
|
||||
recaptcha.value?.reset?.();
|
||||
turnstile.value?.reset?.();
|
||||
fc.value?.reset?.();
|
||||
|
||||
os.alert({
|
||||
type: 'error',
|
||||
|
|
|
|||
|
|
@ -17,12 +17,12 @@
|
|||
<meta
|
||||
http-equiv="Content-Security-Policy"
|
||||
content="default-src 'self' https://newassets.hcaptcha.com/ https://challenges.cloudflare.com/ http://localhost:7493/;
|
||||
worker-src 'self';
|
||||
script-src 'self' 'unsafe-eval' https://*.hcaptcha.com https://challenges.cloudflare.com https://esm.sh;
|
||||
worker-src 'self' blob:;
|
||||
script-src 'self' 'unsafe-eval' https://*.hcaptcha.com https://challenges.cloudflare.com https://esm.sh https://cdn.jsdelivr.net;
|
||||
style-src 'self' 'unsafe-inline';
|
||||
img-src 'self' data: blob: www.google.com xn--931a.moe localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000 activitypub.software secure.gravatar.com avatars.githubusercontent.com;
|
||||
media-src 'self' localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000;
|
||||
connect-src 'self' localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000 https://newassets.hcaptcha.com https://api.listenbrainz.org;
|
||||
connect-src 'self' localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000 https://newassets.hcaptcha.com https://api.listenbrainz.org https://api.friendlycaptcha.com;
|
||||
frame-src *;"
|
||||
/>
|
||||
<meta property="og:site_name" content="[DEV BUILD] Misskey" />
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template v-else-if="botProtectionForm.savedState.provider === 'mcaptcha'" #suffix>mCaptcha</template>
|
||||
<template v-else-if="botProtectionForm.savedState.provider === 'recaptcha'" #suffix>reCAPTCHA</template>
|
||||
<template v-else-if="botProtectionForm.savedState.provider === 'turnstile'" #suffix>Turnstile</template>
|
||||
<template v-else-if="botProtectionForm.savedState.provider === 'fc'" #suffix>FriendlyCaptcha</template>
|
||||
<template v-else #suffix>{{ i18n.ts.none }} ({{ i18n.ts.notRecommended }})</template>
|
||||
<template v-if="botProtectionForm.modified.value" #footer>
|
||||
<MkFormFooter :form="botProtectionForm"/>
|
||||
|
|
@ -23,6 +24,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<option value="mcaptcha">mCaptcha</option>
|
||||
<option value="recaptcha">reCAPTCHA</option>
|
||||
<option value="turnstile">Turnstile</option>
|
||||
<option value="fc">FriendlyCaptcha</option>
|
||||
</MkRadios>
|
||||
|
||||
<template v-if="botProtectionForm.state.provider === 'hcaptcha'">
|
||||
|
|
@ -85,6 +87,20 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkCaptcha provider="turnstile" :sitekey="botProtectionForm.state.turnstileSiteKey || '1x00000000000000000000AA'"/>
|
||||
</FormSlot>
|
||||
</template>
|
||||
<template v-else-if="botProtectionForm.state.provider === 'fc'">
|
||||
<MkInput v-model="botProtectionForm.state.fcSiteKey">
|
||||
<template #prefix><i class="ti ti-key"></i></template>
|
||||
<template #label>{{ i18n.ts.hcaptchaSiteKey }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="botProtectionForm.state.fcSecretKey">
|
||||
<template #prefix><i class="ti ti-key"></i></template>
|
||||
<template #label>{{ i18n.ts.hcaptchaSecretKey }}</template>
|
||||
</MkInput>
|
||||
<FormSlot>
|
||||
<template #label>{{ i18n.ts.preview }}</template>
|
||||
<MkCaptcha provider="fc" :sitekey="botProtectionForm.state.fcSiteKey"/>
|
||||
</FormSlot>
|
||||
</template>
|
||||
</div>
|
||||
</MkFolder>
|
||||
</template>
|
||||
|
|
@ -115,7 +131,9 @@ const botProtectionForm = useForm({
|
|||
? 'turnstile'
|
||||
: meta.enableMcaptcha
|
||||
? 'mcaptcha'
|
||||
: null,
|
||||
: meta.enableFC
|
||||
? 'fc'
|
||||
: null,
|
||||
hcaptchaSiteKey: meta.hcaptchaSiteKey,
|
||||
hcaptchaSecretKey: meta.hcaptchaSecretKey,
|
||||
mcaptchaSiteKey: meta.mcaptchaSiteKey,
|
||||
|
|
@ -125,6 +143,8 @@ const botProtectionForm = useForm({
|
|||
recaptchaSecretKey: meta.recaptchaSecretKey,
|
||||
turnstileSiteKey: meta.turnstileSiteKey,
|
||||
turnstileSecretKey: meta.turnstileSecretKey,
|
||||
fcSiteKey: meta.fcSiteKey,
|
||||
fcSecretKey: meta.fcSecretKey,
|
||||
}, async (state) => {
|
||||
await os.apiWithDialog('admin/update-meta', {
|
||||
enableHcaptcha: state.provider === 'hcaptcha',
|
||||
|
|
@ -140,6 +160,9 @@ const botProtectionForm = useForm({
|
|||
enableTurnstile: state.provider === 'turnstile',
|
||||
turnstileSiteKey: state.turnstileSiteKey,
|
||||
turnstileSecretKey: state.turnstileSecretKey,
|
||||
enableFC: state.provider === 'fc',
|
||||
fcSiteKey: state.fcSiteKey,
|
||||
fcSecretKey: state.fcSecretKey,
|
||||
});
|
||||
fetchInstance(true);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@ const view = ref(null);
|
|||
const el = ref<HTMLDivElement | null>(null);
|
||||
const pageProps = ref({});
|
||||
const noMaintainerInformation = computed(() => isEmpty(instance.maintainerName) || isEmpty(instance.maintainerEmail));
|
||||
const noBotProtection = computed(() => !instance.disableRegistration && !instance.enableHcaptcha && !instance.enableRecaptcha && !instance.enableTurnstile && !instance.enableMcaptcha);
|
||||
const noBotProtection = computed(() => !instance.disableRegistration && !instance.enableHcaptcha && !instance.enableRecaptcha && !instance.enableTurnstile && !instance.enableMcaptcha && !instance.enableFC);
|
||||
const noEmailServer = computed(() => !instance.enableEmail);
|
||||
const noInquiryUrl = computed(() => isEmpty(instance.inquiryUrl));
|
||||
const thereIsUnresolvedAbuseReport = ref(false);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue