這篇文章主要講解了“如何理解Ajax核心XMLHttpRequest”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“如何理解Ajax核心XMLHttpRequest”吧!
成都創(chuàng)新互聯(lián)公司是一家專注于成都網站設計、成都做網站與策劃設計,蘭坪網站建設哪家好?成都創(chuàng)新互聯(lián)公司做網站,專注于網站建設10多年,網設計領域的專業(yè)建站公司;建站業(yè)務涵蓋:蘭坪等地區(qū)。蘭坪做網站價格咨詢:18982081108
使用方法
XMLHttpRequest五步使用法:
復制代碼 代碼如下:
1.創(chuàng)建對象;
2.注冊回調函數(shù);
3.使用open方法設置和服務器交互的基本信息;
4.設置發(fā)送的數(shù)據,開始和服務器端交互;
5.實現(xiàn)回調函數(shù)。
由于每次應用XMLHttpRequest對象時,都要進行五步操作,因此,可將該對象的使用封裝為js文件中,傳遞部分參數(shù)使用其方法就可以完成相應功能,實現(xiàn)如下:
復制代碼 代碼如下:
//使用封裝方法人員只提供http的請求,url地址,數(shù)據,成功和失敗的回調的方法
//1.定義XMLHttpRequest對象的構造方法
var MyXMLHttpRequest =function(){
var xmlhttprequest;
if(window.XMLHttpRequest){
//IE7,IE8,FireFox,Mozillar,Safari,Opera
//alert("IE7,IE8,FireFox,Mozillar,Safari,Opera");
xmlhttprequest = new XMLHttpRequest();
//解決瀏覽器在服務器端響應由于沒有Text頭的時候可能無法工作的問題
if(xmlhttprequest.overrideMimeType){
xmlhttprequest.overrideMimeType("text/xml");
}
}else if(window.ActiveXObject){
//IE6,IE5.5,IE5
alert("IE6,IE5.5,IE5");
var activexName =["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
for (var n=0;n
擴展問題
1.瀏覽器緩存
2.中文亂碼
3.跨域訪問
對于問題1、問題3都可以通過更改url地址的方法得以解決。問題1可在url地址尾添加時間戳,問題3通過代理方式進行解決。只需在send()中的第三步執(zhí)行前添加相應判斷即可:
復制代碼 代碼如下:
//解決緩存的轉換:增加時間戳
if(url.indexOf("?") >= 0 ){
url = url + "&t=" + (new Date())。valueOf();
} else {
url = url + "?t=" + (new Date())。valueOf();
}
//解決跨域的問題
if(url.indexOf("http://") >= 0) {
url.replace("?","&");
url = "Proxy?url=" + url;
}
問題3對應代理服務端實現(xiàn):
復制代碼 代碼如下:
/**
* Handles the HTTP GET method.
*
* @param request servlet request
* @param response servlet response
* @throws ServletException if a servlet-specific error occurs
* @throws IOException if an I/O error occurs
*/
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//獲取參數(shù),最后得到請求url地址類似于:url = http://192.168…/AJAX/AJAXServer?aa=11&bb=22&cc=33
StringBuilder url = new StringBuilder();
url.append(request.getParameter("url"));
//獲取訪問的跨域地址url = http://192.168…/AJAX/AJAXServer
Enumeration enu = request.getParameterNames();
boolean flag = false; //定義標志變量,表示是否為拼接的第一個參數(shù)
while(enu.hasMoreElements()){
String paramName = (String) enu.nextElement();
if(!paramName.equals("url")){
String paramValue = request.getParameter(paramName);
paramValue = URLEncoder.encode(paramValue,"utf-8");
if(!flag){
url.append("?")。append(paramName)。append("=")。append(paramValue);
flag = true;
} else {
url.append("&")。append(paramName)。append("=")。append(paramValue);
}
}
}
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
if(url != null && url.length() > 0){
URL connectionUrl = new URL(url.toString());
BufferedReader reader = new BufferedReader(new InputStreamReader(connectionUrl.openStream(),"utf-8"));
感謝各位的閱讀,以上就是“如何理解Ajax核心XMLHttpRequest”的內容了,經過本文的學習后,相信大家對如何理解Ajax核心XMLHttpRequest這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是創(chuàng)新互聯(lián),小編將為大家推送更多相關知識點的文章,歡迎關注!