本文介绍了一个使用JavaScript发送XML请求的HTML示例及其后端Java处理逻辑。前端通过JavaScript动态生成XML数据并发送到服务器，后端使用DOM解析器解析XML数据并返回响应。
1、postingXML.html：
<html>
<head>
<title>Sending an XML Request</title>
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHttp");
}
else if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
}
function createXML(){//用来生成一串xml内容
var xml="<pres>";
var options=document.getElementById("petTypes").childNodes;
var option=null;
for(var i=0;i<options.length;i++)
{
option=options[i];
if(option.selected){
xml=xml+"<type>"+option.value+"<\/type>";//<\/type>为<\ /type>
}
}
xml=xml+"<\/pets>";
return xml;
}
function sendPetTypes(){
createXMLHttpRequest();
var xml=createXML();
var url="PostingXMLExample?timeStamp="+new Date().getTime();//timeStamp不是从页面上获得的数据
xmlHttp.open("POST",url,true);
xmlHttp.onreadystatechange=handleStateChange;
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlHttp.send(xml);//页面上提交的数据，发送出去。
}
function handleStateChange(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200)
{
parseResults();
}
}
}
function parseResults(){
var responseDiv=document.getElementById("serverResponse");
if(responseDiv.hasChildNodes())
{
responseDiv.removeChild(responseDiv.childNodes[0]);
}
var responseText=document.createTextNode(xmlHttp.responseText);
responseDiv.appendChild(responseText);
}
</script>
</head>
<body>
<h1>Select the types of pets in your home:</h1>
<form action="#">
<select id="petTypes" size="6" multiple>
<option value="cats">Cats</option>
<option value="dogs">Dogs</option>
<option value="fish">Fish</option>
<option value="hamsters">Hamsters</option>
<option value="rabbits">Rabbits</option>
</select>
<br><br>
<input type="button" value="Submit Pets" onclick="sendPetTypes();">
</form>
<h2>Server Response:</h2>
<div id="serverResponse"></div>
</body>
</html>
PostingXMLExample.java：
package three;
import java.io.BufferedReader;
import java.io.ByteArrayInputStream;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.parsers.ParserConfigurationException;
import org.w3c.dom.Document;
import org.w3c.dom.NodeList;
import org.xml.sax.SAXException;
public class PostingXMLExample extends HttpServlet{
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
String xml=readXMLFromRequestBody(request);//定义的方法
Document xmlDoc=null;//Document 接口表示整个 HTML 或 XML 文档。从概念上讲，它是文档树的根，并提供对文档数据的基本访问。
try
{
xmlDoc=DocumentBuilderFactory.newInstance().newDocumentBuilder().parse(new ByteArrayInputStream(xml.getBytes()));//（１）DocumentBuilderFactory：定义工厂 API，使应用程序能够从 XML 文档获取生成 DOM 对象树的解析器。（２）newDocumentBuilder()：使用当前配置的参数创建一个新的 DocumentBuilder 实例。（３）DocumentBuilder：定义 API， 使其从 XML 文档获取 DOM 文档实例。使用此类，应用程序员可以从 XML 获取一个 Document。此类的实例可以从DocumentBuilderFactory.newDocumentBuilder() 方法获取。获取此类的实例之后，将可以从各种输入源解析 XML。这些输入源为 InputStreams、Files、URL 和 SAX InputSources。（４）Document parse(InputStream is)将给定 InputStream 的内容解析为一个 XML 文档，并且返回一个新的DOM Document 对象。如果 InputStream 为 null，则抛出一个 IllegalArgumentException。参数：is - 包含要解析内容的 InputStream。返回：解析 InputStream 的 Document 结果。（５）ByteArrayInputStream：创建一个 ByteArrayInputStream（包含一个内部缓冲区，该缓冲区存储从流中读取的字节。内部计数器跟踪 read 方法要提供的下一个字节。 ），使用 buf 作为其缓冲区数组。参数：buf - 输入缓冲区。（６）"String".getBytes()：使用平台默认的字符集将此 String 解码为字节序列，并将结果存储到一个新的字节数组中。
}catch(ParserConfigurationException e)
{
System.out.println("ParserConfigurationException:"+e);
}catch(SAXException e)
{
System.out.println("SAXException:"+e);
}
NodeList selectedPetTypes=xmlDoc.getElementsByTagName("type");//提供对节点的有序集合的抽象，没有定义或约束如何实现此集合。DOM 中的 NodeList 对象是活动的。NodeList 中的项可以通过从 0 开始的整数索引进行访问。Document对象与浏览器对象有着共同的方法,如getElementsByTagName("...")，按文档顺序返回包含在文档中且具有给定标记名称的所有 Element 的 NodeList。
String type=null;
String responseText="Selected Pets:";
for(int i=0;i<selectedPetTypes.getLength();i++)//getLength：返回列表中的节点数。
{
type=selectedPetTypes.item(i).getFirstChild().getNodeValue();//item(i)：返回集合中的第 index 个项。如果 index 大于或等于此列表中的节点数，则返回 null。
responseText=responseText+" "+type;
}
response.setContentType("text/xml");
response.getWriter().print(responseText);
}
private String readXMLFromRequestBody(HttpServletRequest request) {
StringBuffer xml=new StringBuffer();//线程安全的可变字符序列。一个类似于 String 的字符串缓冲区，但不能修改。虽然在任意时间点上它都包含某种特定的字符序列，但通过某些方法调用可以改变该序列的长度和内容。
String line=null;
try
{
BufferedReader reader=request.getReader();//(1)BufferedReader：从字符输入流中读取文本，缓冲各个字符，从而提供字符、数组和行的高效读取。(2)ServletRequest.getReader()：Retrieves（取回,恢复,补偿）the body of the request as character data using a BufferedReader. The reader translates the character data according to the character encoding used on the body. Either this method or getInputStream() may be called to read the body, not both. Returns:a BufferedReader containing the body of the request。。这里看来，得到的是xmlhttprequest.send(...)中的内容。
while((line=reader.readLine())!=null)
{
xml.append(line);
}
}catch(Exception e)
{
System.out.println("Error reading XML:"+e.toString());
}
return xml.toString();
}
}
web.xml：
<servlet>
<servlet-name>PostingXMLExample</servlet-name>
<servlet-class>three.PostingXMLExample</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>PostingXMLExample</servlet-name>
<url-pattern>/three/PostingXMLExample</url-pattern> //注意,包名要包括进去。
</servlet-mapping>
<html>
<head>
<title>Sending an XML Request</title>
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHttp");
}
else if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
}
function createXML(){//用来生成一串xml内容
var xml="<pres>";
var options=document.getElementById("petTypes").childNodes;
var option=null;
for(var i=0;i<options.length;i++)
{
option=options[i];
if(option.selected){
xml=xml+"<type>"+option.value+"<\/type>";//<\/type>为<\ /type>
}
}
xml=xml+"<\/pets>";
return xml;
}
function sendPetTypes(){
createXMLHttpRequest();
var xml=createXML();
var url="PostingXMLExample?timeStamp="+new Date().getTime();//timeStamp不是从页面上获得的数据
xmlHttp.open("POST",url,true);
xmlHttp.onreadystatechange=handleStateChange;
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlHttp.send(xml);//页面上提交的数据，发送出去。
}
function handleStateChange(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200)
{
parseResults();
}
}
}
function parseResults(){
var responseDiv=document.getElementById("serverResponse");
if(responseDiv.hasChildNodes())
{
responseDiv.removeChild(responseDiv.childNodes[0]);
}
var responseText=document.createTextNode(xmlHttp.responseText);
responseDiv.appendChild(responseText);
}
</script>
</head>
<body>
<h1>Select the types of pets in your home:</h1>
<form action="#">
<select id="petTypes" size="6" multiple>
<option value="cats">Cats</option>
<option value="dogs">Dogs</option>
<option value="fish">Fish</option>
<option value="hamsters">Hamsters</option>
<option value="rabbits">Rabbits</option>
</select>
<br><br>
<input type="button" value="Submit Pets" onclick="sendPetTypes();">
</form>
<h2>Server Response:</h2>
<div id="serverResponse"></div>
</body>
</html>
PostingXMLExample.java：
package three;
import java.io.BufferedReader;
import java.io.ByteArrayInputStream;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.parsers.ParserConfigurationException;
import org.w3c.dom.Document;
import org.w3c.dom.NodeList;
import org.xml.sax.SAXException;
public class PostingXMLExample extends HttpServlet{
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
String xml=readXMLFromRequestBody(request);//定义的方法
Document xmlDoc=null;//Document 接口表示整个 HTML 或 XML 文档。从概念上讲，它是文档树的根，并提供对文档数据的基本访问。
try
{
xmlDoc=DocumentBuilderFactory.newInstance().newDocumentBuilder().parse(new ByteArrayInputStream(xml.getBytes()));//（１）DocumentBuilderFactory：定义工厂 API，使应用程序能够从 XML 文档获取生成 DOM 对象树的解析器。（２）newDocumentBuilder()：使用当前配置的参数创建一个新的 DocumentBuilder 实例。（３）DocumentBuilder：定义 API， 使其从 XML 文档获取 DOM 文档实例。使用此类，应用程序员可以从 XML 获取一个 Document。此类的实例可以从DocumentBuilderFactory.newDocumentBuilder() 方法获取。获取此类的实例之后，将可以从各种输入源解析 XML。这些输入源为 InputStreams、Files、URL 和 SAX InputSources。（４）Document parse(InputStream is)将给定 InputStream 的内容解析为一个 XML 文档，并且返回一个新的DOM Document 对象。如果 InputStream 为 null，则抛出一个 IllegalArgumentException。参数：is - 包含要解析内容的 InputStream。返回：解析 InputStream 的 Document 结果。（５）ByteArrayInputStream：创建一个 ByteArrayInputStream（包含一个内部缓冲区，该缓冲区存储从流中读取的字节。内部计数器跟踪 read 方法要提供的下一个字节。 ），使用 buf 作为其缓冲区数组。参数：buf - 输入缓冲区。（６）"String".getBytes()：使用平台默认的字符集将此 String 解码为字节序列，并将结果存储到一个新的字节数组中。
}catch(ParserConfigurationException e)
{
System.out.println("ParserConfigurationException:"+e);
}catch(SAXException e)
{
System.out.println("SAXException:"+e);
}
NodeList selectedPetTypes=xmlDoc.getElementsByTagName("type");//提供对节点的有序集合的抽象，没有定义或约束如何实现此集合。DOM 中的 NodeList 对象是活动的。NodeList 中的项可以通过从 0 开始的整数索引进行访问。Document对象与浏览器对象有着共同的方法,如getElementsByTagName("...")，按文档顺序返回包含在文档中且具有给定标记名称的所有 Element 的 NodeList。
String type=null;
String responseText="Selected Pets:";
for(int i=0;i<selectedPetTypes.getLength();i++)//getLength：返回列表中的节点数。
{
type=selectedPetTypes.item(i).getFirstChild().getNodeValue();//item(i)：返回集合中的第 index 个项。如果 index 大于或等于此列表中的节点数，则返回 null。
responseText=responseText+" "+type;
}
response.setContentType("text/xml");
response.getWriter().print(responseText);
}
private String readXMLFromRequestBody(HttpServletRequest request) {
StringBuffer xml=new StringBuffer();//线程安全的可变字符序列。一个类似于 String 的字符串缓冲区，但不能修改。虽然在任意时间点上它都包含某种特定的字符序列，但通过某些方法调用可以改变该序列的长度和内容。
String line=null;
try
{
BufferedReader reader=request.getReader();//(1)BufferedReader：从字符输入流中读取文本，缓冲各个字符，从而提供字符、数组和行的高效读取。(2)ServletRequest.getReader()：Retrieves（取回,恢复,补偿）the body of the request as character data using a BufferedReader. The reader translates the character data according to the character encoding used on the body. Either this method or getInputStream() may be called to read the body, not both. Returns:a BufferedReader containing the body of the request。。这里看来，得到的是xmlhttprequest.send(...)中的内容。
while((line=reader.readLine())!=null)
{
xml.append(line);
}
}catch(Exception e)
{
System.out.println("Error reading XML:"+e.toString());
}
return xml.toString();
}
}
web.xml：
<servlet>
<servlet-name>PostingXMLExample</servlet-name>
<servlet-class>three.PostingXMLExample</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>PostingXMLExample</servlet-name>
<url-pattern>/three/PostingXMLExample</url-pattern> //注意,包名要包括进去。
</servlet-mapping>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
