[FIX] website_cf_turnstile: better error message for turnstile errors

Right now, when a turnstile error occurs, the user is displayed a
CORS error, which is incorrect. This commit fixes that by displaying a
more accurate error message.

The fix requires the addition of a small trick which is to use the
turnstile error handler system to catch and rethrow the error. It seems
useless, but it is actually required as errors thrown by files coming
from external domains will be set by the browser as "Script error" and
stripped of any further info. So for better error handling, these few
lines are worth it.

The error is most likely to happen when duplicating a database as
turnstile requires a specific domain name in its cloudflare settings.
This improved message will hopefully help support manage better this
situation.

Hopefully, we can make something in the DB duplication tool to avoid
the issue entirely and have this error message displayed only for "real"
but rare errors.

closes odoo/odoo#148016

X-original-commit: 112508dbc57bfbc3e8145bf4c8ed260e17071a91
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
Signed-off-by: Simon Genin (ges@odoo) <ges@odoo.com>
This commit is contained in:
Simon Genin (ges)
2024-01-04 12:02:06 +00:00
parent b83049487f
commit 9c16842038
3 changed files with 34 additions and 0 deletions
@@ -15,6 +15,7 @@ This module implements Cloudflare Turnstile so that you can prevent bot spam on
'assets': {
'web.assets_frontend': [
'website_cf_turnstile/static/src/js/turnstile.js',
'website_cf_turnstile/static/src/js/error_handler.js',
],
},
'license': 'LGPL-3',
@@ -0,0 +1,23 @@
/** @odoo-module */
import { ErrorDialog } from "@web/core/errors/error_dialogs";
import { _t } from "@web/core/l10n/translation";
import { registry } from "@web/core/registry";
function turnstileErrorHandler(env, error) {
if (error.message.includes("Turnstile Error")) {
env.services.dialog.add(ErrorDialog, {
name: _t("Cloudflare Turnstile Error"),
traceback: _t(
`There was an error with Cloudflare Turnstile, the captcha system.\n` +
`Please make sure your credentials for this service are properly set up.\n` +
`The error code is: %s.\n` +
`You can find more information about this error code here: https://developers.cloudflare.com/turnstile/reference/errors.`,
error.event.error.code
),
});
return true;
}
}
registry.category("error_handlers").add("turnstile_error_handler", turnstileErrorHandler);
@@ -18,7 +18,17 @@ publicWidget.registry.s_website_form.include({
data-appearance="${mode}"
data-response-field-name="turnstile_captcha"
data-sitekey="${session.turnstile_site_key}"
data-error-callback="throwTurnstileError"
></div>
<script>
// Rethrow the error, or we only will catch a "Script error" without any info
// because of the script api.js originating from a different domain.
function throwTurnstileError(code) {
const error = new Error("Turnstile Error");
error.code = code;
throw error;
}
</script>
<script class="s_turnstile" src="https://challenges.cloudflare.com/turnstile/v0/api.js"></script>
`).insertAfter('.s_website_form_send, .o_website_form_send');
}