집 > 기사 > 백엔드 개발 > Ajax가 비동기 요청을 보내는 4단계

Ajax가 비동기 요청을 보내는 4단계

小云云원래의: 2018-05-30 09:43:283614검색

이 기사에서는 비동기 요청을 보내기 위해 Ajax를 쉽게 구현하는 방법을 주로 설명합니다. 관심 있는 친구들이 참고하여 비동기 요청을 보내는 데 도움이 되기를 바랍니다.

ajax는 참조에 대한 비동기 요청을 보냅니다. 구체적인 내용은 다음과 같습니다

첫 번째 단계(XMLHttpRequest 가져오기)

ajax는 실제로 XMLHttpRequest 객체 하나만 학습하면 됩니다. !!!

1. XMLHttpRequest 가져오기

대부분의 브라우저 지원: var xmlHttp=new XMLHttpRequest();
IE6.0: var xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
IE5.0 및 이전 버전 IE : var xmlHttp=new ActiveXObject("Microsoft. 서버와의 연결을 열려면 세 가지 매개 변수가 필요합니다.

요청 방법: GET 및 POST일 수 있습니다.

요청 URL: 서버 측 리소스를 지정합니다. 예: /day23_1 /AServlet

요청이 비동기인지 여부: true이면 비동기 요청을 보내는 것을 의미하고, 그렇지 않으면 동기 요청을 보내는 것을 의미합니다

xmlHttp.open("GET","/day23_1/AServlet",true);//예를 들어

Step
(Send request)

xmlHttp.send( null): 주어지지 않으면 일부 브라우저에서는 보내지 못할 수도 있습니다!
Parameter: GET 요청인 경우, null을 주어야 합니다.

POST 요청인 경우 다음과 같이

xmlHttp.send("username=zhangSan&password=123");

4단계:

xmlHttp 객체의 이벤트에 리스너를 등록합니다: onreadystatechange x mlHttp 개체에는 총 5가지 상태가 있습니다.
0: 초기화가 완료되지 않았고 XMLHttpRequest 개체가 생성되었을 뿐이며 아직 open() 메서드가 호출되지 않았습니다.

1: 요청이 시작되었으며 열려 있습니다. () 메소드가 호출되었으나 아직 send() 메소드가 호출되지 않은 경우

2: 전송 완료 상태 요청, send() 메소드가 호출된 경우 3: 서버 응답 읽기 시작 4: 서버 응답 읽기 종료 (보통 우리는 마지막 상태만 관심있습니다!!!)

xmlHttp 개체의 상태를 가져옵니다.

function createXMLHttpRequest(){
     try{
     return new XMLHttpRequest();
     } catch(e){
     try{
     return new ActiveXObject(“Msxml2.XMLHTTP”);
    }catch(e){
     try{
      return new ActiveXObject(“Microsoft.XMLHTTP”);
     }catch(e){
       alert(“哥们儿,你用的是什么浏览器啊?”);
       throw e;
    }
    }
     } 
}

서버 응답의 상태 코드를 가져옵니다. (200: 성공 304: 상태가 변경되지 않았습니다. 404 500: 서버 오류)

var state = xmlHttp.readyState;//可能是0、1、2、3、4

서버 응답 내용 가져오기

var status=xmlHttp.status;//例如200、404、500

그러므로 리스너는 다음과 같이 작성해야 합니다

var content=xmlHttp.responseText;//得到服务器的响应的文本格式的内容(这更通用)
var content=xmlHttp.responseXML;//得到服务器的响应的xml响应的内容,它是document对象了!

Ajax가 비동기 요청을 보내는 4단계

관련 기사