JSON


1、JSON简介

  • JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。JSON 采用完全独立于语言的文本格式,而且很多语言都提供了对 json 的支持(包括 C, C++, C#, Java, JavaScript, Perl, Python 等)。 这样就使得 JSON 成为理想的数据交换格式。
  • JSON 是一种轻量级的数据交换格式,轻量级指的是跟 xml 做比较
  • 数据交换指的是客户端和服务器之间业务数据的传递格式

2、JSON在JavaScript中的使用

2.1、JSON的定义与访问

JSON是由键值对组成,并且由大括号包围,每个键由引号引起(不使用引号也可以),键和值之间使用冒号进行分割,多组键值对之间由逗号进行分割 (最后一组不加逗号)

json 本身是一个对象。

json 中的 key 我们可以理解为是对象中的一个属性。

json 中的 key 访问就跟访问对象的属性一样: json 对象.key

json 定义示例:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="pragma" content="no-cache" />
  5. <meta http-equiv="cache-control" content="no-cache" />
  6. <meta http-equiv="Expires" content="0" />
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  8. <title>Insert title here</title>
  9. <script type="text/javascript">
  10. // json的定义
  11. var jsonObj = {
  12. "key1":12,
  13. "key2":"abc",
  14. "key3":true,
  15. "key4":[11,"arr",false],
  16. "key5":{
  17. "key5_1" : 551,
  18. "key5_2" : "key5_2_value"
  19. },
  20. "key6":[{
  21. "key6_1_1":6611,
  22. "key6_1_2":"key6_1_2_value"
  23. },{
  24. "key6_2_1":6621,
  25. "key6_2_2":"key6_2_2_value"
  26. }]
  27. };
  28. // alert(typeof(jsonObj));// object json就是一个对象
  29. // alert(jsonObj.key1); //12
  30. // alert(jsonObj.key2); // abc
  31. // alert(jsonObj.key3); // true
  32. // alert(jsonObj.key4);// 得到数组[11,"arr",false]
  33. // // json 中 数组值的遍历
  34. // for(var i = 0; i < jsonObj.key4.length; i++) {
  35. // alert(jsonObj.key4[i]);
  36. // }
  37. // alert(jsonObj.key5.key5_1);//551
  38. // alert(jsonObj.key5.key5_2);//key5_2_value
  39. // alert( jsonObj.key6 );// 得到json数组
  40. //
  41. // // 取出来每一个元素都是json对象
  42. // var jsonItem = jsonObj.key6[0];
  43. // alert( jsonItem.key6_1_1 ); //6611
  44. // alert( jsonItem.key6_1_2 ); //key6_1_2_value
  45. // alert(jsonObj);
  46. // 把json对象转换成为 json字符串
  47. var jsonObjString = JSON.stringify(jsonObj); // 特别像 Java中对象的toString
  48. alert(jsonObjString)
  49. //{"key1":12,"key2":"abc","key3":true,"key4":[11,"arr",false],"key5":{"key5_1":551,"key5_2":"key5_2_value"},"key6":[{"key6_1_1":6611,"key6_1_2":"key6_1_2_value"},{"key6_2_1":6621,"key6_2_2":"key6_2_2_value"}]}
  50. // 把json字符串。转换成为json对象
  51. var jsonObj2 = JSON.parse(jsonObjString);
  52. alert(jsonObj2.key1);// 12
  53. alert(jsonObj2.key2);// abc
  54. // json的访问
  55. // json对象转字符串
  56. // json字符串转json对象
  57. </script>
  58. </head>
  59. <body>
  60. </body>
  61. </html>

2.2、json 的两个常用方法

json 的存在有两种形式。

一种是:对象的形式存在,我们叫它 json 对象。

一种是:字符串的形式存在,我们叫它 json 字符串。

一般我们要操作 json 中的数据的时候,需要 json 对象的格式。

一般我们要在客户端和服务器之间进行数据交换的时候,使用 json 字符串。

  • JSON.stringify() 把 json 对象转换成为 json 字符串
  • JSON.parse() 把 json 字符串转换成为 json 对象

代码如上后半部分

3、JSON 在 java 中的使用

首先要导入jar包:gson-2.2.4.jar

3.1、javaBean 和 json 的互转

  1. @Test
  2. public void test1(){
  3. Person person = new Person(1,"你好!");
  4. // 创建 Gson 对象实例
  5. Gson gson = new Gson();
  6. // toJson 方法可以把 java 对象转换成为 json 字符串
  7. String personJsonString = gson.toJson(person);
  8. System.out.println(personJsonString);
  9. // fromJson 把 json 字符串转换回 Java 对象
  10. // 第一个参数是 json 字符串
  11. // 第二个参数是转换回去的 Java 对象类型
  12. Person person1 = gson.fromJson(personJsonString, Person.class);
  13. System.out.println(person1);
  14. }

3.2、List 和 json 的互转

PersonListType.java:

  1. package com.atguigu.json;
  2. import com.chang.pojo.Person;
  3. import com.google.gson.reflect.TypeToken;
  4. import java.util.ArrayList;
  5. public class PersonListType extends TypeToken<ArrayList<Person>> {
  6. }
  1. import com.google.gson.Gson;
  2. import com.google.gson.reflect.TypeToken;
  3. @Test
  4. public void test2() {
  5. List<Person> personList = new ArrayList<>();
  6. personList.add(new Person(1, "你好"));
  7. personList.add(new Person(2, "天气好"));
  8. Gson gson = new Gson();
  9. // 把 List 转换为 json 字符串
  10. String personListJsonString = gson.toJson(personList);
  11. System.out.println(personListJsonString);
  12. List<Person> list = gson.fromJson(personListJsonString, new PersonListType().getType());
  13. System.out.println(list);
  14. Person person = list.get(0);
  15. System.out.println(person);
  16. }

3.2、map 和 json 的互转

PersonMapType:

  1. package com.atguigu.json;
  2. import com.chang.pojo.Person;
  3. import com.google.gson.reflect.TypeToken;
  4. import java.util.HashMap;
  5. public class PersonMapType extends TypeToken<HashMap<Integer, Person>> {
  6. }
  1. @Test
  2. public void test3(){
  3. Map<Integer,Person> personMap = new HashMap<>();
  4. personMap.put(1, new Person(1, "你好"));
  5. personMap.put(2, new Person(2, "天气好"));
  6. Gson gson = new Gson();
  7. // 把 map 集合转换成为 json 字符串
  8. String personMapJsonString = gson.toJson(personMap);
  9. System.out.println(personMapJsonString);
  10. // Map<Integer,Person> personMap2 = gson.fromJson(personMapJsonString, new PersonMapType().getType());
  11. //使用匿名内部类,则不需要在外面写类了,随写随用
  12. Map<Integer,Person> personMap2 = gson.fromJson(personMapJsonString, new TypeToken<HashMap<Integer,Person>>(){}.getType());
  13. System.out.println(personMap2);
  14. Person p = personMap2.get(1);
  15. System.out.println(p);
  16. }

AJAX 请求


1、什么是 AJAX 请求

AJAX 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术。

ajax 是一种浏览器通过 js 异步发起请求,局部更新页面的技术。

ajax 请求的局部更新,浏览器地址栏不会发生变化,并且局部更新不会舍弃原来页面的内容

异步和同步的概念

image.png

2、原生 AJAX 请求的示例

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="pragma" content="no-cache" />
  5. <meta http-equiv="cache-control" content="no-cache" />
  6. <meta http-equiv="Expires" content="0" />
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  8. <title>Insert title here</title>
  9. <script type="text/javascript">
  10. // 在这里使用 javaScript 语言发起 Ajax 请求,访问服务器 AjaxServlet 中 javaScriptAjax
  11. function ajaxRequest() {
  12. // 1、我们首先要创建 XMLHttpRequest
  13. var xmlhttprequest = new XMLHttpRequest();
  14. // 2、调用 open 方法设置请求参数
  15. xmlhttprequest.open("GET","http://localhost:8080/16_json_ajax_i18n/ajaxServlet?action=javaScriptAjax",true)
  16. // 4、在 send 方法前绑定 onreadystatechange 事件,处理请求完成后的操作。
  17. xmlhttprequest.onreadystatechange = function(){
  18. if (xmlhttprequest.readyState == 4 && xmlhttprequest.status == 200) {
  19. var jsonObj = JSON.parse(xmlhttprequest.responseText);
  20. // 把响应的数据显示在页面上
  21. document.getElementById("div01").innerHTML = "编号:" + jsonObj.id + ", 姓名:" +
  22. jsonObj.name;
  23. }
  24. }
  25. // 3、调用 send 方法发送请求
  26. xmlhttprequest.send();
  27. }
  28. </script>
  29. </head>
  30. <body>
  31. <button onclick="ajaxRequest()">ajax request</button>
  32. <div id="div01">
  33. </div>
  34. </body>
  35. </html>
  1. package com.atguigu.servlet;
  2. import com.atguigu.pojo.Person;
  3. import com.google.gson.Gson;
  4. import javax.servlet.ServletException;
  5. import javax.servlet.http.HttpServletRequest;
  6. import javax.servlet.http.HttpServletResponse;
  7. import java.io.IOException;
  8. public class AjaxServlet extends BaseServlet {
  9. protected void javaScriptAjax(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  10. System.out.println("Ajax请求过来了");
  11. Person person = new Person(1, "你好");
  12. try {
  13. Thread.sleep(3000);
  14. } catch (InterruptedException e) {
  15. e.printStackTrace();
  16. }
  17. // json格式的字符串
  18. Gson gson = new Gson();
  19. String personJsonString = gson.toJson(person);
  20. resp.getWriter().write(personJsonString);
  21. }
  22. }
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
  3. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  4. xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
  5. version="4.0">
  6. <servlet>
  7. <servlet-name>AjaxServlet</servlet-name>
  8. <servlet-class>com.atguigu.servlet.AjaxServlet</servlet-class>
  9. </servlet>
  10. <servlet-mapping>
  11. <servlet-name>AjaxServlet</servlet-name>
  12. <url-pattern>/ajaxServlet</url-pattern>
  13. </servlet-mapping>
  14. </web-app>

3、jQuery 中的 AJAX 请求

$.ajax 方法

  1. url 表示请求的地址
  2. type 表示请求的方式 GET 或 POST 请求
  3. data 表示发送给服务器的数据

    • 格式有两种

      1. name=value&name=value
      2. {key:value} success 请求成功,响应的回调函数
  4. success(data, exStatus, jqXHR) 请求成功的回调函数

    1. data 是返回的数据
    2. exStatus 相应状态码
    3. jqXHR 原生的 XmlHttpRequest 对象
  5. error(XmlHttpRequest, exStatus, errorThrown) 请求失败的回调函数

    1. errorThrown 可捕获的异常对象
  6. contentType 请求数据类型

  7. dataType 响应的数据类型

    1. 常用的数据类型有: text 表示纯文本,xml 表示 xml 数据,json 表示 json 对象
  1. // ajax请求
  2. $("#ajaxBtn").click(function(){
  3. $.ajax({
  4. url:"http://localhost:8080/16_json_ajax_i18n/ajaxServlet",
  5. // data:"action=jQueryAjax",
  6. data:{action:"jQueryAjax"},
  7. type:"GET",
  8. success:function (data) {
  9. // alert("服务器返回的数据是:" + data);
  10. // var jsonObj = JSON.parse(data);
  11. $("#msg").html(" ajax 编号:" + data.id + " , 姓名:" + data.name);
  12. },
  13. // dataType : "text"
  14. dataType : "json"
  15. });
  16. });

13、JSON、AJAX与i18n - 图3.post 方法

  1. url 请求的 url 地址
  2. data 发送的数据
  3. callback 成功的回调函数
  4. type 返回的数据类型
  1. // ajax--get请求
  2. $("#getBtn").click(function(){
  3. $.get("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQueryGet",function (data) {
  4. $("#msg").html(" get 编号:" + data.id + " , 姓名:" + data.name);
  5. },"json");
  6. });
  7. // ajax--post请求
  8. $("#postBtn").click(function(){
  9. // post请求
  10. $.post("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQueryPost",function (data) {
  11. $("#msg").html(" post 编号:" + data.id + " , 姓名:" + data.name);
  12. },"json");
  13. });

$.getJSON 方法

GET请求,返回为Json数据

  1. url 请求的 url 地址
  2. data 发送给服务器的数据
  3. callback 成功的回调函数
  1. // ajax--getJson请求
  2. $("#getJSONBtn").click(function(){
  3. $.getJSON("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQueryGetJSON",function (data) {
  4. $("#msg").html(" getJSON 编号:" + data.id + " , 姓名:" + data.name);
  5. });
  6. });

表单序列化 serialize()

serialize()可以把表单中所有表单项的内容都获取到,并以 name=value&name=value 的形式进行拼接

$("#form01").serialize()

  1. // ajax请求
  2. $("#submit").click(function(){
  3. // 把参数序列化
  4. $.getJSON("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQuerySerialize&" + $("#form01").serialize(),function (data) {
  5. $("#msg").html(" Serialize 编号:" + data.id + " , 姓名:" + data.name);
  6. });
  7. });

总和代码:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="pragma" content="no-cache" />
  5. <meta http-equiv="cache-control" content="no-cache" />
  6. <meta http-equiv="Expires" content="0" />
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  8. <title>Insert title here</title>
  9. <script type="text/javascript" src="script/jquery-1.7.2.js"></script>
  10. <script type="text/javascript">
  11. $(function(){
  12. // ajax请求
  13. $("#ajaxBtn").click(function(){
  14. $.ajax({
  15. url:"http://localhost:8080/16_json_ajax_i18n/ajaxServlet",
  16. // data:"action=jQueryAjax",
  17. data:{action:"jQueryAjax"},
  18. type:"GET",
  19. success:function (data) {
  20. // alert("服务器返回的数据是:" + data);
  21. // var jsonObj = JSON.parse(data);
  22. $("#msg").html(" ajax 编号:" + data.id + " , 姓名:" + data.name);
  23. },
  24. // dataType : "text"
  25. dataType : "json"
  26. });
  27. });
  28. // ajax--get请求
  29. $("#getBtn").click(function(){
  30. $.get("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQueryGet",function (data) {
  31. $("#msg").html(" get 编号:" + data.id + " , 姓名:" + data.name);
  32. },"json");
  33. });
  34. // ajax--post请求
  35. $("#postBtn").click(function(){
  36. // post请求
  37. $.post("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQueryPost",function (data) {
  38. $("#msg").html(" post 编号:" + data.id + " , 姓名:" + data.name);
  39. },"json");
  40. });
  41. // ajax--getJson请求
  42. $("#getJSONBtn").click(function(){
  43. $.getJSON("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQueryGetJSON",function (data) {
  44. $("#msg").html(" getJSON 编号:" + data.id + " , 姓名:" + data.name);
  45. });
  46. });
  47. // ajax请求
  48. $("#submit").click(function(){
  49. // 把参数序列化
  50. $.getJSON("http://localhost:8080/16_json_ajax_i18n/ajaxServlet","action=jQuerySerialize&" + $("#form01").serialize(),function (data) {
  51. $("#msg").html(" Serialize 编号:" + data.id + " , 姓名:" + data.name);
  52. });
  53. });
  54. });
  55. </script>
  56. </head>
  57. <body>
  58. <div>
  59. <button id="ajaxBtn">$.ajax请求</button>
  60. <button id="getBtn">$.get请求</button>
  61. <button id="postBtn">$.post请求</button>
  62. <button id="getJSONBtn">$.getJSON请求</button>
  63. </div>
  64. <div id="msg">
  65. </div>
  66. <br/><br/>
  67. <form id="form01" >
  68. 用户名:<input name="username" type="text" /><br/>
  69. 密码:<input name="password" type="password" /><br/>
  70. 下拉单选:<select name="single">
  71. <option value="Single">Single</option>
  72. <option value="Single2">Single2</option>
  73. </select><br/>
  74. 下拉多选:
  75. <select name="multiple" multiple="multiple">
  76. <option selected="selected" value="Multiple">Multiple</option>
  77. <option value="Multiple2">Multiple2</option>
  78. <option selected="selected" value="Multiple3">Multiple3</option>
  79. </select><br/>
  80. 复选:
  81. <input type="checkbox" name="check" value="check1"/> check1
  82. <input type="checkbox" name="check" value="check2" checked="checked"/> check2<br/>
  83. 单选:
  84. <input type="radio" name="radio" value="radio1" checked="checked"/> radio1
  85. <input type="radio" name="radio" value="radio2"/> radio2<br/>
  86. </form>
  87. <button id="submit">提交--serialize()</button>
  88. </body>
  89. </html>
  1. package com.chang.servlet;
  2. import com.chang.pojo.Person;
  3. import com.google.gson.Gson;
  4. import javax.servlet.ServletException;
  5. import javax.servlet.http.HttpServletRequest;
  6. import javax.servlet.http.HttpServletResponse;
  7. import java.io.IOException;
  8. public class AjaxServlet extends BaseServlet {
  9. protected void javaScriptAjax(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  10. System.out.println("Ajax请求过来了");
  11. Person person = new Person(1, "你好");
  12. try {
  13. Thread.sleep(3000);
  14. } catch (InterruptedException e) {
  15. e.printStackTrace();
  16. }
  17. // json格式的字符串
  18. Gson gson = new Gson();
  19. String personJsonString = gson.toJson(person);
  20. resp.getWriter().write(personJsonString);
  21. }
  22. protected void jQueryAjax(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  23. System.out.println(" jQueryAjax == 方法调用了");
  24. Person person = new Person(1, "你好");
  25. // json格式的字符串
  26. Gson gson = new Gson();
  27. String personJsonString = gson.toJson(person);
  28. resp.getWriter().write(personJsonString);
  29. }
  30. protected void jQueryGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  31. System.out.println(" jQueryGet == 方法调用了");
  32. Person person = new Person(1, "你好");
  33. // json格式的字符串
  34. Gson gson = new Gson();
  35. String personJsonString = gson.toJson(person);
  36. resp.getWriter().write(personJsonString);
  37. }
  38. protected void jQueryPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  39. System.out.println(" jQueryPost == 方法调用了");
  40. Person person = new Person(1, "你好");
  41. // json格式的字符串
  42. Gson gson = new Gson();
  43. String personJsonString = gson.toJson(person);
  44. resp.getWriter().write(personJsonString);
  45. }
  46. protected void jQueryGetJSON(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  47. System.out.println(" jQueryGetJSON == 方法调用了");
  48. Person person = new Person(1, "你好");
  49. // json格式的字符串
  50. Gson gson = new Gson();
  51. String personJsonString = gson.toJson(person);
  52. resp.getWriter().write(personJsonString);
  53. }
  54. protected void jQuerySerialize(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  55. System.out.println(" jQuerySerialize == 方法调用了");
  56. System.out.println("用户名:" + req.getParameter("username"));
  57. System.out.println("密码:" + req.getParameter("password"));
  58. Person person = new Person(1, "你好");
  59. // json格式的字符串
  60. Gson gson = new Gson();
  61. String personJsonString = gson.toJson(person);
  62. resp.getWriter().write(personJsonString);
  63. }
  64. }

