HTML5와 호환되는 HTML 필터

HTML5와 호환되는 HTML 필터

---

HTMLPurifier 용 HTML5 규칙 세트를 추가하는 간단한 방법이 있습니까?

HP는 다음을 사용하여 새 태그 를 인식 하도록 구성 할 수 있습니다 .

// setup configurable HP instance
$config = HTMLPurifier_Config::createDefault();
$config->set('HTML.DefinitionID', 'html5 draft');
$config->set('HTML.DefinitionRev', 1);
$config->set('Cache.DefinitionImpl', null); // no caching
$def = $config->getHTMLDefinition(true);

// add a new tag
$form = $def->addElement(
  'article',   // name
  'Block',     // content set
  'Flow',      // allowed children
  'Common',    // attribute collection
  array(       // attributes
  )
);

// add a new attribute
$def->addAttribute('a', 'contextmenu', "ID");

그러나 이것은 분명히 약간의 작업입니다. 등록해야하는 많은 새로운 HTML5 태그와 속성이 있기 때문입니다. 새로운 전역 속성은 기존 HTML 4 태그와도 결합 할 수 있어야합니다. (문서에서 핵심 규칙을 보강하는 방법을 판단하는 것은 어렵습니다). 따라서, 새로운 먹이 더 유용한 포맷으로 구성 / 배열 구조가 및 갱신 속성 태그 + + 컨텍스트 구성 (인라인 / 블록 / 빈 / 흐름 / ..)을 HTMLPurifier로?

# mostly confused about how to extend existing tags:
$def->addAttribute('input', 'type', "...|...|...");

