JavaScript console.log로 인해 다음 오류가 발생합니다. "메인 스레드에서 동기식 XMLHttpRequest가 사용되지 않습니다.."

JavaScript console.log로 인해 다음 오류가 발생합니다. "메인 스레드에서 동기식 XMLHttpRequest가 사용되지 않습니다.."

파이어폭스 디버거를 사용하지 않고 다양한 변수의 상태를 확인하기 위해 콘솔에 로그를 추가하고 있습니다.

하지만, 제가 추가한 많은 장소에서.console.log내 안에서main.js 나는 나스러운 작은 으로 쓴 과 같은 : 파일, 나는나자게보사운러랑작다받습니대오류를같.

메인 스레드에서 동기식 XMLHttpRequest는 최종 사용자의 환경에 해로운 영향을 미치기 때문에 더 이상 사용되지 않습니다.더 많은 도움이 필요한 경우 http://xhr.spec.whatwg.org/

의 입니까?console.log이 오류를 발생시키지 않는 코드 사용에 추가할 수 있습니까?

제가 잘못하고 있나요?

이것은 제가 게을러서 반환되는 콘텐츠의 일부로 스크립트 태그를 포함시켰을 때 발생했습니다.다음과 같은 경우:

부분 HTML 콘텐츠:

<div> 
 SOME CONTENT HERE
</div>
<script src="/scripts/script.js"></script> 

적어도 제 경우에는 xhr을 통해 HTML 콘텐츠를 반환하면 jQuery가 해당 스크립트를 얻기 위해 전화를 걸 수 있습니다.이 호출은 스크립트를 계속 로드해야 한다고 가정하기 때문에 비동기 플래그 false와 함께 발생합니다.

이러한 상황에서는 바인딩 프레임워크를 조사하여 JSON 개체를 반환하거나 백엔드 및 템플릿에 따라 스크립트를 로드하는 방법을 변경하는 것이 좋습니다.

jQuery를 사용하여 관련 스크립트를 가져올 수도 있습니다.여기에 피들이 있습니다. jQuery 예제의 단순한 복사본이지만 스크립트가 그런 식으로 로드될 때 경고가 표시되지 않습니다.

예

<script>
var url = "/scripts/script.js";
$.getScript(url);
</script>

http://jsfiddle.net/49tkL0qd/

이 경고 메시지는 비동기 플래그가 false로 설정된 기본 스레드 내의 XMLHttpRequest 요청 때문일 수 있습니다.

https://xhr.spec.whatwg.org/ #continuous-interval:

작업자 외부의 동기식 XMLHttpRequest는 최종 사용자의 환경에 해로운 영향을 미치기 때문에 웹 플랫폼에서 제거되는 중입니다.(이 프로세스는 오랜 시간이 소요됩니다.)개발자는 JavaScript 글로벌 환경이 문서 환경인 경우 비동기 인수에 대해 false를 전달하지 않아야 합니다.사용자 에이전트는 개발자 도구에서 이러한 사용에 대해 경고할 것을 강력히 권장하며, 이 경우 InvalidAccessError 예외를 시도할 수 있습니다.

향후 방향은 작업자 스레드에서만 XMLHttpRequests를 허용하는 것입니다.이 메시지는 그러한 효과에 대한 경고입니다.

저도 같은 문제에 직면했지만 비동기: true를 적용하여 해결할 수 있었습니다.기본적으로 참이지만 명시적으로 작성하면 작동합니다.

$.ajax({
   async: true,   // this will solve the problem
   type: "POST",
   url: "/Page/Method",
   contentType: "application/json",
   data: JSON.stringify({ ParameterName: paramValue }),
});

Visual Studio 2015/2017의 라이브 디버거에서 사용되지 않는 호출이 포함된 코드를 주입하고 있습니다.

때때로 스크립트를 로드하지만 스크립트가 로드될 때까지 문서 준비를 지연시켜야 합니다.

는 jQuery와 이 합니다.holdReady()기능.

사용 예:

$.holdReady(true);                              //set hold
function releaseHold() { $.holdReady(false); }  //callback to release hold
$.getScript('script.js', releaseHold);          //load script then release hold

실제 스크립트 로드는 비동기적이지만(오류 없음), 문서 준비 후에 JavaScript의 나머지 부분이 실행되면 동기적으로 수행됩니다.