i18n 国际化


1、什么是 i18n 国际化

国际化(Internationalization)指的是同一个网站可以支持多种不同的语言,以方便不同国家,不同语种的用户访问。

关于国际化我们想到的最简单的方案就是为不同的国家创建不同的网站,比如苹果公司,他的英文官网是: http://www.apple.com 而中国官网是 http://www.apple.com/cn

苹果公司这种方案并不适合全部公司,而我们希望相同的一个网站,而不同人访问的时候可以根据用户所在的区域显示 不同的语言文字,而网站的布局样式等不发生改变。

于是就有了我们说的国际化,国际化总的来说就是同一个网站不同国家的人来访问可以显示出不同的语言。但实际上这 种需求并不强烈,一般真的有国际化需求的公司,主流采用的依然是苹果公司的那种方案,为不同的国家创建不同的页 面。所以国际化的内容我们了解一下即可。

国际化的英文 Internationalization,但是由于拼写过长,老外想了一个简单的写法叫做 I18N,代表的是Internationalization 这个单词,以 I 开头,以 N 结尾,而中间是 18 个字母,所以简写为 I18N。以后我们说 I18N 和国际化是一个意思。

2、国际化相关要素介绍

image.png

3、国际化资源 properties 测试

配置两个语言的配置文件:

i18n_en_US.properties 英文

  1. i18n_en_US.properties 英文
  2. username=username
  3. password=password
  4. sex=sex
  5. age=age
  6. regist=regist
  7. boy=boy
  8. email=email
  9. girl=girl
  10. reset=reset
  11. submit=submit