# or how to allow data-* attributes (if I actually wanted that):
$def->addAttribute("data-*", ...

물론 모든 새로운 HTML5 태그가 무제한 허용에 적합한 것은 아닙니다. HTMLPurifier는 콘텐츠 필터링에 관한 것입니다. 가치 제약을 정의하는 것은 그것이있는 곳입니다. - <canvas>예를 들어 사용자 콘텐츠에 표시 될 때 그다지 큰 거래가 아닐 수 있습니다. Javascript (HP가 이미 필터링) 없이는 기껏해야 쓸모가 없기 때문입니다. 그러나 다른 태그와 속성은 바람직하지 않을 수 있습니다. 따라서 유연한 구성 구조는 태그 및 관련 속성을 활성화 / 비활성화하는 데 필수적입니다.

( 연구를 업데이트해야 할 것 같은데 ... ). 그러나 HP 구성에 적합한 실질적인 개요 / 사양은 아직 없습니다 (아니요, XML DTD는 아닙니다).

• http://simon.html5.org/html-elements
• http://www.w3.org/TR/html5-diff/#new-elements
• http://www.w3.org/TR/html5-diff/#new-attributes

(어, HTML5는 더 이상 초안이 아닙니다.)

---

php tidy 확장은 html5 태그를 인식하도록 구성 할 수 있습니다. http://tidy.sourceforge.net/docs/quickref.html#new-blocklevel-tags

---

최신 HTML5 태그를 허용하는 HTMLpurify의 구성이 있습니다.

출처 : https://github.com/kennberg/php-htmlpurfier-html5

.

<?php
/**
 * Load HTMLPurifier with HTML5, TinyMCE, YouTube, Video support.
 *
 * Copyright 2014 Alex Kennberg (https://github.com/kennberg/php-htmlpurifier-html5)
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

require_once(LIB_DIR . 'third-party/htmlpurifier/HTMLPurifier.safe-includes.php');


function load_htmlpurifier($allowed) {
  $config = HTMLPurifier_Config::createDefault();
  $config->set('HTML.Doctype', 'HTML 4.01 Transitional');
  $config->set('CSS.AllowTricky', true);
  $config->set('Cache.SerializerPath', '/tmp');

  // Allow iframes from:
  // o YouTube.com
  // o Vimeo.com
  $config->set('HTML.SafeIframe', true);
  $config->set('URI.SafeIframeRegexp', '%^(http:|https:)?//(www.youtube(?:-nocookie)?.com/embed/|player.vimeo.com/video/)%');

  $config->set('HTML.Allowed', implode(',', $allowed));

  // Set some HTML5 properties
  $config->set('HTML.DefinitionID', 'html5-definitions'); // unqiue id
  $config->set('HTML.DefinitionRev', 1);

  if ($def = $config->maybeGetRawHTMLDefinition()) {
    // http://developers.whatwg.org/sections.html
    $def->addElement('section', 'Block', 'Flow', 'Common');
    $def->addElement('nav',     'Block', 'Flow', 'Common');
    $def->addElement('article', 'Block', 'Flow', 'Common');
    $def->addElement('aside',   'Block', 'Flow', 'Common');
    $def->addElement('header',  'Block', 'Flow', 'Common');
    $def->addElement('footer',  'Block', 'Flow', 'Common');

    // Content model actually excludes several tags, not modelled here
    $def->addElement('address', 'Block', 'Flow', 'Common');
    $def->addElement('hgroup', 'Block', 'Required: h1 | h2 | h3 | h4 | h5 | h6', 'Common');

    // http://developers.whatwg.org/grouping-content.html
    $def->addElement('figure', 'Block', 'Optional: (figcaption, Flow) | (Flow, figcaption) | Flow', 'Common');
    $def->addElement('figcaption', 'Inline', 'Flow', 'Common');

    // http://developers.whatwg.org/the-video-element.html#the-video-element
    $def->addElement('video', 'Block', 'Optional: (source, Flow) | (Flow, source) | Flow', 'Common', array(
      'src' => 'URI',
      'type' => 'Text',
      'width' => 'Length',
      'height' => 'Length',
      'poster' => 'URI',
      'preload' => 'Enum#auto,metadata,none',
      'controls' => 'Bool',
    ));
    $def->addElement('source', 'Block', 'Flow', 'Common', array(
      'src' => 'URI',
      'type' => 'Text',
    ));

    // http://developers.whatwg.org/text-level-semantics.html
    $def->addElement('s',    'Inline', 'Inline', 'Common');
    $def->addElement('var',  'Inline', 'Inline', 'Common');
    $def->addElement('sub',  'Inline', 'Inline', 'Common');
    $def->addElement('sup',  'Inline', 'Inline', 'Common');
    $def->addElement('mark', 'Inline', 'Inline', 'Common');
    $def->addElement('wbr',  'Inline', 'Empty', 'Core');

    // http://developers.whatwg.org/edits.html
    $def->addElement('ins', 'Block', 'Flow', 'Common', array('cite' => 'URI', 'datetime' => 'CDATA'));
    $def->addElement('del', 'Block', 'Flow', 'Common', array('cite' => 'URI', 'datetime' => 'CDATA'));

    // TinyMCE
    $def->addAttribute('img', 'data-mce-src', 'Text');
    $def->addAttribute('img', 'data-mce-json', 'Text');

    // Others
    $def->addAttribute('iframe', 'allowfullscreen', 'Bool');
    $def->addAttribute('table', 'height', 'Text');
    $def->addAttribute('td', 'border', 'Text');
    $def->addAttribute('th', 'border', 'Text');
    $def->addAttribute('tr', 'width', 'Text');
    $def->addAttribute('tr', 'height', 'Text');
    $def->addAttribute('tr', 'border', 'Text');
  }

  return new HTMLPurifier($config);
}

---

워드 프레스에 대한 수정을 사용하고 있지만 아마도 이것은 당신에게도 도움이 될 수 있습니다 (적어도 배열 부분의 경우)

http://nicolasgallagher.com/using-html5-elements-in-wordpress-post-content/

http://hybridgarden.com/blog/misc/adding-html5-capability-to-wordpress/

또한:

http://code.google.com/p/html5lib/ 주요 데스크톱 웹 브라우저와의 최대 호환성을 위해 WHATWG HTML5 사양을 기반으로하는 HTML 파서의 Python 및 PHP 구현입니다.

---

I know this topic is really old, but since it's still relevant, I decided to respond. Especially when the landscape has changed since the question was originally asked.

You can use https://github.com/xemlock/htmlpurifier-html5 which extends HTML Purifier with spec compliant definitions of HTML5 elements and attributes.

The usage is almost the same as the original HTML Purifier, you just need to replace HTMLPurifier_Config with HTMLPurifier_HTML5Config:

$config = HTMLPurifier_HTML5Config::createDefault();
$purifier = new HTMLPurifier($config);

$clean_html5 = $purifier->purify($dirty_html5);

Disclaimer: I'm the author of the extension.

---

Gallery Role has an experimental HTML5 parser that is based on HTMLPurifier:

https://github.com/gallery/gallery3-vendor/blob/master/htmlpurifier/modified/HTMLPurifier/Lexer/PH5P.php

ReferenceURL : https://stackoverflow.com/questions/5667857/html-filter-that-is-html5-compliant