이 고급 기능은 일반적으로 DOM이 준비되어 있더라도 준비 이벤트가 발생하도록 허용하기 전에 jQuery 플러그인과 같은 추가 JavaScript를 로드하려는 동적 스크립트 로더에서 사용됩니다.

설명서:
https://api.jquery.com/jquery.://api.jquery.com/jquery.holdready

---

2019년 1월 7일 업데이트

JQMIGRATE에서:

jQuery.holdReady()는 더 이상 사용되지 않습니다.

원인: ThejQuery.holdReady()메소드가 페이지의 전역 성능에 해로운 영향을 미치기 때문에 더 이상 사용되지 않습니다.이 방법을 사용하면 페이지의 모든 코드가 장시간 초기화되지 않을 수 있습니다.

솔루션:모든 jQuery 준비 처리기를 지연시킬 필요가 없도록 페이지를 다시 작성합니다.예를 들어 실행이 안전할 때 지연이 필요한 코드만 늦게 로드하면 됩니다.이 방법은 복잡하기 때문에 jQuery Migrate는 기능을 채우지 않습니다.jQuery Migrate와 함께 사용되는 jQuery의 기본 버전이 더 이상 포함되지 않는 경우jQuery.holdReady()이 경고가 표시된 직후 코드가 실패합니다.

이 경고를 방지하려면 다음을 사용하지 마십시오.

async: false

당신의 $.480 통화 중 어떤 것이든.이 기능은 XMLHttpRequest에서 사용되지 않는 유일한 기능입니다.

기본값은

async: true

jQuery가 동기식 XMLHTTPRequest를 더 이상 사용하지 않습니다.