i18n_zh_CN.properties 中文

  1. username=用户名
  2. password=密码
  3. sex=性别
  4. age=年龄
  5. regist=注册
  6. boy=男
  7. girl=女
  8. email=邮箱
  9. reset=重置
  10. submit=提交

国际化测试代码:

  1. public class I18nTest {
  2. @Test
  3. public void testLocale(){
  4. // 获取你系统默认的语言。国家信息
  5. // Locale locale = Locale.getDefault();
  6. // System.out.println(locale);
  7. // for (Locale availableLocale : Locale.getAvailableLocales()) {
  8. // System.out.println(availableLocale);
  9. // }
  10. // 获取中文,中文的常量的 Locale 对象
  11. System.out.println(Locale.CHINA);
  12. // 获取英文,美国的常量的 Locale 对象
  13. System.out.println(Locale.US);
  14. }
  15. @Test
  16. public void testI18n(){
  17. // 得到我们需要的 Locale 对象
  18. Locale locale = Locale.CHINA;
  19. // 通过指定的 basename 和 Locale 对象,读取 相应的配置文件
  20. ResourceBundle bundle = ResourceBundle.getBundle("i18n", locale);
  21. System.out.println("username:" + bundle.getString("username"));
  22. System.out.println("password:" + bundle.getString("password"));
  23. System.out.println("Sex:" + bundle.getString("sex"));
  24. System.out.println("age:" + bundle.getString("age"));
  25. }
  26. }

