web-dev-qa-db-ja.com

wp_kses（）は、許可リストにある場合でもデータ属性を削除します

許可されたhtmlタグ配列を返す関数を追加しました

if ( ! function_exists( 'allowed_html_tags' ) ) {
  /**
   * Allowed html tags for wp_kses() function
   *
   * @return array Array of allowed html tags.
   */
  function allowed_html_tags() {
    return array(
      'a' => array(
        'href' => array(),
        'title' => array(),
        'class' => array(),
        'data' => array(),
        'rel'   => array(),
      ),
      'br' => array(),
      'em' => array(),
      'ul' => array(
          'class' => array(),
      ),
      'ol' => array(
          'class' => array(),
      ),
      'li' => array(
          'class' => array(),
      ),
      'strong' => array(),
      'div' => array(
        'class' => array(),
        'data' => array(),
        'style' => array(),
      ),
      'span' => array(
        'class' => array(),
        'style' => array(),
      ),
      'img' => array(
          'alt'    => array(),
          'class'  => array(),
          'height' => array(),
          'src'    => array(),
          'width'  => array(),
      ),
      'select' => array(
          'id'   => array(),
          'class' => array(),
          'name' => array(),
      ),
      'option' => array(
          'value' => array(),
          'selected' => array(),
      ),
    );
  }
}

しかし、foreachループで生成された変数にhtmlがある場合、data属性が削除されます。

$my_var = '<div class="my-class" data-term="$term_id">$content</div>';

wp_kses( $my_var, allowed_html_tags() );

これは戻ります

<div class="my-class">This is my content... no data attribute...</div>

data-*を持つように配列を変更しようとしましたが、うまくいきませんでした。

これが機能するために、許可された配列を完全なデータ名（data-term）で変更する必要がないことを願っています...

wp-kses
1
dingo_d

これが機能するために、許可された配列を完全なデータ名（data-term）で変更する必要がないことを願っています...

そのように見えます。結局、data-termとdataは同じ属性ではなく、コアで突っついていると、どのような種類の正規表現もサポートされる属性として使用できるとは思いません。

ただし、独自のマークアップでwp_kses()を実行する必要はありませんが、安全であることを知っておく必要があります。 wp_kses()は通常、ユーザーからの信頼できない入力を処理するためだけのものです。ユーザーはデータ属性を送信しますか？それらをすべてサポートする必要がありますか？

代わりに次のようなことができます：

$my_var = '<div class="my-class" data-term="' . esc_attr( $term_id ) . '">' . wp_kses_post( $content ) . '</div>';

これは、wp_kses_post()を使用します。これは、投稿にデフォルトで許可されているhtmlを使用しますが、$contentが何であっても適用されます。

2
Jacob Peattie

2018年12月以降にここに来る人のための更新：

data- *は、このコミット- https://github.com/markjaquith/WordPress/commit/a0309e80b6a4d805e4f230649be07b4bfb1a56a5#diff-a0e0d196dd71dde453474b0f791828fe

これで、次のようなことができるようになりました。

add_filter('wp_kses_allowed_html', "kses_filter_allowed_html"));

function kses_filter_allowed_html( $allowed, $context )
{
    if (is_array($context))
    {
        return $allowed;
    }

    if ($context === 'post')
    {
        $allowed['a']['data-*'] = true;
        $allowed['table']['data-*'] = true; 
        // ... keep on doing these for each HTML entity you want to allow data- attributes on
    }

    return $allowed;
}
5
Matt Thomason