외부 json 파일을 읽고 쓰는 방법은 무엇입니까?

누구나 네이티브 javascript를 사용하여 외부 JSON 파일을 읽고 쓰는 방법을 알고 있습니까?외부 json 파일을 읽고 쓰는 방법은 무엇입니까?

우리는 2D 드래그 앤 드롭 기능을 사용하여 레이아웃을 만들 수있는 일종의 웹 응용 프로그램을 만들고 있습니다. 자, 내가 가진 주요 관심사는 외부 JSON 파일에 HTML 요소 참조를 삽입해야한다는 것입니다. 내 레이아웃을 만드는 데 성공했지만 모두 내 페이지를 새로 고치면 웹 응용 프로그램에서 백엔드를 사용하지 않아 자연스럽게 내 디자인이 사라집니다. 우리는 이것을 달성하기 위해 외부 JSON 파일을 사용해야한다고 들었다.

모든 html 요소를 JSON 파일에 저장해야한다는 것을 알고 있으며 그 참조를 만드는 것은 거의 문제가되지 않습니다. 하지만 외부 JSON 파일을 읽고 쓰는 일은 저를 괴롭게합니다. 네이티브 JS를 사용하는 방식이 훌륭하다면 다른 언어 나 위 첨자를 사용하지 말라고했습니다.

출처

2017-01-13 Merigold

JSON 객체를 구문 분석하고 디코딩 할 수 있지만 보안상의 이유로 JavaScript로 외부 파일에 쓰는 방법이 있다고 생각하지 않습니다. – Crowes

JavaScript를 통해 외부 파일에 기록 할 수 없습니다. HTML5는 localStorage을 가져 오며, string 및 integer을 수용 할 수있는 저장소입니다. 우리는 JSON을 JavaScript 객체에서 직렬화 할 수 있고 JavaScript 객체를 JSON 문자열에서 직렬화 할 수 있다는 것을 알고 있습니다.

var obj = {"audi": "r8", "color": "black"}; 

localStorage.setItem('myStorage', JSON.stringify(obj));

을 그리고이 목적을 위해 객체 나중에

var obj = JSON.parse(localStorage.getItem('myStorage'));

출처

2017-01-13 11:59:48 Svekke

실제로 외부 파일 *이 아닙니다. 그래도 되겠습니까? – Jamiec

그는 그가 백엔드없이 또는 자바 스크립트 만 사용해야 할 필요가 있다면 약간의 대안이라고 생각합니다. – Crowes

fs.writeFile ('myjsonfile.json', json, 'utf8', callback)을 사용할 수 있습니다. ? – Svekke

를 사용하여 자바 스크립트 FileReader를 검색 :

따라서, 당신은 당신이 가서 직렬화와 localStorage에서 데이터를 저장할 수 있습니다. 다음은 로컬 파일을 읽고 UI에 내용을 표시하는 샘플 코드입니다.

<html> 
 
    <body> 
 

 
     <input type="file" id="fileinput" /> 
 
     <div id="ReadResult"></div> 
 
     <script type="text/javascript"> 
 
      function readSingleFile(evt) { 
 
       //Retrieve the first (and only!) File from the FileList object 
 
       var f = evt.target.files[0]; 
 

 
       if (f) { 
 
        var r = new FileReader(); 
 
        r.onload = function (e) { 
 
         var contents = e.target.result; 
 
         document.getElementById("ReadResult").innerHTML = contents; 
 
        } 
 
        r.readAsText(f); 
 
       } else { 
 
        alert("Failed to load file"); 
 
       } 
 
      } 
 

 
      document.getElementById('fileinput').addEventListener('change', readSingleFile, false); 
 

 
     </script> 
 
    </body> 
 

 
</html>

자세한 내용은 봐 here.

출처

2017-01-13 12:07:26 Nitheesh

글쓰기는 어떻습니까? – Merigold

나는 그가 JSON 사용자를 직렬화하기를 원한다고 언급 한 것을 기억하지 않는다. 그리고 파일 판독기 API는 ** 파일 **을 읽지 만 편집하지는 않습니다. – Crowes

외부 json 파일을 읽고 쓰는 방법은 무엇입니까?

답변

관련 문제