4、通过请求头国际化页面

  1. <%@ page import="java.util.Locale" %>
  2. <%@ page import="java.util.ResourceBundle" %>
  3. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR/html4/loose.dtd">
  5. <html>
  6. <head>
  7. <meta http-equiv="pragma" content="no-cache" />
  8. <meta http-equiv="cache-control" content="no-cache" />
  9. <meta http-equiv="Expires" content="0" />
  10. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  11. <title>Insert title here</title>
  12. </head>
  13. <body>
  14. <%
  15. // 从请求头中获取 Locale 信息(语言)
  16. Locale locale = request.getLocale();
  17. System.out.println(locale);
  18. // 获取读取包(根据 指定的 baseName 和 Locale 读取 语言信息)
  19. ResourceBundle i18n = ResourceBundle.getBundle("i18n", locale);
  20. %>
  21. <a href="">中文</a>|
  22. <a href="">english</a>
  23. <center>
  24. <h1><%=i18n.getString("regist")%></h1>
  25. <table>
  26. <form>
  27. <tr>
  28. <td><%=i18n.getString("username")%></td>
  29. <td><input name="username" type="text" /></td>
  30. </tr>
  31. <tr>
  32. <td><%=i18n.getString("password")%></td>
  33. <td><input type="password" /></td>
  34. </tr>
  35. <tr>
  36. <td><%=i18n.getString("sex")%></td>
  37. <td>
  38. <input type="radio" /><%=i18n.getString("boy")%>
  39. <input type="radio" /><%=i18n.getString("girl")%>
  40. </td>
  41. </tr>
  42. <tr>
  43. <td><%=i18n.getString("email")%></td>
  44. <td><input type="text" /></td>
  45. </tr>
  46. <tr>
  47. <td colspan="2" align="center">
  48. <input type="reset" value="<%=i18n.getString("reset")%>" />&nbsp;&nbsp;
  49. <input type="submit" value="<%=i18n.getString("submit")%>" />
  50. </td>
  51. </tr>
  52. </form>
  53. </table>
  54. <br /> <br /> <br /> <br />
  55. </center>
  56. 国际化测试:
  57. <br /> 1、访问页面,通过浏览器设置,请求头信息确定国际化语言。
  58. <br /> 2、通过左上角,手动切换语言
  59. </body>
  60. </html>

