1、首先,AJAX是什么?其全称是Asynchronous JavaScript and XML,即异步的JAVASCRIPT 和 XML。它不是一种新的编程语言,
而是一种利用现有技术实现的与服务器交换数据达到局部刷新(即无需重新加载整个页面,仅更新局部页面)的技术。
注意:要实现局部刷新,也可以使用Iframe来实现。
2、XMLHttpRequest对象
XMLHttpRequest对象是AJAX的基础,用于建立请求、向服务器发送数据等等。
所有现代浏览器(IE7+、Firefox、Chrome、Safari 以及 Opera)均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject)。
创建XMLHttpRequest对象:
var xmlhttp= window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp");
通过使用 XMLHttpRequest 对象的 open() 和 send() 方法,向服务器发送请求:
xmlhttp.open("GET",target_url,true);
xmlhttp.send();
方法参数介绍:
open(method,url,async):
- method:请求的类型;GET(使用GET,可能获取的是缓存文件) 或 POST (当发送大量数据时,使用POST,因为POST没有数据量限制,并且稳定些)
- url:文件在服务器上的位置
- async:true(异步)或 false(同步)
send(string):
将请求发送到服务器。(参数string:仅用于 POST 请求)
3、POST 提交form数据
如果需要像 HTML 表单那样 POST 数据,则需要通过 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中添加要发送的数据:
var xmlhttp= window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp");
xmlhttp.open("post","result.jsp",false);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("name=xiao8&password=123");
4、服务器响应
可以通过XMLHttpRequest 对象的 responseText 或 responseXML 属性获取服务器响应信息。
responseText : 获得字符串形式的响应数据。
responseXML : 获得 XML 形式的响应数据。
5、通过ajax 和 adodb.stream组件 上传文件
首先需要通过adodb.stream组件装载本地文件数据,然后生成xml对象,并封装数据,在通过 ajax把xml数据发送到服务器,最后在服务器解析出来。
下面是具体例子:通过js封装xml数据,上传本地附件
// 保存到xml附件,并且通过ajax 上传
function SaveAttachment(upload_filename,localFilePath,upload_filepath){
var upload_target_url = "<%=targetURL%>";
var strTempFile = localFilePath;
// 创建XML对象,组合XML文档数据
var xml_dom = createDocument();
xml_dom.loadXML('<?xml version="1.0" encoding="GBK" ?> <root/>');
// 创建ADODB.Stream对象
var ado_stream = new ActiveXObject("adodb.stream");
// 设置流数据类型为二进制类型
ado_stream.Type = 1; // adTypeBinary
// 打开ADODB.Stream对象
ado_stream.Open();
// 将本地文件装载到ADODB.Stream对象中
ado_stream.LoadFromFile(strTempFile);
// 获取文件大小(以字节为单位)
var byte_size = ado_stream.Size;
// 设置数据传输单元大小为1KB
var byte_unit = 1024;
// 获取文件分割数据单元的数量
var read_count = parseInt((byte_size/byte_unit).toString())+parseInt(((byte_size%byte_unit)==0)?0:1);
// 创建XML元素节点,保存上传文件名称
var node = xml_dom.createElement("uploadfilename");
node.text = upload_filename.toString();
var root = xml_dom.documentElement;
root.appendChild(node);
// 创建XML元素节点,procId
var node = xml_dom.createElement("procid");
node.text = "<%=procId%>";
root.appendChild(node);
// 创建XML元素节点,签发人
var node = xml_dom.createElement("qfPerson");
var qfPerson = $("#person").val();
if(qfPerson == "99"){
qfPerson = $("#o_person").val();
}
node.text = qfPerson;
root.appendChild(node);
// 签发时间
var node = xml_dom.createElement("qfTime");
var qfTime = $("#qfTime").val();
node.text = qfTime;
root.appendChild(node);
// 创建XML元素节点,保存上传文件路径
var node = xml_dom.createElement("uploadfilepath");
node.text = upload_filepath.toString();
root.appendChild(node);
// 创建XML元素节点,保存上传文件大小
var node = xml_dom.createElement("uploadfilesize");
node.text = byte_size.toString();
root.appendChild(node);
// 创建XML元素节点,保存上传文件内容
for(var i=0;i<read_count;i++)
{
var node = xml_dom.createElement("uploadcontent");
// 文件内容编码方式为Base64
node.dataType = "bin.base64";
// 判断当前保存的数据节点大小,根据条件进行分类操作
if((parseInt(byte_size%byte_unit)!=0)&&(i==parseInt(read_count-1)))
{
// 当数据包大小不是数据单元的整数倍时,读取最后剩余的小于数据单元的所有数据
node.nodeTypedValue = ado_stream.Read();
}
else
{
// 读取一个完整数据单元的数据
node.nodeTypedValue = ado_stream.Read(byte_unit);
}
root.appendChild(node);
}
// 关闭ADODB.Stream对象
ado_stream.Close();
delete ado_stream;
// 创建Microsoft.XMLHTTP对象
// var xmlhttp = new ActiveXObject("microsoft.xmlhttp");
var xmlhttp= window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp");
// 打开Microsoft.XMLHTP对象
xmlhttp.open("post",upload_target_url,false);
// 使用Microsoft.XMLHTP对象上传文件
xmlhttp.send(xml_dom);
var state = xmlhttp.readyState;
var success_state = true;
if(state != 4){
success_state = false;
}
delete xmlhttp;
return success_state;
}
// 创建DOMdocuemnt
function createDocument() {
var xmldom;
var versions = ["MSXML2.DOMDocument.6.0", "MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0","MSXML2.DOMDocument.3.0", "MSXML2.DOMDocument"],
i, len;
for (i = 0, len = versions.length; i < len; i++) {
try {
xmldom = new ActiveXObject(versions[i]);
if(xmldom != null)
break;
} catch (ex) {
//跳过
alert("创建document对象失败!");
}
}
return xmldom;
}
服务器解析数据(java servlet)
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException {
// 设置数据传输单元大小为1KB
int unit_size = 1024;
// 初始化xml文件大小(以字节为单位)
int xmlfilesize = 0;
// 初始化上传文件名称(完整文件名)
String xmlfilename = "";
// 初始化上传文件保存路径(绝对物理路径)
String xmlfilepath = "";
// procid
String procId = "";
// 签发人
String qfPerson = "";
// 签发时间
String qfTime = "";
// 声明文件存储字节数组
byte[] xmlfilebytes = null;
try {
// 初始化 SAX 串行xml文件解析器
SAXBuilder builder = new SAXBuilder();
Document doc = builder.build(request.getInputStream());
Element eroot = doc.getRootElement();
// 获取上传文件的完整名称
Iterator it_name = eroot.getChildren("uploadfilename").iterator();
if (it_name.hasNext()) {
xmlfilename = ((Element) it_name.next()).getText();
}
// 获取上传文件的完整名称
Iterator it_procId = eroot.getChildren("procid").iterator();
if (it_procId.hasNext()) {
procId = ((Element) it_procId.next()).getText();
}
// 获取签发人
Iterator it_qfPerson = eroot.getChildren("qfPerson").iterator();
if (it_qfPerson.hasNext()) {
qfPerson = ((Element) it_qfPerson.next()).getText();
}
// 获取签发时间
Iterator it_qfTime = eroot.getChildren("qfTime").iterator();
if (it_qfTime.hasNext()) {
qfTime = ((Element) it_qfTime.next()).getText();
System.out.println("qfTime:"+qfTime);
}
// 获取上传文件保存的绝对物理路径
Iterator it_path = eroot.getChildren("uploadfilepath").iterator();
if (it_path.hasNext()) {
xmlfilepath = ((Element) it_path.next()).getText();
}
// 获取上传文件的大小
Iterator it_size = eroot.getChildren("uploadfilesize").iterator();
if (it_size.hasNext()) {
xmlfilesize = Integer.parseInt(((Element) it_size.next())
.getText());
if (xmlfilesize > 0) {
int unit_count = 0;
// 为存储文件内容的字节数组分配存储空间
xmlfilebytes = new byte[xmlfilesize];
// 循环读取文件内容,并保存到字节数组中
Iterator it_content = eroot.getChildren("uploadcontent")
.iterator();
while (it_content.hasNext()) {
// 初始化Base64编码解码器
BASE64Decoder base64 = new BASE64Decoder();
byte[] xmlnodebytearray = base64
.decodeBuffer(((Element) it_content.next())
.getText());
if (xmlnodebytearray.length >= unit_size) {
// 读取一个完整数据单元的数据
System.arraycopy(xmlnodebytearray, 0, xmlfilebytes,
unit_count * unit_size, unit_size);
} else {
// 读取小于一个数据单元的所有数据
System.arraycopy(xmlnodebytearray, 0, xmlfilebytes,
unit_count * unit_size, xmlfilesize
% unit_size);
}
// 继续向下读取文件内容
unit_count++;
}
}
}
// 保存路径
File path = new File(xmlfilepath);
if(!path.exists()){
path.mkdirs();
}
// 保存文件
File file = new File(path,xmlfilename);
// 创建文件输入输出流
FileOutputStream fos = new FileOutputStream(file);
// 写入文件内容
fos.write(xmlfilebytes);
fos.flush();
// 关闭文件输入输出流
fos.close();
} catch (Exception e) {
e.printStackTrace();
}
}