1. 크로스 도메인이란 무엇입니까?
브라우저는 보안상의 이유에 대해 동일한 원래 정책 제한을 채택하기 때문에 jQuery는 도메인 이름에서 개체 또는 데이터를 직접 작동 할 수 없습니다. 예 : A.com
a.html 페이지는 jquery를 사용하여 B.com 도메인 이름에서 B.html 페이지의 객체 또는 데이터를 작동 할 수 없으며 기본적으로 test.a.com 도메인 이름을 작동 할 수 없습니다.
test.html의 객체 또는 데이터. jQuery가 다음 조건을 충족하는 한, 이는 크로스 도메인 이름으로 간주됩니다.
1. 기본 도메인은 동일하며 xxx.aaa.com 및 yyy.aaa.com과 같은 하위 도메인이 다릅니다.
2. 도메인 이름은 동일하지만 xxx.aaa.com:8000 및 xxx.aaa.com과 같은 포트는 다릅니다.
3. 도메인 이름은 동일하지만 http://www.aaaa.com/ 및 https://www.aaa.com/과 같은 프로토콜이 다릅니다.
프로토콜, 도메인 이름 및 포트가 정확히 동일한 jQuery 인 경우에만 교차 도메인 이름이 아닌 것으로 간주됩니다.
2. jQuery 크로스 도메인 이름 작동 대상에 대한 솔루션
1. 최상위 도메인 이름의 첫 도착 상황
기본적으로 A.com 도메인 이름의 A.HTML 페이지는 jQuery를 사용하여 Test.A.com 도메인 이름에서 test.html 객체 또는 데이터를 작동 할 수 없습니다. 그러나 최상위 도메인 이름과 동일한 상황에서는 a.html 및 test.html의 documain = a.com을 재설정하십시오.
2. 최상위 도메인 이름이 다른 상황
a.html 페이지에는 a.com 도메인 이름 $ .getjson 및 $ .ajax에 대한 두 가지 방법이 있습니다.
(1) jQuery의 Ajax를 통한 교차 도메인은 실제로 JSONP 방법을 사용하여 구현됩니다.
JSONP는 영어로 패딩이있는 JSON의 약어입니다. 서버 측의 스크립트 태그 생성이 클라이언트로 돌아갈 수 있습니다. 즉, JavaScript 태그를 동적으로 생성합니다.
데이터 읽기는 JavaScript 콜백 형태를 통해 실현됩니다.
HTML 페이지 측면의 샘플 코드 :
코드는 다음과 같습니다.
// 우선, jQuery 's JQuery (document) .ready (function () {$ .ajax ({type : "get", // jquey는 Cross-Domain Async : False, URL : "http://api.vevb.vevb.vevb.aapitools/ajax_props.do"를 지원하지 않아야합니다. "JSONP", // JSONP 콜백 함수 이름의 매개 변수 이름 (기본값 : 콜백) jsonp : "jsonCallback", // "jsonCallback", // "jsonCallback", // "jsonCallback", // "jsonCallback", "jsonCallback", // "jsonCallback", "jsonCallback", "jsonCallback", "jsonCallback", // "jsonp 콜백 함수 이름은 기본 랜덤 함수 이름 JSONPCALLBACK jquery에 의해 자동으로 생성됩니다. 동적으로 실행됩니다.서버 측 샘플 코드, 예를 들어 Java를 가져옵니다.
서버 측 코드가 핵심 포인트입니다. 처음에는 클라이언트가 JSONP를 통해 도메인에 걸쳐 직접 액세스 할 수있는 한, 그렇지 않으며 서버 측 지원이 필요하다고 생각했습니다.
코드는 다음과 같습니다.
public void jsonptest ()는 ioexception {httpservletrequest request = servletactionContext.getRequest (); httpservletResponse 응답 = servletactionContext.getResponse (); // html에 의해 지정된 jsonp 콜백 함수의 매개 변수 이름을 기반으로 콜백 함수의 이름을 가져옵니다. // 콜백 이름의 값은 실제로 : success_sonpcallback 문자열 callbackname = (string) request.getAttribute ( "jsonCallback"); // JSON 문자열을 간단하게 시뮬레이션합니다. 실제로 Google의 GSON을 사용하여 변환 할 수 있습니다. 문자열 스 플라이 싱 // { "이름": "Zhang San", "Age": 28} /// "sign. String. jsonstal ="{/"name/":/"zhang san/",/"age/": 28} "; // 결승 반환 데이터는 : inconse_sonpcallback ({jhang") "" "" " renderstr = CallbackName+"("+jsonst+");JSONP의 원리 :
먼저 클라이언트의 콜백 (예 : 'jsonCallback')을 등록한 다음 콜백 이름 (예 : : success_jsonpCallback)을 서버 측의 해당 처리 기능으로 전달하십시오.
서버는 클라이언트에게 반환 해야하는 JSON 데이터를 생성합니다. 그런 다음 JavaScript 구문 형식으로 함수가 생성되고 함수 이름은 전달 된 매개 변수 (JSONCALLBACK) (success_jsonpCallback)의 값입니다.
마지막으로, JSON 데이터는 매개 변수로서 기능에 직접 배치되어 JS 구문 문서를 생성하여 클라이언트로 반환합니다.
클라이언트 브라우저는 스크립트 태그를 구문 분석하고 서버에서 반환 한 데이터를 매개 변수로 사용합니다.
클라이언트가 사전 정의 한 콜백 함수로 전달됩니다 (위의 예에서와 같이, 성공 : JSON (JUCT).
실제로, 크로스 도메인은 스크립트를 동적으로 추가하여 데이터를로드하고 데이터를 직접 얻을 수 없으므로 콜백 기능이 필요합니다.
(2) jQuery의 getjson을 사용하여 도메인에서 데이터를 읽습니다
실제로 GetJson 방법의 기본 원칙은 Ajax가 JSONP를 사용하는 방식과 동일합니다.
GetJson은 일반적으로 jQuery에서 호출하여 원격 데이터를 가져 와서 JSON 형식을 통해 반환하는 데 사용됩니다. 기능의 프로토 타입은 다음과 같습니다.
jQuery.getJson (URL, 데이터, 성공 (데이터, 상태, XHR)))
매개 변수 설명
URL이 필요합니다. 요청에 보낼 URL을 지정합니다.
데이터는 선택 사항입니다. 요청과 함께 서버로 전송 된 데이터를 지정합니다.
성공 (데이터, 상태, XHR)은 선택 사항입니다. 요청이 성공할 때 실행할 기능을 지정합니다.
추가 매개 변수 :
Response- 요청의 결과 데이터가 포함됩니다
Status- 요청 상태를 포함합니다
XHR- XMLHTTPREQUEST 객체를 포함합니다.
이 함수는 약식 Ajax 함수이며 실제로는 다음과 같습니다.
코드는 다음과 같습니다.
$ .ajax ({url : url, data : data, success : 콜백, 데이터 유형 : json});요점으로 돌아가서 GetJson을 사용하여 도메인에서 데이터를 얻는 방법을 살펴 보겠습니다.
HTML 페이지의 샘플 코드 :
코드는 다음과 같습니다.
$ .getJson ( "http://api.vevb.com/apitools/ajax_props.do&jsoncallback=?", function (data) {alert (data);});실행 원칙 :
요청을 보낼 때는 콜백 콜백 함수 이름을 서버 측에 전달해야합니다. 서버 측은 콜백 함수 이름을 가져온 다음 클라이언트가 호출 할 수 있도록 매개 변수 형식으로 클라이언트에 리턴 데이터를 반환합니다.
따라서 요청 URL의 주소 후에는 jsoncallback =?와 같은 매개 변수를 사용해야하며 jQuery는 자동으로 교체해야합니다. 자동으로 생성 된 콜백 함수의 이름이있는 번호입니다.
따라서 최종 실제 요청은 http://api.vevb.com/apitools/ajax_props.do&jsoncallback=jsonp1322444422697입니다
따라서 AJAX 메소드와 비교하려면 콜백 함수는 자동으로 생성 된 함수 이름 중 하나이고 다른 하나는 수동으로 지정된 기능 이름입니다.
다음 사항에주의하십시오.
1. 데이터 수신자에게 전송 된 주소는 Callback =?와 같은 매개 변수와 함께 추가되어야합니다. jQuery로 자동으로 교체 될 콜백 메소드의 이름입니다. (jQuery 1.4에서는 콜백 메소드의 이름을 직접 지정할 수 있습니다)
2. JS 스크립트가 전송하는 데이터는 var data = "{ 'username': 'sanjer', 'userId': '110'}"으로 쓸 수 없습니다. 그러나 var data = {username : 'sanjer', userId : '110'}으로 작성해야 하며이 시점에주의를 기울여야합니다. 서버가 반환 한 데이터를 받으려면 서버는 데이터를 JSON 형식 문자열로 캡슐화하고 콜백 값과 함께 반환해야합니다. (위의 샘플 코드를주의 깊게 읽으십시오).
3. JQuery의 $ .getJson 메소드를 호출 할 때 JQuery는 자체 처리를 가지고 있으며 실제로 스크립트의 SCR을 통해 요청됩니다. 그러나 데이터가 최종적으로 GET를 통해 URL을 통해 전송된다는 것을 알아야합니다. 이것은 전송 된 데이터의 양이 너무 많을 수 없다고 결정합니다. 그렇지 않으면 URL이 너무 오래 수신되지 않을 것입니다 (GetJSON 메소드가 제출 될 때 게시물로 제출할 수 없습니다).
도메인에서 큰 데이터를 보내려면 jQuery에서 제공하는 AJAX 메소드를 선택할 수 있으며 GetJson 메소드를 사용하지 않는 것이 가장 좋습니다.
4. 위의 예는 개발의 두 측면이 귀하의 통제하에 있다는 전제에 기초합니다. 또한 서버 프로그램의 보안 계수가 높지 않다는 점에주의하십시오 (데이터를 수신하는 데이터에 중요하고 민감한 논리 처리 장치를 배치하지 않는 것이 좋습니다).
상기 도메인 이름 획득 데이터를 달성하기 위해 JQuery와 결합 된 Java의 위의 방법은 내가 공유하는 모든 컨텐츠입니다. 나는 당신이 당신에게 참조를 줄 수 있기를 바랍니다. 그리고 당신이 wulin.com을 더 지원할 수 있기를 바랍니다.