5、通过显示的选择语言类型进行国际化

  1. <%@ page import="java.util.Locale" %>
  2. <%@ page import="java.util.ResourceBundle" %>
  3. <%@ page language="java" contentType="text/html; charset=UTF-8"
  4. pageEncoding="UTF-8"%>
  5. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  6. <html>
  7. <head>
  8. <meta http-equiv="pragma" content="no-cache" />
  9. <meta http-equiv="cache-control" content="no-cache" />
  10. <meta http-equiv="Expires" content="0" />
  11. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  12. <title>Insert title here</title>
  13. </head>
  14. <body>
  15. <%
  16. // 从请求头中获取Locale信息(语言)
  17. Locale locale = null;
  18. String country = request.getParameter("country");
  19. if ("cn".equals(country)) {
  20. locale = Locale.CHINA;
  21. } else if ("usa".equals(country)) {
  22. locale = Locale.US;
  23. } else {
  24. locale = request.getLocale();
  25. }
  26. System.out.println(locale);
  27. // 获取读取包(根据 指定的baseName和Locale读取 语言信息)
  28. ResourceBundle i18n = ResourceBundle.getBundle("i18n", locale);
  29. %>
  30. <a href="i18n.jsp?country=cn">中文</a>|
  31. <a href="i18n.jsp?country=usa">english</a>
  32. <center>
  33. <h1><%=i18n.getString("regist")%></h1>
  34. <table>
  35. <form>
  36. <tr>
  37. <td><%=i18n.getString("username")%></td>
  38. <td><input name="username" type="text" /></td>
  39. </tr>
  40. <tr>
  41. <td><%=i18n.getString("password")%></td>
  42. <td><input type="password" /></td>
  43. </tr>
  44. <tr>
  45. <td><%=i18n.getString("sex")%></td>
  46. <td>
  47. <input type="radio" /><%=i18n.getString("boy")%>
  48. <input type="radio" /><%=i18n.getString("girl")%>
  49. </td>
  50. </tr>
  51. <tr>
  52. <td><%=i18n.getString("email")%></td>
  53. <td><input type="text" /></td>
  54. </tr>
  55. <tr>
  56. <td colspan="2" align="center">
  57. <input type="reset" value="<%=i18n.getString("reset")%>" />&nbsp;&nbsp;
  58. <input type="submit" value="<%=i18n.getString("submit")%>" /></td>
  59. </tr>
  60. </form>
  61. </table>
  62. <br /> <br /> <br /> <br />
  63. </center>
  64. 国际化测试:
  65. <br /> 1、访问页面,通过浏览器设置,请求头信息确定国际化语言。
  66. <br /> 2、通过左上角,手动切换语言
  67. </body>
  68. </html>

