Struts Framework – Hello world แบบเลือกภาษาได้

หลังจากไหว้ครูด้วย Hello world แล้ว
คราวนี้มาไหว้ครูอีกระดับด้วย Hello สองภาษากัน
การทำให้โปรแกรมรองรับหลายภาษา
เรียกเป็นทางการว่า Internationalization เรียกสั้นๆ ว่า i18n
หรืออีกชื่อหนึ่งคือ Localization เรียกสั้นๆ ว่า l10n
เผื่อเป็นประโยชน์ในการใช้ Search Engine ^^

สิ่งแรกที่ต้องมีก่อนที่จะเริ่มทำคือ
ทำการลง plugin ให้ Eclipse ที่ชื่อว่า PropEdit
โดยผมใช้ Update Site ที่ http://propedit.sourceforge.jp/eclipse/updates/
สาเหตุที่ต้องใช้ Plugin นี้คือ
เพื่อความสะดวกในการแปลงภาษาไทยเป็นรหัส Ascii
เนื่องจาก Struts ต้องการภาษาไทยในรูปแบบ Ascii
ไม่อย่างนั้นจะแสดงผลภาษาไทยไม่ได้
และข้อดีอีกหลายอย่างของ Properties เช่น
สามารถแปลงภาษาไทย(หรืออื่นๆ) เป็น Ascii
แต่ที่หน้า Editor ยังคงอ่านเป็นภาษานั้นๆ ได้
และยังช่วยตรวจสอบว่ามีการใช้ key ซ้ำหรือเปล่า
อื่นๆ อ่านต่อที่เว็บไซต์นะครับ ^^

เอาหล่ะ มาเริ่มกัน

  1. ทำการ new file เป็นแบบ Properties 2 file
    วางไว้ในโฟลเดอร์ src
    ชื่อ MessageResources.properties และ MessageResources_th.properties
    สาเหตุที่ชื่อนี้เพราะใน struts-config.xml ระบุไว้ว่าชื่อนี้ครับ

    <message-resources parameter="MessageResources" />
    

    ดังรูป

    1 - properties file

    หากอยากเปลี่ยนชื่ออื่นก็ให้เปลี่ยนที่ struts-config.xml ด้วย
    ในไฟล์ MessageResources.properties ให้เพิ่มคำว่า

    message.hello=Hello, world!!!

    และในไฟล์ MessageResources_th.properties ให้เพิ่มคำว่า

    message.hello=สวัสดีชาวโลก

    ย้ำว่าหากไม่ได้ลง PropEdit เราต้องทำการ convert คำนี้เป็น ascii ก่อนนะครับ

  2. เปิดไฟล์ index.jsp ขึ้นมา แล้วแก้ไขดังนี้

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
        
    <%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>First Struts</title>
    </head>
    <body>
    
    <html:link action="/Hello.do">
    	<html:param name="lang" value="en" />
    	En
    </html:link>
    <html:link action="/Hello.do">
    	<html:param name="lang" value="th" />
    	Th
    </html:link>
    
    </body>
    </html>
    

    สิ่งที่เราได้เพิ่มขึ้นมาคือ taglib ของ Struts หนึ่งอัน
    หลักๆ ที่ใช้คือสร้าง component ของ html
    ซึ่งจะเห็นได้จากแท็ก

    <html:link>

    และ

    <html:param>

    จากโค้ดที่เห็นอ่านได้ว่า
    สร้าง link ที่เรียกใช้ Hello Action
    โดยส่ง parameter lang เข้าไปกับ query string ด้วย

    ทำการ save แล้วลองรันไฟล์นี้ดูว่า
    มีการแสดงผลได้ลิงก์และ query string ที่ถูกต้องหรือไม่

  3. เปิดไฟล์ show.jsp ขึ้นมา
    เพิ่มโค้ด

    <%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
    

    ไว้ถัดจากแท็ก

    <%@ page >

    แล้วแก้คำว่า Hello, world!!! เป็น

    <bean:message key="message.hello"/>
    

    จะได้ประมาณนี้

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    
    <%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>First Struts</title>
    </head>
    <body>
    <bean:message key="message.hello"/>
    </body>
    </html>
    

    คราวนี้เราได้เพิ่ม taglib อีกตัวคือ bean
    โดยคำสั่ง

    <bean:message key="message.hello"/>
    

    คือการอ่านค่าจาก MessageResources
    ใช้ key คือ message.hello ที่เราเพิ่มไป

  4. เปิดคลาส HelloAction แล้วแก้ไขดังนี้

    public class HelloAction extends Action {
    	private final String viewPage = "view";
    	@Override
    	public ActionForward execute(ActionMapping mapping, ActionForm form,
    			HttpServletRequest request, HttpServletResponse response)
    			throws Exception {
    		String lang = request.getParameter("lang");
    		if("en".equals(lang)){
    			setLocale(request, Locale.ENGLISH);
    		}else{
    			setLocale(request, new Locale("TH"));
    		}
    		return mapping.findForward(viewPage);
    	}
    }
    

    เป็นการอ่านค่าที่ส่งมาจากหน้า index.jsp ชื่อ lang ว่าเป็น en หรือ th
    จากนั้นก็ทำการเรียกเมธอด setLocale ที่มีอยู่แล้วในคลาส Action

  5. รันไฟล์ index.jsp แล้วทำการคลิกเลือกภาษา
    สังเกตุว่า Hello, world เรามีการเปลี่ยนภาษาแล้ว

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s