집 >웹 프론트엔드 >JS 튜토리얼 >$.ajax 또는 $.getJSON을 사용하여 JSON 데이터의 도메인 간 획득을 달성하기 위한 jQuery 코드 정보

$.ajax 또는 $.getJSON을 사용하여 JSON 데이터의 도메인 간 획득을 달성하기 위한 jQuery 코드 정보

小云云원래의: 2018-02-02 13:39:271779검색

JSON 데이터는 JQuery를 통해 도메인 간에 얻을 수 있지만 JQuery는 도메인 간에 어떤 JSON 형식의 데이터도 얻을 수 없다는 점을 이해해야 합니다. JQuery에서 도메인 간 읽기를 위한 특정 JSON 데이터는 서버를 통해 출력되어야 합니다. 아직 이 부분에 대해 잘 모르실 수도 있지만, 괜찮습니다. 이 글에서는 누구나 쉽게 이해하고 실제로 적용할 수 있도록 이 기술을 소개하겠습니다.

이 글은 도메인 전반에 걸쳐 JSON 데이터를 얻기 위해 $.ajax나 $.getJSON을 사용하는 JQuery 구현 코드를 주로 소개합니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.

JQuery는 동일한 도메인에서 JSON 데이터를 얻습니다

먼저 jQuery 라이브러리 파일을 인용합니다:

e4fa1d4d1bcb7027db051d941ffe4ac12cacc6d41bbb37262a98f745aa00fbf0

j쿼리 코드:

var url="http://localhost:8000/user.php";
$(function(){
 $.getJSON(url,function(data){
 alert (data.name);
})
});

서버 코드(PHP):

<?php 
header(&#39;Content-Type:text/html;Charset=utf-8&#39;); 
$arr = array( 
 "name" => "xiaoming", 
 "pass" => "123456"
); 
echo json_encode($arr); 
?>

서버 반환 문자열:

{"name":"xiaoming"," pass ":123456}

JQuery를 사용하여 도메인 간 JSON 데이터를 얻습니다

먼저 jQuery 라이브러리 파일을 인용합니다:

575b0380e2df46168653a38ce049bce7

jQuery19003894091040769696_1505708469340({"name":"xiaoming","pass":123456})

설명하자면, jQuery에서 전달하는 값은 매번 다릅니다.

JQuery가 동일한 도메인과 크로스 도메인에서 JSON 데이터를 얻는 경우의 차이점 "jsoncallback=?" 매개변수를 추가해야 합니다.

2) 도메인을 교차할 때 서버에서 반환되는 문자열을 쓰는 방법이 다릅니다. , "'jsoncallback'"의 수신 값을 사용해야 합니다. 생성된 문자열 형식은 jsoncallback 수신 값(원본 JSON 문자열)입니다. 원본 JSON 문자열을 괄호로 묶어야 합니다.

요약

이 기사의 소개를 통해 jQuery가 도메인 전체에서 JSON 데이터를 읽도록 하려면 먼저 서버 측에서 특수 JSON 문자열을 구성해야 하며 그렇지 않으면 읽혀지지 않는다는 점을 모두가 이해해야 합니다. 구성 방법은 매우 간단합니다. 본문에 나오는 예시를 보면 한눈에 이해할 수 있습니다.

jQuery + Ajax를 사용하여 도메인 간 JSON 데이터 가져오기

이전 예제에서는 $.getJSON을 사용하여 도메인 간 JSON 데이터를 가져왔습니다. 실제로 $.ajax 메서드를 사용할 수도 있습니다. 먼저 jQuery 라이브러리 파일을 인용해 보세요:

d182920226eca7d954e1ec536e9710db2cacc6d41bbb37262a98f745aa00fbf0

jQuery 코드:

var url="http://localhost:8000/user.php?jsoncallback=?";
$(function(){
 $.getJSON(url,function(data){
 alert (data.name);
})
});

dataType은 json 대신 jsonp라는 점에 유의하세요.

$.ajax 또는 $.getJSON을 사용하여 JSON 데이터의 도메인 간 획득을 달성하기 위한 jQuery 코드 정보

관련 기사