5、JSTL 标签库实现国际化

需要导入包:taglibs-standard-impl-1.2.1.jar、taglibs-standard-spec-1.2.1.jar

  1. <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
  2. <%@ page language="java" contentType="text/html; charset=UTF-8"
  3. pageEncoding="UTF-8"%>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  5. <html>
  6. <head>
  7. <meta http-equiv="pragma" content="no-cache" />
  8. <meta http-equiv="cache-control" content="no-cache" />
  9. <meta http-equiv="Expires" content="0" />
  10. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  11. <title>Insert title here</title>
  12. </head>
  13. <body>
  14. <%--1 使用标签设置Locale信息--%>
  15. <fmt:setLocale value="${param.locale}" />
  16. <%--2 使用标签设置baseName--%>
  17. <fmt:setBundle basename="i18n"/>
  18. <a href="i18n_fmt.jsp?locale=zh_CN">中文</a>|
  19. <a href="i18n_fmt.jsp?locale=en_US">english</a>
  20. <center>
  21. <h1><fmt:message key="regist" /></h1>
  22. <table>
  23. <form>
  24. <tr>
  25. <td><fmt:message key="username" /></td>
  26. <td><input name="username" type="text" /></td>
  27. </tr>
  28. <tr>
  29. <td><fmt:message key="password" /></td>
  30. <td><input type="password" /></td>
  31. </tr>
  32. <tr>
  33. <td><fmt:message key="sex" /></td>
  34. <td>
  35. <input type="radio" /><fmt:message key="boy" />
  36. <input type="radio" /><fmt:message key="girl" />
  37. </td>
  38. </tr>
  39. <tr>
  40. <td><fmt:message key="email" /></td>
  41. <td><input type="text" /></td>
  42. </tr>
  43. <tr>
  44. <td colspan="2" align="center">
  45. <input type="reset" value="<fmt:message key="reset" />" />&nbsp;&nbsp;
  46. <input type="submit" value="<fmt:message key="submit" />" /></td>
  47. </tr>
  48. </form>
  49. </table>
  50. <br /> <br /> <br /> <br />
  51. </center>
  52. </body>
  53. </html>