AJAX 크로스 도메인 요청 데이터 방법 요약(실제 설명)

이번에는 AJAX 크로스 도메인 데이터 요청 방법에 대한 요약(실습 설명)을 가져오겠습니다. AJAX 크로스 도메인 데이터 요청에 대한 주의사항은 무엇인가요?

브라우저의 동일 출처 정책으로 인해 ajax 요청은 요청 응답에서 반환된 데이터를 받을 수 없습니다.

요청 데이터는 브라우저에 내장된 constructor XMLHttpRequest()를 호출하여 인스턴스 객체를 생성해야 합니다

var xhr = new XMLHttpRequest();

ActiveX객체에 주의하세요("Microsoft. .readyState 이 속성은 요청 데이터의 여러 상태를 저장합니다

1.xhr.open(요청 방법, 요청 주소, 동기화/비동기 설정);

2.xhr.send(null);// 요청 보내기

게시물 요청인 경우 매개변수를 send

에 전달해야 합니다. 3. 항상 데이터가 반환되는지 확인합니다.

4 데이터가 반환되면 xhr.readyState의 값은 4이며 이는 데이터가 성공적으로 반환되었음을 나타냅니다.

그렇다면 도메인 간 요청을 어떻게 할까요?

옵션 1:

스크립트 태그의 src 속성을 사용하여 src 속성으로 요청한 데이터는 브라우저에서 가로채지 않습니다. 이 방법으로 데이터를 요청할 수 있지만 여기에는 몇 가지 단점이 있습니다

1 요청을 보낼 시기를 제어할 수 없습니다. 여기에 페이지가 로드되면 요청이 전송됩니다

2 이러한 방식으로 요청 방법은 코드의 다음 단계가 실행되기 전에 데이터를 요청해야 합니다. 따라서 페이지 로딩 시간이 길어질 수 있으므로 사용하지 않는 것이 좋습니다. 이 방법을 권장합니다.

옵션 2:

요청된 인터페이스를 지정하기 위해 js에서 스크립트 태그를 동적으로 생성합니다.

var script = document.createELement("script");//스크립트 추가 헤드 태그

document.getElementsTagName("head")[0].appendChild(script);

장점: 요청 타이밍을 제어할 수 있으며 요청은 비동기식이며 페이지 로딩 시간을 연장하지 않습니다중요 포인트: 우리 요청 페이지의 요청 데이터에 있는 함수를 호출할 수 있습니다.

함수의 공식 매개변수를 사용하여

요청에서 반환된 데이터를 받습니다.

옵션 3:

요청 헤더 설정 요청의 백엔드 인터페이스

Access- Control-Allow-Origin이 요청 헤더를 포함하면 프런트엔드 페이지의 도메인 간 요청 데이터가 브라우저에서 가로채지 않습니다

옵션 4:

페이지에 액세스하려면

추천 자료: Ajax+php가 데이터 상호 작용 및 부분 페이지 새로 고침을 수행하는 방법

양식 양식 제출을 구현하는 Ajax 메서드

위 내용은 AJAX 크로스 도메인 요청 데이터 방법 요약(실제 설명)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!