Feat: Update CAPTCHA service to ALTCHA self-hosted.
This commit is contained in:
@@ -132,6 +132,7 @@
|
||||
var flagTemporaryElement = "{{ model.FLAG_TEMPORARY_ELEMENT }}";
|
||||
var flagUser = "{{ model.FLAG_USER }}";
|
||||
var flagWebsite = "{{ model.FLAG_WEBSITE }}";
|
||||
var hashALTCHACreateChallenge = "{{ model.HASH_ALTCHA_CREATE_CHALLENGE }}";
|
||||
var hashApplyFiltersStoreProductPermutation = "{{ model.HASH_APPLY_FILTERS_STORE_PRODUCT_PERMUTATION }}";
|
||||
var hashPageAccessibilityReport = "{{ model.HASH_PAGE_ACCESSIBILITY_REPORT }}";
|
||||
var hashPageAccessibilityStatement = "{{ model.HASH_PAGE_ACCESSIBILITY_STATEMENT }}";
|
||||
|
||||
@@ -5,7 +5,22 @@
|
||||
{#
|
||||
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@altcha/browser@latest/dist/index.js" defer></script>
|
||||
#}
|
||||
{# with CDN
|
||||
<script src="https://cdn.jsdelivr.net/npm/@altcha/browser@1.1.0/dist/altcha.min.js"></script>
|
||||
<style>
|
||||
.altcha-widget {
|
||||
margin: 15px 0;
|
||||
}
|
||||
</style>
|
||||
#}
|
||||
{# with locally stored vendor project - this is imported into contact.js
|
||||
<script type="module" src="{{ url_for('static', filename='js/vendor/altcha.js')}}"></script>
|
||||
#}
|
||||
<style>
|
||||
.altcha-widget {
|
||||
margin: 15px 0;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block page_nav_links %}
|
||||
@@ -35,6 +50,16 @@
|
||||
<h1>Contact Us</h1>
|
||||
<p>Please fill in the form below and we'll get back to you as soon as possible.</p>
|
||||
|
||||
{% with messages = get_flashed_messages() %}
|
||||
{% if messages %}
|
||||
<ul class="flashes">
|
||||
{% for message in messages %}
|
||||
<li>{{ message }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
|
||||
<form id="{{ model.ID_CONTACT_FORM }}" method="POST" action="{{ url_for('routes_core.contact') }}">
|
||||
{{ form.csrf_token }}
|
||||
|
||||
@@ -66,10 +91,26 @@
|
||||
</div>
|
||||
<div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_CAPTCHA }}">
|
||||
{# {{ model.form_contact.recaptcha() }} #}
|
||||
{#
|
||||
<altcha-widget
|
||||
challengeurl="https://eu.altcha.org/api/v1/challenge?apiKey={{ model.app.app_config.ALTCHA_API_KEY }}"
|
||||
spamfilter
|
||||
></altcha-widget>
|
||||
#}
|
||||
<div>
|
||||
{{ form.altcha.label }}
|
||||
{#
|
||||
{{ form.altcha }}
|
||||
{{ form.altcha.hidden() }}
|
||||
#}
|
||||
<altcha-widget
|
||||
class="altcha-widget"
|
||||
challengeurl="{{ url_for('routes_core.create_altcha_challenge') }}"
|
||||
auto="onload"
|
||||
id="{{ form.altcha.id }}"
|
||||
name="{{ form.altcha.name }}"
|
||||
></altcha-widget>
|
||||
</div>
|
||||
</div>
|
||||
<div class="{{ model.FLAG_CONTAINER_INPUT }}">
|
||||
{{ model.form_contact.submit() }}
|
||||
@@ -109,7 +150,45 @@
|
||||
</section>
|
||||
#}
|
||||
|
||||
{# with CDN
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Initialize ALTCHA widget
|
||||
ALTCHA.init({
|
||||
selector: '.altcha-widget',
|
||||
challenge: {
|
||||
url: '/get-challenge',
|
||||
onSuccess: function(result, element) {
|
||||
// Store the result in the hidden input field
|
||||
const hiddenInput = element.parentNode.querySelector('input[type="hidden"]');
|
||||
hiddenInput.value = JSON.stringify(result);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
#}
|
||||
|
||||
{# with locally stored vendor project - this is now in contact.js
|
||||
<script type="module">
|
||||
import { Altcha } from "{{ url_for('static', filename='js/vendor/altcha.js') }}";
|
||||
window.ALTCHA = { init: (config) => {
|
||||
document.querySelectorAll(config.selector).forEach(el => {
|
||||
new Altcha({
|
||||
target: el,
|
||||
props: {
|
||||
challengeurl: config.challenge.url,
|
||||
auto: 'onload'
|
||||
}
|
||||
}).$on('verified', (e) => {
|
||||
config.challenge.onSuccess(e.detail.payload, el);
|
||||
});
|
||||
});
|
||||
}};
|
||||
</script>
|
||||
#}
|
||||
<script>
|
||||
var flagALTCHAWidget = "{{ model.FLAG_ALTCHA_WIDGET }}";
|
||||
var idContactForm = "#{{ model.ID_CONTACT_FORM }}";
|
||||
var idEmail = "#{{ model.ID_EMAIL }}";
|
||||
var idMessage = "#{{ model.ID_MESSAGE }}";
|
||||
|
||||
Reference in New Issue
Block a user