@Webgr 부분 답변은 실제로 이 경고 @ 콘솔 로그를 디버깅하는 데 도움이 되었습니다. 그 답변의 다른 부분이 너무 많은 다운 투표를 가져온 것이 부끄럽습니다. :(

어쨌든, 제 경우에 이 경고의 원인이 무엇인지 알게 된 방법은 다음과 같습니다.

1. 크롬 브라우저 사용 > F12를 눌러 DevTools 가져오기
2. 드로어 메뉴를 엽니다(오른쪽 상단의 Chrome 3 수직 점)
3. Console > 에서 Log XMLHttpRequests 옵션을 선택합니다.
4. 오류가 발생한 페이지를 다시 로드하고 콘솔 로그의 각 Ajax 요청에서 어떤 일이 발생하는지 확인합니다.

나의 경우, 다른 플러그인은 Ajax 호출 후에 절대 필요하지도 필요하지도 않은 2.js 라이브러리를 로드하고 있었습니다.로그 플러그인을 사용하지 않도록 설정하면 로그에서 경고가 제거됩니다.이때부터 직접 문제를 해결하거나(예: 스크립트 로드를 특정 페이지나 이벤트로 제한 - 여기서 답변하기에는 너무 구체적입니다) 타사 플러그인 개발자에게 문의하여 문제를 해결할 수 있습니다.

이것이 누군가에게 도움이 되기를 바랍니다.

저는 그 답들을 모두 인상적으로 보고 있습니다.나는 그가 그에게 문제를 주는 코드를 제공해야 한다고 생각합니다.아래 예를 들어, 페이지에 jquery에 연결할 스크립트가 있는 경우.php 그러면 당신은 그 통지를 받습니다.

$().ready(function () {
    $.ajax({url: "page.php",
        type: 'GET',
        success: function (result) {
        $("#page").html(result);
   }});
 });

다음과 같은 경우에 이러한 경고를 받습니다.

에는 다을포는하 file1이 되어 있습니다.<script type="text/javascript" src="/javascript/jquery-1.10.2.js"></script>페이지에 입력 필드가 있습니다.입력란에 값을 입력하고 버튼을 클릭합니다.Jquery는 외부 php 파일로 입력을 보냅니다.

가 포함되어 , 에도 php php php php php php 가부포 jquery 다함니가 포함되어 있습니다.<script type="text/javascript" src="/javascript/jquery-1.10.2.js"></script>만약 이것이 내가 경고를 받았기 때문입니다.

<script type="text/javascript" src="/javascript/jquery-1.10.2.js"></script>외부 php 파일에서 경고 없이 작동합니다.

번째 파일을 로드하는 와 같이, 는 파일을 로드합니다.jquery-1.10.2.js그리고 페이지가 다시 로드되지 않기 때문에 (jquery를 사용하여 외부 php 파일로 데이터를 보냅니다.$.post), 그러면jquery-1.10.2.js계속 존재합니다.다시 로드할 필요가 없습니다.

이것은 제 경우에 해결됩니다.

제이에스

$.ajaxPrefilter(function( options, original_Options, jqXHR ) {
    options.async = true;
});

이 답변은 이 링크에 삽입되었습니다.

https://stackoverflow.com/questions/28322636/synchronous-xmlhttprequest-warning-and-script

"example.com/files/text.txt "과 같은 쿼리에서 url을 설정했을 때 이 예외가 발생했습니다.URL을 "http://example.com/files/text.txt "로 변경했는데 이 예외 사항이 사라졌습니다.

그리고 하나의 can.js 스크립트를 다른 스크립트에 포함하는 것으로 인해 이 예외를 얻었습니다. 예를 들어,

{{>anotherScript}}

MVC 애플리케이션에서 부분 보기()가 아닌 보기()를 반환하는 메서드로 검도 창을 열고 있었기 때문에 이 경고가 발생했습니다.보기()가 페이지의 모든 스크립트를 다시 검색하려고 합니다.

그것은 ZF2에서 저에게 일어나고 있었습니다.Modal 컨텐츠를 로드하려고 했지만 이전에 레이아웃을 비활성화하는 것을 잊었습니다.

그래서:

$viewModel = new ViewModel();
$viewModel->setTerminal(true);
return $viewModel;

@Nycen과 마찬가지로 Cloudfare 링크 때문에 이 오류가 발생했습니다.제 것은 Select2 플러그인을 위한 것이었습니다.

고치기 위해 제가 방금 제거했습니다.

 src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"

그리고 오류는 사라졌습니다.

1. Chrome에서,press F12
2. 개발도구-> 프레스F1.
3. 설정->일반->외관:"Don't show chrome Data Saver warning"이 확인란을 설정합니다.
4. 설정->일반->콘솔:"Log XMLHTTPRequest"이 확인란도 설정합니다.

즐거운 시간 되세요.

저의 경우 이는 Cloudflare에서 제공하는 "CDNJS Selections" 앱의 일부인 Flexie 스크립트로 인해 발생했습니다.

Cloudflare에 따르면 "이 앱은 2015년 3월에 더 이상 사용되지 않습니다."제가 전원을 끄자 메시지가 바로 사라졌습니다.

https://www.cloudflare.com/a/cloudflare-apps/yourdomain.com 를 방문하면 앱에 액세스할 수 있습니다.

NB: 이 스레드에 대한 제 답변의 복사본입니다. 동기식 XMLHttpRequest warning 및 <script> (해결책을 찾을 때 두 가지 모두 방문했습니다.)

아래 단계를 통해 이 문제를 참조하십시오.

1. CDN 스크립트를 확인하고 로컬로 추가합니다.
2. 스크립트 포함 항목을 머리글 섹션으로 이동합니다.

저의 경우, 저는 Rails 부분을 다음과 같이 렌더링했습니다.render layout: false모든 스크립트를 포함하여 전체 레이아웃을 다시 표시했습니다.<head>태그. 추가render layout: false컨트롤러에 대한 조치로 문제가 해결되었습니다.

저에게 문제는 OK 요청에서 Ajax 응답이 테이블과 같은 잘 포맷된 HTML 문자열일 것으로 예상했지만, 이 경우 서버가 요청에 문제가 발생하여 오류 페이지로 리디렉션되어 오류 페이지의 HTML 코드를 반환하고 있었습니다.<script어딘가에 꼬리표를 달다저는 콘솔에서 Ajax 응답을 기록했고, 그 때 예상했던 것과 다르다는 것을 깨닫고 디버깅을 계속했습니다.

2014년에 제기된 문제이고 2019년이니 더 좋은 선택지를 찾아보는 것이 좋을 것 같습니다.

간단히 사용할 수 있습니다.fetchJavascript의 api를 사용하여 보다 유연성을 제공합니다.

예를 들어, 이 코드를 참조하십시오.

fetch('./api/some.json')
    .then((response) => {
        response.json().then((data) => { 
            ... 
        });
    })
    .catch((err) => { ... });

나는 이러한 문제들이 javascript가 끝나기 전에 초기 리다이렉트 페이지, 나의 경우 firebasedb set 함수를 유발한다는 것을 발견했습니다.

언급URL : https://stackoverflow.com/questions/24639335/javascript-console-log-causes-error-synchronous-xmlhttprequest-on-the-main-thr