แก้ปัญหา ตัดคำไทย UTF-8 เป็นสี่เหลี่ยม

19 มิถุนายน 2010 ผู้ชม: 6861

ก่อนอื่นต้องขอบคุณทางเว็บ Joomla.or.th ครับ ที่ได้เขียนบทความสั้น ๆ นี้ขึ้นมา ซึ่งทีแรกผมก็ยอมรับเลยว่าไม่ได้ใส่ใจอะไร แต่พอเราใช้โมดูลบางตัวที่มีการจำกัดข้อความ แล้วเกิดการตัดคำขึ้นมา ภาษาไทยก็มักจะมีปัญหา เพราะตัวสุดท้ายที่ถูกตัดคำไป มักจะกลายเป็นตัวสี่เหลี่ยม

เกริ่นสาเหตุของปัญหานี้ก่อนครับ เนื่องมาจากกว่า ตัวอักษรในเว็บไซต์นั้นได้ใช้ชุดอักขระ UTF-8 ซึ่งด้วยความที่มันเป็นแบบนี้เอง ทำให้ 1 ตัวอักษรของภาษาไทย มีความยาว 3 Byte ลองทดสอบได้ดังนี้ครับ

<?php
$string = "ทดสอบ";
echo strlen($string);
?>

แล้วบันทึกเป็นไฟล์ php แบบ ANSI จะได้ตัวเลข 5 ออกมา แต่ถ้า คุณลองบันทึกเป็นแบบ UTF-8 ดูแล้วล่ะก็ ค่าที่ได้จะกลายเป็น 15 ครับ กรณีคล้ายกัน ทดสอบโดยการตัดคำไทยความยาว 3 ตัวอักษรออกมา ด้วยโค๊ดนี้ครับ

<?php
$string = "ทดสอบ";
echo substr($string, 0, 3);
?>

ถ้าบันทึกเป็นไฟล์ php แบบ ANSI ก็จะได้คำว่า “ทดส” ออกมา แต่ถ้าคุณลองบันทึกเป็นแบบ UTF-8 ดูแล้วล่ะก็ จะได้คำว่า “ท” เท่านั้น ซึ่งทำให้แสดงผลสั้นลงไปมาก

และด้วยเหตุนี้เอง โมดูลบางชนิด ที่มีการแสดงผล Intro Text แล้วยังสามารถกำหนดจำนวนข้อความที่แสดงได้ ว่าต้องการให้แสดง Intro Text กี่ตัวอักษร ซึ่งส่วนมากจะใช้ฟังก์ชั่น substr ในการตัดคำหรือข้อความ ซึ่งเมื่อเกิดเหตุการณ์ที่ตัดคำไม่ลงตัวขึ้นมา ก็จะทำให้ตัวอักษรนั้นเกิดเป็นสี่เหลี่ยมอย่างที่เราเห็นกันนั้นเอง เช่น

<?php
$string = "ทดสอบ";
echo substr($string, 0, 4);
?>

กรณีนี้ ก็ตัดคำได้ตัวอักษร “ท” ออกมาแล้ว ซึ่งใช้ความยาวไป 3 Byte แต่ยังเหลืออีก 1 Byte สำหรับ “ด” ก็จะเห็นว่า “ด” นั้นคงจะถูกตัดคำออกมาแบบไม่ลงตัวและสมบูรณ์แน่ เพราะมันไม่ครบ 3 Byte ดังนั้นมันก็จึงเกิดเป็นตัวสี่เหลี่ยมขึ้นมานั่นเอง ซึ่งสามารถเปรียบเทียบได้จากภาพนี้ครับ

กรณีนี้ผมได้กำหนดตัดคำไว้ที่ความยาว 200 ตัวอักษร แต่มันคงไม่ลงตัว จึงมีสี่เหลี่ยมขึ้นมา

แต่ก็มีบางประโยคที่ตัดความยาว 200 ตัวอักษรในรูปแบบ UTF-8 ได้ลงตัวพอดี จึงไม่เกิดสี่เหลี่ยมขึ้นมา

OK เข้าใจแล้วนะ ต่อไป วิธีการแก้ไขคือ

แนวทางจาก http://joomla.or.th/blog/solve-thai-word-15.html ครับ เป็นการใช้งาน Joomla-Framwork ที่ทาง Joomla ได้มีไว้ให้แล้ว ให้ทำการเพิ่มโค๊ดนี้ ลงไปในฟังก์ชั่นที่ทำการตัดข้อความ

jimport( 'joomla.utilities.string' );

แล้วทำการใส่ JString ไว้หน้าฟังก์ชั่นที่ใช้สำหรับตัดข้อความ ซึ่งตัวอย่างโมดูลที่ผมใช้นั้น ผมสามารถค้นหาได้ออกมาแบบนี้ครับ

$intro = substr($intro, 0, $cut) . $ending;

โค๊ดด้านบนเป็นฟังก์ชั่นในการแสดง Intro Text จากโมดูลที่ผมใช้อยู่  ซึ่งจากการทดลองของผมเอง ผมไม่นำ jimport มาใช้ แต่ผมจะใส่แค่ JString อย่างเดียว ได้ออกมาแบบนี้ครับ

$intro = JString::substr($intro, 0, $cut) . $ending;

ไปดูผล

แจ่มครับ สามารถแสดงผลได้ถูกต้อง และไม่มีตัวสี่เหลี่ยมอีก

นอกจากนั้น เรายังสามารถใช้ฟังก์ชั่น iconv_substr แทนได้อีกนะครับ กลายเป็น

$intro = iconv_substr($intro, 0, $cut) . $ending;

ซึ่งได้ผลเหมือนกันครับ