English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Ajax Übertragung XML-Daten:Es reicht aus, die Daten in das XML-Format zu verpacken, um die Übertragung zu ermöglichen. Der Client empfängt die XML-Parameter über responseXML, der Server liest sie mit Streams und DOM4j verwendet
Vordergrundseite
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Ajax XML Datenverarbeitungsdemonstration</title>
<script type="text/javascript">
//Ajax über GET-Method
function send1(){
alert("ok");
var name=document.getElementsByName("name")[0].value;
var age=document.getElementsByName("age")[0].value;
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject("Microsoft.XMLHttp");
}
var url="<c:url value='/XmlServlet?name='/">"+name+"&age="+age;
//3Setzen Sie den Zugriffsweg
xhr.open("GET", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange=function(){
if(xhr.readyState==4{//zurückgeben
if(xhr.status==200){//Antwortcode normal
var txt=xhr.responseText;
alert(txt);
}
}
};
xhr.send(null);
}
</script>
!-- Der Client sendet Daten im XML-Format an den Server -->
<script type="text/javascript">
//Ajax über POST-Method
function send2(){
alert("222");
//1Erstellen Sie das AJAX-Objekt
var xhr = null;
if(window.XMLHttpRequest){//neue Version
xhr = new XMLHttpRequest();
}else{//alte Version
xhr = new ActiveXObject("Microsoft.XMLHttp");
}
//2Anfrage-Adresse
var url = "<c:url value='/XmlServlet'/>";
//3Setzen Sie den Zugriffsweg
xhr.open("POST", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange=function(){
if(xhr.readyState==4{//zurückgeben
if(xhr.status==200){//Antwortcode normal
var xmlObj=xhr.responseXML;
var users=xmlObj.getElementsByTagName("user");
for(var i=0;i<users.length;i++{
var id=users[i].getAttribute("id");
var name=users[i].childNodes[0].firstChild.data;//die Operationen im DOM-Modell von XML unterscheiden sich etwas von denen in HTML
var age=users[i].childNodes[1].firstChild.data;//kann nicht childNodes["age"]
alert(id+","+name+","+age);
}
}
}
};
var name=document.getElementsByName("name")[0].value;
var age=document.getElementsByName("age")[0].value;
var xml="<user><name>"+name+"</name><age>"+age+"</age></user>";
xhr.send(xml);
}
</script>
</head>
<body>
Name:
<input type="text" name="name">
<br /> Alter:
<input type="text" name="age">
<br />
<input type="button" value="Get Einreichung" onclick="send1();" />
<br />
<input type="button" value="Post Einreichung" onclick="send2()" />
<br />
</body>
</html>
Hintergrundseite
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Ajax XML Datenverarbeitungsdemonstration</title>
<script type="text/javascript">
//Ajax über GET-Method
function send1(){
alert("ok");
var name=document.getElementsByName("name")[0].value;
var age=document.getElementsByName("age")[0].value;
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject("Microsoft.XMLHttp");
}
var url="<c:url value='/XmlServlet?name='/">"+name+"&age="+age;
//3Setzen Sie den Zugriffsweg
xhr.open("GET", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange=function(){
if(xhr.readyState==4{//zurückgeben
if(xhr.status==200){//Antwortcode normal
var txt=xhr.responseText;
alert(txt);
}
}
};
xhr.send(null);
}
</script>
!-- Der Client sendet Daten im XML-Format an den Server -->
<script type="text/javascript">
//Ajax über POST-Method
function send2(){
alert("222");
//1Erstellen Sie das AJAX-Objekt
var xhr = null;
if(window.XMLHttpRequest){//neue Version
xhr = new XMLHttpRequest();
}else{//alte Version
xhr = new ActiveXObject("Microsoft.XMLHttp");
}
//2Anfrage-Adresse
var url = "<c:url value='/XmlServlet'/>";
//3Setzen Sie den Zugriffsweg
xhr.open("POST", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange=function(){
if(xhr.readyState==4{//zurückgeben
if(xhr.status==200){//Antwortcode normal
var xmlObj=xhr.responseXML;
var users=xmlObj.getElementsByTagName("user");
for(var i=0;i<users.length;i++{
var id=users[i].getAttribute("id");
var name=users[i].childNodes[0].firstChild.data;//die Operationen im DOM-Modell von XML unterscheiden sich etwas von denen in HTML
var age=users[i].childNodes[1].firstChild.data;//kann nicht childNodes["age"]
alert(id+","+name+","+age);
}
}
}
};
var name=document.getElementsByName("name")[0].value;
var age=document.getElementsByName("age")[0].value;
var xml="<user><name>"+name+"</name><age>"+age+"</age></user>";
xhr.send(xml);
}
</script>
</head>
<body>
Name:
<input type="text" name="name">
<br /> Alter:
<input type="text" name="age">
<br />
<input type="button" value="Get Einreichung" onclick="send1();" />
<br />
<input type="button" value="Post Einreichung" onclick="send2()" />
<br />
</body>
</html>
--------------------------------------------------------------------------------
Ajax Übertragung Json Datenwird die JSONArray-Klasse von Apache oder Alibaba verwendet, um die Übertragung durchzuführen
Vordergründiger Code
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Ajax Json Datenverarbeitungsdemonstration</title>
<script type="text/javascript">
function ask1() {
//1Erstellen Sie das AJAX-Objekt
var xhr = null;
if (window.XMLHttpRequest) {//neue Version
xhr = new XMLHttpRequest();
} else {//alte Version
xhr = new ActiveXObject("Microsoft.XMLHttp");
}
//2Anfrage-Adresse
var url = "<c:url value='/JsonServlet1'/>";
//3Setzen Sie den Zugriffsweg
xhr.open("POST", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {//zurückgeben
if (xhr.status == 200) {}}//Antwortcode normal
//※※※※※Parsing der von der Rückseite zurückgegebenen JSON-Kette
//Funktion des js-eval(): Es überprüft, ob der Parameter-Textfolge dem js-einem Datenformat entspricht und wandelt ihn in das entsprechende Objekttyp um
var txt = xhr.responseText;
var users = eval("(" + txt + ")"); //Konvertieren von Textfolgen im JSON-Format in JSON-Objekte
for ( var i = 0; i < users.length; i++) {
alert(users[i].id + "," + users[i].name + ","
+ users[i].age);
}
}
}
};
//5 Senden
xhr.send(null);
}
function ask2() {
//1Erstellen Sie das AJAX-Objekt
var xhr = null;
if (window.XMLHttpRequest) {//neue Version
xhr = new XMLHttpRequest();
} else {//alte Version
xhr = new ActiveXObject("Microsoft.XMLHttp");
}
//2Anfrage-Adresse
var url = "<c:url value='/JsonServlet2'/>";
//3Setzen Sie den Zugriffsweg
xhr.open("POST", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {//zurückgeben
if (xhr.status == 200) {}}//Antwortcode normal
//※※※※※Parsing der von der Rückseite zurückgegebenen JSON-Kette
//Funktion des js-eval(): Es überprüft, ob der Parameter-Textfolge dem js-einem Datenformat entspricht und wandelt ihn in das entsprechende Objekttyp um
var txt = xhr.responseText;
//alert(txt);
//Konvertieren von Textfolgen im JSON-Format in JSON-Objekte
var users = eval("(" + txt + ")");
for ( var key in users)//Map-Leistungsweg
alert("Eigenschaft:\ + key + ",Wert:\ + users[key]);
}
//for ( var i = 0; i < users.length; i++) {//Listenumlaufart
//alert(users[i].id +","+users[i].name+","+users[i].age);
//}
};
};
//5 Senden
xhr.send(null);
}
function ask3() {
//1Erstellen Sie das AJAX-Objekt
var xhr = null;
if (window.XMLHttpRequest) {//neue Version
xhr = new XMLHttpRequest();
} else {//alte Version
xhr = new ActiveXObject("Microsoft.XMLHttp");
}
//2Anfrage-Adresse
var url = "<c:url value='/JsonServlet2'/>";
//3Setzen Sie den Zugriffsweg
xhr.open("POST", url, true);
//4Setzen Sie die Aktion nach dem erfolgreichen Zugriff zurück
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {//zurückgeben
if (xhr.status == 200) {}}//Antwortcode normal
//※※※※※Parsing der von der Rückseite zurückgegebenen JSON-Kette
//Funktion des js-eval(): Es überprüft, ob der Parameter-Textfolge dem js-einem Datenformat entspricht und wandelt ihn in das entsprechende Objekttyp um
var txt = xhr.responseText;
//alert(txt);
//Konvertieren von Textfolgen im JSON-Format in JSON-Objekte
var users = eval("(" + txt + ")");
for ( var key in users)//Map-Leistungsweg
alert("Eigenschaft:\ + key + ",Wert:\ + users[key]);
}
//for ( var i = 0; i < users.length; i++) {//Listenumlaufart
//alert(users[i].id +","+users[i].name+","+users[i].age);
//}
};
};
//5 Senden
xhr.send(null);
}
</script>
</head>
<body>
<input type="button" onclick="ask1();" value="Datenanfrage vom Backend (manuelle Verpackung von JSON)" />
<br />
<input type="button" onclick="ask2();"
value="Datenanfrage vom Backend (Verwendung von apache zum Verpacken von JSON)" />
<input type="button" onclick="ask3()" value="Datenanfrage vom Backend (Verwendung von fastjson zum Verpacken von JSON)" />
</body>
</html>
JsonServlet1.java
package cn.hncu.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import cn.hncu.domain.User;
public class JsonServlet1 extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//Aufruf des Backend-Service.dao.query(), um Informationen aus der Datenbank zu lesen
//Um das Verständnis der Themen zu vereinfachen, wird hier die Backend-Funktion direkt simuliert
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
List<User> users = new ArrayList<User>();
users.add(new User("A001"," Jack ",20));
users.add(new User("A002"," Rose ",22));
users.add(new User("B001"," Zhang San ",20));
users.add(new User("B002"," Li Si ",30));
String json="";
//Mit Java eine JSON-Formatkette verpacken: [{name:"Jack",age:25}, {...}, {...} ]
for(User u:users){
if(json.equals("")){
json="{name:\""+u.getName()+"\",id:\""+u.getId()+"\",age:"+u.getAge()+"}";
}else{
json = json +",{ name:\""+u.getName()+"\",id:\""+u.getId()+"\",age:"+u.getAge()+"}" ;
}
}
json="["+json+"]";
out.print(json);
}
}
JsonServlet2.java
package cn.hncu.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import cn.hncu.domain.User;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
public class JsonServlet2 extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
List<User> users = new ArrayList<User>();
users.add(new User("A001"," Jack ",20));
users.add(new User("A002"," Rose ",22));
users.add(new User("B001"," Zhang San ",20));
users.add(new User("B002"," Li Si ",30));
String strJson=com.alibaba.fastjson.JSONArray.toJSONString(users);
System.out.println(strJson);
//Verwenden Sie das Tool fastjson (es gibt nur eine jar-Datei), um die Liste in eine JSON-Zeichenfolge zu konvertieren
Map<String, Object> map = new HashMap<String, Object>();
map.put("addr", "Hunan");
map.put("height", "170");
map.put("marry", "no");
map.put("user", new User("A003"," Xiao Li ",25));
String strMap=com.alibaba.fastjson.JSONArray.toJSONString(map);
out.print(strMap.toString());
}
}
JsonServlet3.java
package cn.hncu.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import cn.hncu.domain.User;
public class JsonServlet3 extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
List<User> users = new ArrayList<User>();
users.add(new User("A001"," Jack ",20));
users.add(new User("A002"," Rose ",22));
users.add(new User("B001"," Zhang San ",20));
users.add(new User("B002"," Li Si ",30));
//Verwenden Sie das Tool fastjson (es gibt nur eine jar-Datei), um die Liste in eine JSON-Zeichenfolge zu konvertieren
JSONArray json=JSONArray.fromObject(users);
String strJson=json.toString();
System.out.println(strJson);
Map<String, Object> map = new HashMap<String, Object>();
map.put("addr", "Hunan");
map.put("height", "170");
map.put("marry", "no");
map.put("user", new User("A003"," Xiao Li ",25));
JSONObject obj = JSONObject.fromObject(map);
System.out.println(obj.toString());
out.print(obj.toString());
}
}
Das ist der gesamte Inhalt dieses Artikels. Wir hoffen, dass er Ihnen bei Ihrem Lernen hilft und dass Sie die Anleitung von Rufen stark unterstützen.
Erklärung: Der Inhalt dieses Artikels stammt aus dem Internet und ist dem Urheberrecht des jeweiligen Autors unterliegt. Der Inhalt wurde von Internetnutzern selbstständig beigesteuert und hochgeladen. Diese Website besitzt keine Eigentumsrechte und hat den Inhalt nicht von Hand bearbeitet. Sie übernimmt auch keine Haftung für rechtliche Fragen. Wenn Sie Inhalte mit urheberrechtlichen Bedenken finden, sind Sie herzlich eingeladen, eine E-Mail an notice#w zu senden.3codebox.com (Bitte ersetzen Sie # durch @, wenn Sie eine Meldung senden, und geben Sie relevante Beweise an. Sobald die Anzeige überprüft wurde, wird diese Website den beschuldigten Inhalt sofort löschen.)