Suatu saat mungkin kita menghadapi requirement yang mengharuskan membangun sebuah aplikasi web atau website yang mendukung fitur multibahasa. Jangan berpikiran multibahasa akan sulit untuk diwujudkan karena pada kenyataannya fitur ini mudah untuk diimplementasikan. Spring mendukung fitur multibahasa yang disebut dengan [rad-hl]internationalization (l18n) and localization (l10n)[/rad-hl].
Tulisan kali ini akan membahas implementasi fitur multibahasa pada aplikasi web yang dibangun menggunakan Spring. Contoh aplikasi pada tutorial ini mengacu pada Spring MVC menggunakan Java Based Configuration
Struktur Project
Untuk lebih mudah memahami tutorial kali ini, berikut struktur project maven yang dibuat
Internationlization
Agar aplikasi kita mendukung fitur multibahasa maka kita perlu membuat sebuah file properties untuk menampung kata kunci berikut nilainya dalam bahasa yang diinginkan. Kita akan menggunakan 3 bahasa yaitu inggris, indonesia dan jerman. Dan berikut adalah isi dari masing-masing ketiga file properties
file : src/main/resources/message_ind.properties
1 2 3 4 5 |
label.firstname=Nama Depan label.lastname=Nama Belakang label.email=Email label.telephone=Telepon label.addcontact=Tambah Kontak |
file : src/main/resources/message_en.properties
1 2 3 4 5 |
label.firstname=First Name label.lastname=Last Name label.email=Email label.telephone=Telephone label.addcontact=Add Contact |
file : src/main/resources/message_de.properties
1 2 3 4 5 |
label.firstname=Vorname label.lastname=Nachname label.email=Email label.telephone=Telefonieren label.addcontact=Kontakt hinzufügen |
Perhatikan bahwa nama file properties memiliki pola [rad-hl]message_kodebahasa[/rad-hl]
Konfigurasi
Pada konfigurasi kita membutuhkan beberapa bean
1. [rad-hl]ResourceBundleMessageSource[/rad-hl], digunakan untuk me-load file-file properties yang mengandung terjemahan
2. [rad-hl]LocaleChangeInterceptor[/rad-hl], digunakan untuk mendeteksi perubahan bahasa
3. [rad-hl]SessionLocaleResolver[/rad-hl], digunakan untuk menyimpan perubahan bahasa dalam session
4. Untuk mendaftarkan LocaleChangeInterceptor kita perlu membuat kelas konfigurasi sebagai subkelas dari [rad-hl]WebMvcConfigurerAdapter[/rad-hl]
Dan berikut adalah kelas konfigurasi
file : src/main/java/com/agung/init/WebAppConfig.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 |
package com.agung.init; import java.util.Locale; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.ComponentScan; import org.springframework.context.annotation.Configuration; import org.springframework.context.support.ResourceBundleMessageSource; import org.springframework.web.servlet.LocaleResolver; import org.springframework.web.servlet.config.annotation.EnableWebMvc; import org.springframework.web.servlet.config.annotation.InterceptorRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; import org.springframework.web.servlet.i18n.LocaleChangeInterceptor; import org.springframework.web.servlet.i18n.SessionLocaleResolver; import org.springframework.web.servlet.view.InternalResourceViewResolver; /** * * @author awanlabs */ @Configuration @EnableWebMvc @ComponentScan("com.agung.controller") public class WebAppConfig extends WebMvcConfigurerAdapter { @Bean public InternalResourceViewResolver setUpViewResolver(){ InternalResourceViewResolver resolver=new InternalResourceViewResolver(); resolver.setPrefix("/WEB-INF/jsp/"); resolver.setSuffix(".jsp"); return resolver; } @Bean public ResourceBundleMessageSource messageSource(){ ResourceBundleMessageSource messageSource=new ResourceBundleMessageSource(); messageSource.setBasename("message"); return messageSource; } @Bean public LocaleChangeInterceptor localeChangeInterceptor(){ LocaleChangeInterceptor localeChangeInterceptor=new LocaleChangeInterceptor(); localeChangeInterceptor.setParamName("lang"); return localeChangeInterceptor; } @Bean public LocaleResolver localeResolver(){ SessionLocaleResolver sessionLocaleResolver=new SessionLocaleResolver(); sessionLocaleResolver.setDefaultLocale(Locale.ENGLISH); return sessionLocaleResolver; } @Override public void addInterceptors(InterceptorRegistry interceptorRegistry){ interceptorRegistry.addInterceptor(localeChangeInterceptor()); } } |
Untuk kelas initializer dan pom.xml sama dengan yang ada pada tulisan Spring MVC menggunakan Java Based Configuration.
Controller
Sangat sederhana, hanya bertugas untuk menampilkan index.jsp
file : src/main/java/com/agung/controller/HomeCOntroller.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
package com.agung.controller; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; /** * * @author awanlabs */ @Controller public class HomeController { @RequestMapping(value = "/",method = RequestMethod.GET) public String index(){ return "index"; } } |
Halaman JSP
Halaman inilah yang akan menampilkan sebuah form yang mendukung 3 pilihan bahasa.
file : src/main/webapp/WEB-INF/jsp/index.jsp
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 |
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@taglib prefix="spring" uri="http://www.springframework.org/tags" %> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> <style type="text/css"> form{ background: wheat; width: 300px; padding: 10px 10px 10px 30px; font-family: cursive; color: brown; border-radius: 8px; box-shadow: 0px 10px 10px black; } div{ margin-bottom: 10px; } input{ display: block; } input[type=text]{ width:250px; border:1px solid black; padding: 5px; font-family: monospace; } input[type=submit]{ background: burlywood; border:1px solid black; padding: 5px; font-family: cursive; } #lang a{ text-decoration: none; color: tomato; border-right: 1px solid black; padding-right: 5px; } </style> </head> <body> <div id="lang"> <a href="<c:url value="?lang=en" />">English</a> <a href="<c:url value="?lang=ind" />">Indonesia</a> <a href="<c:url value="?lang=de" />">Germany</a> </div> <form> <div> <label><spring:message code="label.firstname" /></label> <input type="text"/> </div> <div> <label> <spring:message code="label.lastname" /></label> <input type="text"/> </div> <div> <label><spring:message code="label.email" /></label> <input type="text"/> </div> <div> <label><spring:message code="label.telephone" /></label> <input type="text"/> </div> <div> <input type="submit" value="<spring:message code="label.addcontact" />"/> </div> </form> </body> </html> |
Perhatikan bahwa kita menggunakan tag [rad-hl]
Perhatikan pula bahwa untuk mengubah dari satu bahasa menjadi bahasa lainya kita menggunakan request parameter [rad-hl]lang[/rad-hl]. Perubahan nilai dari variabel ini akan dideteksi oleh [rad-hl]LocaleChangeInterceptor[/rad-hl]
Demo
Arahkan browser ke http://localhost:8080/SpringInternationalization, dan berikut ini adalah screenshot dari aplikasi
note : mohon maaf kalau ada kesalahan pada bahasa jerman, modal google translate 😛
Source Code
Seperti biasa untuk source code bisa didownload pada repository Github saya disini
Happy programming 😀