Enable rendering of SCRIPT tag without HTML escaping

  • Eric Hepperle

    (@codeslayer2010)


    11 months ago

    My employer switched from a decades old custom code base to WordPress recently. One of the benefits he was looking forward to was being able to drop any video embed code in a WYSIWYG field wherever needed. This includes IFRAMES, OEMBED URLS, and JAVASCRIPT. We couldn’t get this to work dynamically via ACF fields in a template until I stumbled across the wp_kses_allowed_html() function. I was able to get iframes working with this code:

    add_filter( 'wp_kses_allowed_html', 'acf_add_allowed_iframe_tag', 10, 2 );
function acf_add_allowed_iframe_tag( $tags, $context ) {
    if ( $context === 'post' ) {
        $tags['iframe'] = array(
            'src'             => true,
            'height'          => true,
            'width'           => true,
            'frameborder'     => true,
            'allowfullscreen' => true,
        );
    }

    return $tags;
}

    So then I tried to build something similar to enable SCRIPT tags — I know they’re disabled to prevent XSS attacks, but my employer feels enabling them is worth the risk because we can just restore a backup.

    This is the my code to enable SCRIPT / JavaScript rendering — why isn’t this working?

    add_filter('wp_kses_allowed_html', 'acf_add_allowed_script_tag', 10, 2);
function acf_add_allowed_script_tag($tags, $context) {
  if ($context === 'post') {
    $tags['script'] = array(
      'async'           => true,
      'crossorigin'     => true,
      'defer'           => true,
      'integrity'       => true,
      'nomodule'        => true,
      'referrerpolicy'  => true,
      'src'             => true,
      'type'            => true,
    );
  }

  return $tags;
  
}
    • This topic was modified 11 months ago by Eric Hepperle. Reason: fix code formatting

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    The editor processes post content in a number of ways that is incompatible with JavaScript. KSES filtering is but one of them. Attempting to disable all of the processes tends to have undesirable knock-on effects. It’s not really a viable approach.

    One way to introduce scripts without them getting corrupted is to use a custom shortcode to output the desired script. A similar but ready-made solution is to utilize a “code snippets” type of plugin intended for the purpose.

    Thread Starter Eric Hepperle

    (@codeslayer2010)

    @bcworkz Thanks for that reply. So, would it be accurate to say my code in acf_add_allowed_script_tag() has correct syntax, but there are other overriding / interfering factors? In other words, there is nothing else I can do to this code to “fix” it. Is that right?

    PS: I am already applying these functions via the Code Snippets plugin.

    • This reply was modified 10 months, 4 weeks ago by Eric Hepperle.
    • This reply was modified 10 months, 4 weeks ago by Eric Hepperle.
    Moderator bcworkz

    (@bcworkz)

    Your acf_add_allowed_script_tag() function appears to be correct, though I’ve not tested it to be sure. If you can add script tags to posts then it’s likely correct. Ability to add script tags doesn’t mean WP wouldn’t corrupt your inline script in other ways. For example, p tags often get inserted into inline scripts, causing syntax errors. This can happen when someone adds inline script directly into the editor. However, since you are using Code Snippets to insert scripts, the plugin should be doing so in a way that prevents WP from corrupting your scripts.

    But if the plugin is working correctly, you shouldn’t need to alter KSES filtering. The plugin should have already dealt with such issues. If you’re using Code Snippets, what does ACF have to do with anything? Doesn’t Code Snippets have its own way of collecting code snippet input? (I have no experience with code snippets type of plugins)

    If you’re somehow adding scripts via ACF and expecting Code Snippets to make use of the ACF content, I’m skeptical that is how it’s intended to work. It might not be a feasible approach. Or it could simply be there’s a bug in your JS code preventing it from working regardless of how it was introduced ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Enable rendering of SCRIPT tag without HTML escaping’ is closed to new replies.