2014-10-13 3 views
-3

json 데이터가 포함 된 링크에서 데이터를 가져 오는 내 HTML 코드입니다. 그러나 그것은 작동하지 않습니다 그래서 아무도 왜 내게 말할 수 있습니까?JavaScript를 사용하여 URL에서 JSON 데이터 호출 및 표시

header("Access-Control-Allow-Origin: *"); 

이 너무 단순화 될 수있다, 그래서 이것 좀보세요 :

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.10.1.min.js"> 
</script> 
<script> 
$(document).ready(function(){ 
$("#btnjson").click(function(){ 
$.getJSON("http://waitrapp.co/bipin/practice.php",function(result){ 
$("#ID").append(result.ID); 
$("#Item_Name").append(result.Item_Name); 
$("#Item_Price").append(result.Item_Price); 
    }); 
}); 
}); 
</script> 
</head> 
<body> 

<button id="btnjson">Load!!!</button> 
<p id="ID">ID: </p> 
<p id="Item_Name">Item Name: </p> 
<p id="Item_Price">Item Price: </p> 
</body> 
</html> 
+4

의 배열을 작성해야합니다. 브라우저의 개발자 도구를 살펴보십시오. JavaScript 콘솔을보십시오. 오류를보고합니까? Net 탭을보십시오. 요청이 만들어진 것입니까? 응답이 있습니까? 데이터에 예상되는 데이터가 포함되어 있습니까? – Quentin

답변

1

http://waitrapp.co/bipin/practice.php의 HTTP 응답은 PHP 파일이 설정하면 작동한다, 적절한 CORS 헤더가 포함되어 있지 않습니다 SO 게시물 : 또한 https://stackoverflow.com/a/9866124/441907

Salec은 JSON이 유효하지 않습니다, 당신은 요소 사이에 괄호 [] 쉼표를 둘러싸는 누락 지적 :

[ 
    { 
     "ID": "10", 
     "Item_Name": "Pizza", 
     "Item_Price": "2.99", 
     "Date_Created": "2014-10-01 08:27:41" 
    }, 
    { 
     "ID": "11", 
     "Item_Name": "Burrito", 
     "Item_Price": "2.99", 
     "Date_Created": "2014-10-01 09:13:03" 
    }, 
    { 
     "ID": "12", 
     "Item_Name": "Burger", 
     "Item_Price": "4.99", 
     "Date_Created": "2014-10-06 19:56:01" 
    }, 
    { 
     "ID": "13", 
     "Item_Name": "Steak", 
     "Item_Price": "10.99", 
     "Date_Created": "2014-10-06 19:56:17" 
    } 
] 
+0

JSONP는 CORS 사양을 작성하기 전과 동일한 원본 정책을 수행하기위한 해킹입니다. 왜 해킹이 더 유연한 표준보다 선호되어야합니까? – Quentin

+0

@Quentin 레거시 브라우저가 지원 될 필요가없는 한 당신 말이 맞습니다. –

관련 문제