Compatibility Issue Between LiteSpeed Cache (ESI) and CleanTalk JavaScript

  • Resolved mochiny

    (@mochiny)


    8 months, 1 week ago

    Hello LiteSpeed Cache Team,

    we are experiencing a critical compatibility issue on wohnboutique24.ch, where we use LiteSpeed Cache with ESI enabled together with the CleanTalk plugin. Problem

    LiteSpeed Cache minifies JavaScript injected by CleanTalk in the page <head>, which breaks the JSON structure of the ctPublicFunctions object. Specifically:

    • Spaces and line breaks are removed.
    • Extra commas may be added ({"key": "value",} instead of {"key": "value"}).
    • The resulting JSON is invalid and triggers parsing errors.

    Browser error example:

    (index):19 Uncaught SyntaxError: Invalid or unexpected token apbct-public-bundle.min.js:1 Uncaught ReferenceError: ctPublicFunctions is not defined

    Broken snippet in HTML:

    <script data-no-defer="1" data-ezscrex="false" data-cfasync="false" data-pagespeed-no-defer="" data-cookieconsent="ignore"> var ctPublicFunctions = {"_ajax_nonce":"3433306eea","_rest_nonce":"782ac27bfe","_ajax_url":"\/wp-admin\/admin-ajax.php","_rest_url":"https:\/\/wohnboutique24.ch\/wp-json\/", ... ,"text__ee_decoding_process":"Bitte warten Sie einen Moment, w\u00e4hrend wir die Kontaktdaten entschl\u00fcsseln."} </script>

    When this happens, ctPublicFunctions becomes undefined, which causes CleanTalk’s protection and form validation to fail. Context

    • ESI is enabled by design in our setup (WooCommerce cart, admin bar, dynamic blocks). Disabling ESI is not an option.
    • With ESI enabled, we see inconsistent behavior of forms protected by CleanTalk (submissions not completing reliably).

    Request

    Could you please advise:

    1. The recommended configuration/exclusions for LiteSpeed Cache when used together with CleanTalk and ESI?
    2. Whether there are specific constants, defer/exclude rules, or code snippets we should apply to prevent LiteSpeed from breaking the CleanTalk script.
    3. If there are official steps to make CleanTalk fully compatible with LiteSpeed ESI.

    We can implement custom hooks or filters if necessary.

    Thank you for your support!

    Best regards,
    Yura

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support qtwrk

    (@qtwrk)

    8 months, 1 week ago

    if you disable JS optm but only with ESI , does it work ?

    on that “Broken snippet in HTML” , do you have sample as “not broken snippet” ?

    Thread Starter mochiny

    (@mochiny)

    8 months, 1 week ago

    Thanks for the quick reply.
    All JS optimization is disabled, but the issue still happens as long as ESI is enabled. If I turn off ESI, everything works.

    Here is the correct (not broken) snippet implemented inline: (CleanTalk plugin)

    <script data-no-defer="1" data-ezscrex="false" data-cfasync="false" data-pagespeed-no-defer="" data-cookieconsent="ignore">
    var ctPublicFunctions = {"_ajax_nonce":"1a243cf16e","_rest_nonce":"110dc2763b","_ajax_url":"\/wp-admin\/admin-ajax.php","_rest_url":"https:\/\/wohnboutique24.ch\/wp-json\/","data__cookies_type":"none","data__ajax_type":"rest","data__bot_detector_enabled":"1","data__frontend_data_log_enabled":1,"cookiePrefix":"","wprocket_detected":false,"host_url":"wohnboutique24.ch","text__ee_click_to_select":"Klicken Sie, um die gesamten Daten auszuw\u00e4hlen","text__ee_original_email":"Die vollst\u00e4ndige Version ist verf\u00fcgbar","text__ee_got_it":"Verstanden","text__ee_blocked":"Blockiert","text__ee_cannot_connect":"Kann keine Verbindung herstellen","text__ee_cannot_decode":"Kann E-Mail nicht dekodieren. Unbekannter Grund","text__ee_email_decoder":"CleanTalk E-Mail-Decoder","text__ee_wait_for_decoding":"Die Magie ist unterwegs!","text__ee_decoding_process":"Bitte warten Sie einen Moment, w\u00e4hrend wir die Kontaktdaten entschl\u00fcsseln."}
    </script>

    Here is the correct (not broken) snippet implemented inline: (Fluent Form plugin)

    <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script type="text/javascript">
    window.fluent_form_ff_form_instance_1_1 = {"id":"1","settings":{"layout":{"labelPlacement":"top","helpMessagePlacement":"with_label","errorMessagePlacement":"inline","cssClassName":"","asteriskPlacement":"asterisk-right"},"restrictions":{"denyEmptySubmission":{"enabled":false}}},"form_instance":"ff_form_instance_1_1","form_id_selector":"fluentform_1","rules":{"names[first_name]":{"required":{"value":true,"message":"Dieses Feld ist erforderlich","global_message":"This field is required","global":false}},"names[middle_name]":{"required":{"value":false,"message":"This field is required","global_message":"This field is required","global":true}},"names[last_name]":{"required":{"value":true,"message":"Dieses Feld ist erforderlich","global_message":"This field is required","global":false}},"phone":{"required":{"value":true,"global":false,"message":"Dieses Feld ist erforderlich","global_message":"This field is required"},"valid_phone_number":{"value":false,"global":true,"message":"Phone number is not valid","global_message":"Phone number is not valid"}},"email":{"required":{"value":true,"message":"Dieses Feld ist erforderlich","global_message":"This field is required","global":false},"email":{"value":true,"message":"Dieses Feld muss eine g\u00fcltige E-Mail-Adresse enthalten","global_message":"This field must contain a valid email","global":false}},"subject":{"required":{"value":false,"message":"This field is required","global":false,"global_message":"This field is required"}},"message":{"required":{"value":false,"message":"This field is required","global":false,"global_message":"This field is required"}},"file-upload":{"required":{"value":false,"message":"This field is required","global_message":"This field is required","global":true},"max_file_size":{"value":20971520,"_valueFrom":"MB","message":"Die Validierung schl\u00e4gt fehl: Maximale Dateigr\u00f6\u00dfe \u00fcberschritten","global_message":"Validation fails for maximum file size","global":false},"max_file_count":{"value":"3","message":"Die Validierung schl\u00e4gt fehl: Maximale Dateianzahl \u00fcberschritten","global_message":"Validation fails for maximum file count","global":false},"allowed_file_types":{"value":["jpg|jpeg|gif|png|bmp","pdf","doc|ppt|pps|xls|mdb|docx|xlsx|pptx|odt|odp|ods|odg|odc|odb|odf|rtf|txt","zip|gz|gzip|rar|7z"],"message":"Die erlaubten Bildtypen stimmen nicht \u00fcberein","global_message":"Invalid file type","global":false}}},"debounce_time":300};
    </script>

    The problem: all these inline CleanTalk or Fleunt Form scripts break because line breaks are removed → JSON objects become invalid, even though the data itself is formed correctly.

    How can I exclude these inline scripts from optimization while keeping ESI enabled?

    Best regards,
    Yura

    Plugin Support qtwrk

    (@qtwrk)

    8 months, 1 week ago

    I still don’t understand how would ESI get involved with JS optimization

    is that JS generated by or within a ESI block ?

    or is it possible you can explain a bit , how do I re-create the problem on a clean wordpress site ?

    it will probably be easier if I can reproduce the issue on my test site.

    glomberg

    (@glomberg)

    7 months, 2 weeks ago

    Hello mochiny

    CleanTalk is here 🤗

    We also does not reproduced the issue. We have tested OpenLiteSpeed + ESI enabled + CleanTalk – but the inline scripts works properly. So CleanTalk + LiteSpeed are compatible.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Compatibility Issue Between LiteSpeed Cache (ESI) and CleanTalk JavaScript’ is closed to new replies.