HTML/자바 스크립트 : src 태그가 설정된 스크립트 태그에로드 된 JSON 데이터에 액세스하는 방법

서버에서 생성하는이 JSON 파일을 페이지에서 볼 수 있으므로 클라이언트에서 액세스 가능하게 만들고 싶습니다. 기본적으로 내가 무엇을 달성하고자하는 것은 : 나는 다음과 같은 한HTML/자바 스크립트 : src 태그가 설정된 스크립트 태그에로드 된 JSON 데이터에 액세스하는 방법

: 내 HTML 문서에서 선언

<script id="test" type="application/json" src="http:/myresources/stuf.json">

태그입니다. 원본에서 참조 된 파일에 json 데이터가 있습니다. 필자가 보았 듯이 스크립트와 마찬가지로 데이터가 다운로드되었습니다.

이제 어떻게 자바 스크립트로 액세스합니까? jsonery를 사용하거나 사용하지 않고 스크립트 태그에 액세스하려고 시도했지만 json 데이터를 얻으려고 여러 가지 방법을 사용했지만 어떻게 든 작동하지 않습니다. json 데이터가 스크립트에서 인라인으로 작성되면 innerHTML을 얻는 것이 효과적이었습니다. 그것은 아니었고 내가 성취하려고하는 것이 아닙니다.

페이지를로드 한 후 원격 JSON 요청을 제안하는 경우 옵션이 제공되지 않습니다.

출처

2012-11-22 ChuckE

json 파일 대신 개체를 변수에 할당하는 javascript 파일로 지정하십시오. 다른 방법은 ajax를 사용하는 것입니다. –

첫 번째 제안은 현재 구현입니다. 나는 구조를 전달하는 행동을 사용하고 있기 때문에 그것을하지 않으려합니다. 구조체에 구조체를 사용하는 것을 선호합니다 (JSON을 원한다면 JSON을 얻습니다). 두 번째 제안은 필요하지 않습니다 (초기화 프로세스에이 데이터가 필요함). – ChuckE

@ChuckE를 통해 '

다른 도메인에서 JSON을로드해야하는 경우 : http://en.wikipedia.org/wiki/JSONP
그러나 잠재적 XSSI 공격에주의해야합니다 https://www.scip.ch/en/?labs.20160414

을 그렇게 단지 Ajax를 사용하는 것과 동일한 도메인이 있다면.

출처

2014-01-24 18:07:17

JSON 형식의 결과에는 JSONP가 작동하지 않습니다. 또한 스크립트에 인수로 전달 된 JSONP 매개 변수는 액세스 할 수없는 서버 ...에 의해 정의됩니다. 텍스트 콘텐츠의 경우 –

또 다른 해결책은 서버 측 스크립팅 언어를 사용하고 json 데이터 인라인을 포함시키는 것입니다.여기에 PHP를 사용하는 예는 다음과 같습니다

<script id="data" type="application/json"><?php include('stuff.json'); ?></script> 
<script> 
var jsonData = JSON.parse(document.getElementById('data').textContent) 
</script>

위의 예는 유형 application/json에 추가 스크립트 태그를 사용합니다. 더 간단한 해법은 자바 스크립트에 직접 JSON을 포함한다 :

<script>var jsonData = <?php include('stuff.json');?>;</script>

추가 태그 솔루션의 이점은 자바 스크립트 코드 및 JSON 데이터가 서로 분리되어 유지된다는 점이다.

출처

2015-07-14 12:19:50 terabaud

+입니다. .html이 스크립트 태그 –

이것이 불가능하거나 적어도 지원되지 않는 것처럼 보입니다. HTML5 specification에서

는 :

데이터 블록을 (스크립트 반대), 데이터가 인라인 포함되어야합니다 포함하는 데 사용

, 데이터의 형식은 type 속성을 사용하여 지정해야합니다 , src 속성은으로 지정하면 안되며 script 요소의 내용은 사용 된 형식에 대해 정의 된 요구 사항을 준수해야합니다.

출처

2016-07-20 15:49:16 btx9000

확인이 답변 : https://stackoverflow.com/a/7346598/1764509

$.getJSON("test.json", function(json) { 
    console.log(json); // this will show the info it in firebug console 
});

출처

2017-01-27 11:30:09

$ .getJSON()은 ajax 호출입니다. –

콘솔 대신 링크 된 HTML 파일에 정보를 표시하려면 어떻게해야합니까? –

또 다른 대안은 자바 스크립트 내에서 정확한 JSON을 사용합니다. Javascript Object Notation이기 때문에 json 표기법을 사용하여 객체를 직접 만들 수 있습니다. 이것을 .js 파일에 저장하면 응용 프로그램에서 객체를 사용할 수 있습니다. 이 옵션은 내 앱의 나머지 부분과 별도로 파일에 캐시하고 싶은 일부 정적 json 데이터가있을 때 유용했습니다.

//Just hard code json directly within JS 
    //here I create an object CLC that represents the json! 
    $scope.CLC = { 
     "ContentLayouts": [ 
      { 
       "ContentLayoutID": 1, 
       "ContentLayoutTitle": "Right", 
       "ContentLayoutImageUrl": "/Wasabi/Common/gfx/layout/right.png", 
       "ContentLayoutIndex": 0, 
       "IsDefault": true 
      }, 
      { 
       "ContentLayoutID": 2, 
       "ContentLayoutTitle": "Bottom", 
       "ContentLayoutImageUrl": "/Wasabi/Common/gfx/layout/bottom.png", 
       "ContentLayoutIndex": 1, 
       "IsDefault": false 
      }, 
      { 
       "ContentLayoutID": 3, 
       "ContentLayoutTitle": "Top", 
       "ContentLayoutImageUrl": "/Wasabi/Common/gfx/layout/top.png", 
       "ContentLayoutIndex": 2, 
       "IsDefault": false 
      } 
     ] 
    };

출처

2018-01-21 23:04:09 DominicTurner

HTML/자바 스크립트 : src 태그가 설정된 스크립트 태그에로드 된 JSON 데이터에 액세스하는 방법

관련 문제