아약스의 원리는 무엇입니까? Ajax의 공통 속성 및 원리 분석(요약)

이 기사는 주로 ajax에 대한 요약, 몇 가지 질문 및 답변에 대해 설명합니다. 모든 사람에게 도움이 되기를 바랍니다. 지금 이 글을 함께 읽어볼까요

먼저 ajax는 Asynchronous JavaScript 및 XML의 전체 이름이고, Asynchronous는 비동기를 의미하며 기존 웹과 다릅니다.

동기화란 무엇이고 비동기란 무엇인가요?

동기화는 발신자가 데이터를 보낸 후 다음 단계로 진행하기 전에 수신자가 데이터를 수신하고 응답할 때까지 기다려야 함을 의미합니다.

비동기식이라면 송신자는 데이터를 보낸 후 수신자가 응답할 때까지 기다리지 않고 다음 단계로 진행할 수 있습니다.

동기화는 A가 B에게 저녁 먹으러 가자고 하는 것과 같습니다. 이때 A는 B에게 함께 식사하자고 요청합니다. 아니요, A가 혼자 있기로 결정하기 전에 B가 그와 함께 갈 때까지 기다려야 합니다. 비동기식이라면 A가 B에게 식사를 하겠다고 말한 다음 떠나는 것과 같습니다. B가 어떤 반응을 보이든 상관없이.

Ajax 원리

간단히 말하면 XMLHttpRequest 객체를 통해 서버에 비동기 요청을 보내고, 서버로부터 데이터를 받은 후 JS를 통해 DOM 노드를 동작시키는 것입니다.

XMLHttpRequest 개체

메서드:

1.open(요청 유형, URL, 부울)

2.send() 매개변수는 요청 본문에서 데이터를 보낼 필요가 없으면 null

3.abort()를 전달하여 비동기 요청

4.getAllResponseHeaders()을 취소하세요. 모든 HTTP 요청을 넣습니다. 응답 헤더는 키/값 쌍으로 반환됩니다.

5.getResponseHeader("header")지정된 헤더의 문자열 값을 반환합니다

6.setRequestHeader("헤더", "value")지정된 헤더를 제공된 값으로 설정합니다. open()은 헤더를 설정하기 전에 호출되어야 합니다. 헤더를 설정하고 요청과 함께 보냅니다. ('post' 메소드 필수)

Ajax의 공통 속성:

1.readyState는 요청/응답 프로세스의 현재 활성 단계를 나타냅니다(0: 초기화되지 않음, open 메소드가 완료되지 않음). 1: 시작, open 메소드가 호출되었지만 send 메소드가 호출되지 않았습니다. 2: send가 호출되었지만 응답이 수신되지 않았습니다. 3: 수신, 응답 데이터의 일부가 수신되었습니다. 4. 완료, 클라이언트에서 사용 가능)

2.onreadystatechange 이 메소드는 ReadyState 값이 변경될 때 한 번 호출됩니다(자세한 내용은 PHP 중국어 웹사이트AJAX 개발 매뉴얼 컬럼을 참조하세요. learn)

3.responseText 응답 본문으로 반환되는 텍스트

4.responseXML 응답 유형이 "text/xml" 또는 "application/xml"인 응답 데이터의 XML DOM 문서를 저장합니다.

5.status 응답 HTTP 상태

6.statusText Http 상태 설명

아래 XHR 객체 생성:

function createXHR(){
if(typeof XMLHttpRequest != "undefined"){
return new XMLHttprequest();
}else if(typeof ActiveXObject != "undefined"){
if(typeof arguments.callee.sctiveXString != "string"){
var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"],i,len;
for(i =0;i<versions.length;i<len;i++){
try{
new ActiveXObject(versions[i]);
arguments.callee.activeXString = versions[i];
break;
}catch(ex){
跳过
}
}
}
return new ActiveXObject(arguments.callee.activeXString);
}else{
throw new Error("No XHR object available");
}
}
var xhr = createXHR();
xhr.onreadyststechange = function(){
if(xhr.readyState == 4){
if((xhr.status >= 200 && xhr.status <300) || 304){
alert(xhr.responseText);
}else{
alert("请求位成功"+ xhr.status);
}
}
};
xhr.open("get","aaa.txt",true);
xhr.send(null);

ajax 장점:

1 새로 고침 없이 데이터 업데이트, 사용자 대기 시간 단축, 더 나은 사용자 경험

2. , 사용자를 방해하지 않고 응답 속도가 빨라집니다

3. 서버의 일부를 넣을 수 있습니다. 부담은 클라이언트로 이전됩니다. 클라이언트의 유휴 용량을 처리에 사용하여 서버 및 대역폭의 부담을 줄이고, 공간 및 광대역 임대 비용. 그리고 서버의 부담을 줄이기 위해 AJAX의 원칙은 "요청 시 데이터 가져오기"로, 중복된 요청과 응답으로 인해 발생하는 서버의 부담을 최소화하고 사이트 성능을 향상시킬 수 있습니다.

5. 표준화를 기반으로 널리 지원됨

ajax 단점

1. 사용자는 이전 작업을 취소하기 위해 뒤로 버튼을 사용하는 경우가 많습니다. Ajax Achieve를 사용하여 수행할 수 없습니다. Gmail을 사용하여 이 문제를 해결할 수 있습니다. 비교적 어리석지만 효과적인 방법, 즉 사용자가 기록에 액세스하기 위해 뒤로 버튼을 클릭할 때 숨겨진 IFRAME을 생성하거나 사용하여 콘텐츠를 재생하는 것입니다. 페이지 변경시.

2. 보안 문제. ajax 기술은 기업 데이터에 대한 직접적인 채널을 구축하는 것과 같습니다. 이를 통해 개발자는 이전보다 더 많은 데이터와 서버 로직을 실수로 노출할 수 있습니다. ajax의 논리는 클라이언트 측 보안 검색 기술에서 숨겨져 해커가 원격 서버에서 새로운 공격을 수행할 수 있습니다. 그리고 자체도 크로스 사이트 스크립팅 공격, SQL 인젝션 등의 공격을 받기 쉽습니다.

3 검색 엔진에 대한 약한 지원 #🎜 🎜 #

4. 일부 휴대용 기기에서는 제대로 지원되지 않습니다.# 🎜🎜#이 기사는 여기에서 끝납니다. (자세한 내용을 보려면 PHP 중국어 웹사이트

열을 참조하세요.) 궁금한 점이 있으면 아래에 메시지를 남겨주세요.

위 내용은 아약스의 원리는 무엇입니까? Ajax의 공통 속성 및 원리 분석(요약)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!