From 2fc64b52ba65b58cb6a09f49fc7b7df374e9d24a Mon Sep 17 00:00:00 2001 From: hlecorche Date: Wed, 8 Jan 2025 20:39:43 +0100 Subject: [PATCH] [stimulus-bundle] Improve CSRF protection --- .../controllers/csrf_protection_controller.js | 52 +++-------------- .../2.20/assets/js/csrf_protection.js | 56 +++++++++++++++++++ 2 files changed, 63 insertions(+), 45 deletions(-) create mode 100644 symfony/stimulus-bundle/2.20/assets/js/csrf_protection.js diff --git a/symfony/stimulus-bundle/2.20/assets/controllers/csrf_protection_controller.js b/symfony/stimulus-bundle/2.20/assets/controllers/csrf_protection_controller.js index 075d06cd5..58e0eeb53 100644 --- a/symfony/stimulus-bundle/2.20/assets/controllers/csrf_protection_controller.js +++ b/symfony/stimulus-bundle/2.20/assets/controllers/csrf_protection_controller.js @@ -1,59 +1,21 @@ -var nameCheck = /^[-_a-zA-Z0-9]{4,22}$/; -var tokenCheck = /^[-_/+a-zA-Z0-9]{24,}$/; +import { generateCsrfToken, generateCsrfHeaders, removeCsrfToken } from '../js/csrf_protection.js'; // Generate and double-submit a CSRF token in a form field and a cookie, as defined by Symfony's SameOriginCsrfTokenManager document.addEventListener('submit', function (event) { - var csrfField = event.target.querySelector('input[data-controller="csrf-protection"]'); - - if (!csrfField) { - return; - } - - var csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); - var csrfToken = csrfField.value; - - if (!csrfCookie && nameCheck.test(csrfToken)) { - csrfField.setAttribute('data-csrf-protection-cookie-value', csrfCookie = csrfToken); - csrfField.defaultValue = csrfToken = btoa(String.fromCharCode.apply(null, (window.crypto || window.msCrypto).getRandomValues(new Uint8Array(18)))); - } - - if (csrfCookie && tokenCheck.test(csrfToken)) { - var cookie = csrfCookie + '_' + csrfToken + '=' + csrfCookie + '; path=/; samesite=strict'; - document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie; - } -}); + generateCsrfToken(event.target); +}, true); // When @hotwired/turbo handles form submissions, send the CSRF token in a header in addition to a cookie // The `framework.csrf_protection.check_header` config option needs to be enabled for the header to be checked document.addEventListener('turbo:submit-start', function (event) { - var csrfField = event.detail.formSubmission.formElement.querySelector('input[data-controller="csrf-protection"]'); - - if (!csrfField) { - return; - } - - var csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); - - if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { - event.detail.formSubmission.fetchRequest.headers[csrfCookie] = csrfField.value; - } + Object.entries(generateCsrfHeaders(event.detail.formSubmission.formElement)).forEach(([name, value]) => { + event.detail.formSubmission.fetchRequest.headers[name] = value; + }); }); // When @hotwired/turbo handles form submissions, remove the CSRF cookie once a form has been submitted document.addEventListener('turbo:submit-end', function (event) { - var csrfField = event.detail.formSubmission.formElement.querySelector('input[data-controller="csrf-protection"]'); - - if (!csrfField) { - return; - } - - var csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); - - if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { - var cookie = csrfCookie + '_' + csrfField.value + '=0; path=/; samesite=strict; max-age=0'; - - document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie; - } + removeCsrfToken(event.detail.formSubmission.formElement); }); /* stimulusFetch: 'lazy' */ diff --git a/symfony/stimulus-bundle/2.20/assets/js/csrf_protection.js b/symfony/stimulus-bundle/2.20/assets/js/csrf_protection.js new file mode 100644 index 000000000..0131827bf --- /dev/null +++ b/symfony/stimulus-bundle/2.20/assets/js/csrf_protection.js @@ -0,0 +1,56 @@ +const nameCheck = /^[-_a-zA-Z0-9]{4,22}$/; +const tokenCheck = /^[-_/+a-zA-Z0-9]{24,}$/; + +export function generateCsrfToken (formElement) { + const csrfField = formElement.querySelector('input[data-controller="csrf-protection"]'); + + if (!csrfField) { + return; + } + + let csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); + let csrfToken = csrfField.value; + + if (!csrfCookie && nameCheck.test(csrfToken)) { + csrfField.setAttribute('data-csrf-protection-cookie-value', csrfCookie = csrfToken); + csrfField.defaultValue = csrfToken = btoa(String.fromCharCode.apply(null, (window.crypto || window.msCrypto).getRandomValues(new Uint8Array(18)))); + } + + if (csrfCookie && tokenCheck.test(csrfToken)) { + const cookie = csrfCookie + '_' + csrfToken + '=' + csrfCookie + '; path=/; samesite=strict'; + document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie; + } +} + +export function generateCsrfHeaders (formElement) { + const headers = {}; + const csrfField = formElement.querySelector('input[data-controller="csrf-protection"]'); + + if (!csrfField) { + return headers; + } + + const csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); + + if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { + headers[csrfCookie] = csrfField.value; + } + + return headers; +} + +export function removeCsrfToken (formElement) { + const csrfField = formElement.querySelector('input[data-controller="csrf-protection"]'); + + if (!csrfField) { + return; + } + + const csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value'); + + if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) { + const cookie = csrfCookie + '_' + csrfField.value + '=0; path=/; samesite=strict; max-age=0'; + + document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie; + } +}