Bonjour,
Souhaitant intégrer mon formulaire d’inscription à ma newsletter à mon site avec mon propre HTML/CSS/JS, je suis parti de la version « HTML simple » que j’ai adaptée. Je tente de gérer la soumission avec mon propre JS. Elle fonctionne et l’adresse e-mail soumise reçoit bien l’e-mail de confirmation (double opt-in), mais le navigateur reçoit une erreur de requête cross-origin non autorisée.
Blocage d’une requête multiorigines (Cross-Origin Request) : la politique « Same Origin » ne permet pas de consulter la ressource distante située sur [URL de mon point d’accès chez Brevo]. Raison : l’en-tête CORS « Access-Control-Allow-Origin » est manquant. Code d’état : 200.
Voici ce que je fais, dans le principe :
document.addEventListener('DOMContentLoaded', function () {
const form = document.getElementById('form');
const dialog = document.getElementById('dialog');
form.addEventListener('submit', function (event) {
// Prevent default form submission
event.preventDefault();
// Collect form data
const formData = new FormData(form);
// Send form data to endpoint
fetch(form.action, {
method: 'POST',
body: formData,
})
.then(response => {
if (response.ok) {
dialog.textContent = 'Success';
dialog.showModal();
}
else {
dialog.textContent = 'Bad response';
dialog.showModal();
}
})
.catch(error => {
console.error(error);
dialog.textContent = error;
dialog.showModal();
});
});
});
Du coup je passe dans le catch error, donc je ne peux pas afficher de message de succès à l’utilisateur·ice bien que la soumission ait fonctionné — à moins de gérer ce message de succès dans le catch error, ce qui ne serait pas franchement clean — et plus généralement ça ne me paraît pas correct ni pérenne de mettre ça en prod…
Y a-t-il un moyen d’autoriser les requêtes CORS émises depuis mon domaine ? Je n’ai pas trouvé cette option dans mes paramètres. Y a-t-il sinon une autre solution ?
