AlfanLA

~ Perfectionist but Flexible ~

Converting "LOVE" Into Computer Code

HTML Entities to XML Entities

Apakah Anda seorang web developer? Jika ya, pasti Anda kenal dengan webkit browser engine. Open source browser engine yang digunakan pada browser Google Chrome, Safari (Apple), dan browser yang terdapat pada smartphone. Sebuah browser engine yang memang cukup ketat dalam penerapan aturan-aturan XHTML.

Ketika saya memutuskan untuk membuat versi mobile untuk blog ini, saya cukup dibuat heran ketika muncul banyak sekali error saat membuka versi mobile blog ini pada browser Google Chrome. Padahal sebelumnya saya sudah menerapkan aturan XHTML Strict pada versi desktop untuk konten-konten yang ada. Mulai 19 Desember 2012 saya akhirnya migrasi menggunakan WordPress untuk blog ini :)

Berikut adalah contoh error yang muncul:

This page contains the following errors:
error on line 31 at column 48: Entity 'nbsp' not defined
error on line 34 at column 54: Entity 'nbsp' not defined
error on line 37 at column 47: Entity 'nbsp' not defined
error on line 40 at column 46: Entity 'nbsp' not defined
error on line 43 at column 52: Entity 'nbsp' not defined
error on line 46 at column 45: Entity 'nbsp' not defined
error on line 49 at column 51: Entity 'nbsp' not defined
error on line 61 at column 10: Entity 'copy' not defined
Below is a rendering of the page up to the first error.

Error ini muncul setelah saya menuliskan perintah header('Content-Type: application/xhtml+xml'); pada kode php untuk versi mobile-nya. Kode header('Content-Type: application/xhtml+xml'); digunakan untuk mendefinisikan Mime Type yang sesuai dengan standar web versi mobile.

Error yang muncul seperti di atas disebabkan karena penggunaan entitas-entitas HTML yang digunakan dalam konten-konten XHTML, contoh adalah penggunaan entitas &nbsp; untuk spasi. Menurut aturan standar web versi mobile (XML), penggunaan entitas seperti ini tidak diijinkan, penggunaan entitas yang diijinkan adalah menggunakan karakter Unicode (misal &#160; untuk spasi) dan entitas HTML untuk ', ", <,>, &.

Berikut adalah contoh perbandingan entitas HTML dan entitas XML:

« => &laquo; (entitas HTML) dan &#171; (entitas XML)
» => &raquo; (entitas HTML) dan &#187; (entitas XML)

Catatan: semua karakter Unicode selalu diawali dengan &#.

Lalu bagaimana merubah entitas-entitas yang sudah dipakai pada konten-konten XHTML tersebut diterima oleh aturan XML (web versi mobile)? Gunakan sedikit kode untuk merubah entitas-entitas HTML tersebut ke entitas-entitas XML.

Berikut adalah fungsi yang saya gunakan untuk merubahnya:

<?php
function xmlEntities($str) {
$table = get_html_translation_table(HTML_ENTITIES, ENT_NOQUOTES);
unset($table['&']);
unset($table['<']);
unset($table['>']);
$replace = array();
foreach ($table as $key => $val){
$table[$key] = '/' . $val . '/';
$replace[htmlentities($key)] = '&#' . ord($key) . ';';
}
return preg_replace($table, $replace, $str);
}
?>

Fungsi di atas tidak akan merubah entitas HTML untuk ', ", <,>, & karena entitas HTML untuk ', ", <,>, & sudah diterima oleh aturan XML.