IT Share you

XMLHttpRequest를 사용하여 JSON 파일을로드 할 때 Firefox에서 "잘 구성되지 않음"오류

shareyou 2020. 11. 11. 20:58
반응형

XMLHttpRequest를 사용하여 JSON 파일을로드 할 때 Firefox에서 "잘 구성되지 않음"오류


내 페이지의 JavaScript가 JavaScript Object Notation 형식의 개체를 포함하는 텍스트 파일을로드 할 때 Firefox 3.0.7의 오류 콘솔에 "잘 구성되지 않음"오류가 표시됩니다. 파일에 JSON 개체 만 포함되어 있으면 오류가 발생합니다. 개체를 <document> </ document> 태그로 래핑하면 오류가 발생하지 않습니다. 요청은 어느 쪽이든 성공하므로 무시할 수 있지만 오류 로그가 이러한 메시지로 채워지는 것을 원하지 않습니다.

다음은 문제를 설명하는 몇 가지 예제 코드입니다. 첫째, "data.json"이라는 "잘 구성되지 않은"파일 :

{ a: 3 }

이제 파일을로드하는 코드 :

var req = new XMLHttpRequest();
req.open("GET", "data.json");
req.send(null);

Firefox 오류 콘솔에서 다음 오류가 생성됩니다.

형식이 올바르지 않음
file : //path/to/data.json Line : 1
{a : 3}
-^

data.json이 다음과 같이 수정 된 경우 :

<document>{ a: 3 }</document>

오류가 없습니다. 나는 평범한 JSON 파일이 잘 구성된 XML 문서가 아니기 때문에 불평하고 있다고 생각했기 때문에 "send"호출 전에 MIME 유형을 재정 의하여 평문으로 강제로로드하도록 시도했지만 작동하지 않았습니다.

var req = new XMLHttpRequest();
req.open("GET", "data.json");
req.overrideMimeType("text/plain");
req.send(null);
// Still produces an error!

XMLHttpRequest가 수행하는 유효성 검사를 처리하기 위해 JSON 데이터를 XML 문서로 계속 래핑 할 것입니다. 그러나 일반 텍스트를 비판적으로로드하고 시도하지 않도록 강제 할 수있는 방법이 있는지 알고 싶습니다. 그것을 확인하십시오. 또는 일반 텍스트와 함께 사용할 수있는 XMLHttpRequest 외에 데이터를로드하는 다른 방법이 있습니까?


JSON에 MIME 유형을 사용해 보셨습니까?

application/json

.json 파일에 대해이 MIME 유형을 자동으로 보내도록 서버를 구성 할 수도 있습니다.


첫째, 진정한 JSON은 JavaScript보다 훨씬 엄격하며 유효한 JSON이 되려면 키를 인용해야합니다.

 { "a": 3 } 

또한 MIME 헤더가 엄격하게 달리 지정하지 않는 한 일반적으로 XML 결과를 수신 할 것으로 예상되는 베어 XMLHttpRequest를 사용하고 있습니다.

그러나 jQuery와 같은 자바 스크립트 프레임 워크를 사용하여이 모든 문제를 추상화하고 모든 까다로운 가장자리 사례를 처리함으로써 자신의 삶을 더 쉽게 만들고 싶을 수 있습니다.

$.getJSON("data.json",{}, function( data ){ 
  /*  # do stuff here  */ 
});

또한 엄격한 JSON을 모두 사용하고이를 추상화하기 위해 라이브러리를 사용하는 경우 브라우저가 네이티브 JSON 파서를 사용하기 시작하면 라이브러리에서 이러한 구문을 투명하게 사용하고 상당한 속도 향상을 얻을 수 있습니다.

(이는 조만간 진행될 예정이며,이 경우 사용자는 아무런 노력없이 자동 업그레이드를 받게됩니다!).


이는 Content-Type이 완전히 비어있는 경우에도 발생합니다 (따라서 자연스러운 유형 감지를 우회 함).


실제로는 { "a": 3}이어야합니다.


동일한 오류 메시지를 찾았지만 원인이 매우 다릅니다. 약간의 시간을 들여 JSON 콘텐츠를 무익하게 변경 한 후 실수로 서버 (http : // localhost /)가 아닌 로컬 파일 시스템 (file : //Users/me/Sites/mypage.html)에서 실행중인 페이지를 다시 시작했음을 깨달았습니다. ~ me / Sites / mypage.html).


또한 서버에서 XMLHttpRequest()표시된 리소스를 요청할 때 (FireFox에서) 와 동일한 경고 메시지 Content-Type: application/json받았습니다.

What did the trick for me was to explicitly set the XMLHttpRequest.responseType property to json on the request object. E.g,

var request = new XMLHttpRequest();
request.onreadystatechange = function() { ... }
...
request.open('GET','https://random-domain.com/random-path',true);
request.responseType = 'json';
...
request.send();

Browser --- request expects a given content-type ---> Server
        <-- response contains content-type ----------

Firefox looks at the HTTP Content-Type header. If the server HTTP response header does not match the expectations of your browser code it will complain with this message.

IMHO this error message could have been a lot better, like "Expecting response Content-Type header ... but found ...".


Kent, I disagree.

The following IS "valid" JSON:

{ a: 3 }

JavaScript object property names do NOT have to be strings.

The problem is one of MIME type, not JSON/JavaScript syntax.

I just solved this very issue by adding json as "text/javascript" to my webserver mime types file:

text/javascript                 js, json

The "not well-formed" error disappeared. The browser (FireFox) assumed, incorrectly, that the .json file was XML.

참고URL : https://stackoverflow.com/questions/677902/not-well-formed-error-in-firefox-when-loading-json-file-with-xmlhttprequest

반응형