JavaScript consolate.log вызывает ошибку: «Синхронный XMLHttpRequest в основном потоке устарел...«

Это случилось со мной, когда я ленился и включил тег сценария как часть возвращаемого контента. Как таковой:

Частичное содержание HTML:

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

Похоже, по крайней мере, в моем случае, что если вы вернете HTML-контент через xhr, вы заставите jQuery сделать вызов, чтобы получить этот скрипт. Этот вызов происходит с фальшивым флагом async, поскольку предполагается, что для продолжения загрузки вам необходим скрипт.

В подобных ситуациях вам лучше обслуживать, изучая какую-то обязательную структуру и просто возвращая объект JSON, или в зависимости от вашего бэкэнда и шаблонов вы можете изменить способ загрузки своих сценариев.

Вы также можете использовать getScript ()] [jQuery (http://api.jquery.com/jQuery.getScript/) для захвата соответствующих сценариев. Вот скрипка, это просто прямая копия примера jQuery, но я не вижу никаких предупреждений, когда сценарии загружаются таким образом.

Пример

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

[Http://jsfiddle.net/49tkL0qd/][1]

Предупреждающее сообщение МОЖЕТ БЫТЬ связано с запросом XMLHttpRequest в главном потоке с флагом async, установленным в false.

https://xhr.spec.whatwg.org/#synchronous-flag:

Синхронный XMLHttpRequest вне работников находится в процессе быть удаленным с веб-платформы, поскольку это имеет пагубные последствия опыт конечного пользователя. (Это долгий процесс, который занимает много лет.) Разработчики не должны передавать false для аргумента async, когда Глобальная среда JavaScript - это среда документа. Пользовательские агенты Настоятельно рекомендуется предупредить о таком использовании в инструментах разработчика и может экспериментировать с выделением исключения InvalidAccessError, когда это происходит.

Будущее направление - разрешать только XMLHttpRequests в рабочих потоках. Сообщение предназначено для предупреждения об этом.

Я также столкнулся с той же проблемой, но смог ее исправить, поставив async: 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 - это ввод кода, который содержит устаревший вызов.

Иногда необходимо загрузить скрипт ajax, но отложить документ готов до тех пор, пока скрипт не загрузится.

jQuery поддерживает это с помощью функции holdReady ().

Пример использования:

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

Фактическая загрузка скрипта является асинхронной ( без ошибок ), но эффект является синхронным, если остальная часть вашего JavaScript работает после документа готов .

Эта расширенная функция обычно используется динамическим скриптом загрузчики, которые хотят загрузить дополнительный JavaScript, такие как плагины jQuery прежде чем разрешить готовое событие, даже если DOM может быть готов.

Документация:
https://api.jquery.com/jquery.holdready

ОБНОВЛЕНИЕ 7 января 2019 года

От JQMIGRATE:

jQuery.holdReady () устарела

Причина: Метод jQuery.holdReady ()` устарел из-за его вредного воздействия на глобальную производительность страницы. Этот метод может предотвратить инициализацию всего кода на странице в течение длительного времени.

Решение: Перепишите страницу так, чтобы не требовалось откладывать все готовые обработчики jQuery. Это может быть достигнуто, например, путем поздней загрузки только кода, который требует задержки при безопасной запуске. Из-за сложности этого метода jQuery Migrate не пытается заполнить функциональность. Если базовая версия jQuery, используемая с jQuery Migrate, больше не содержит jQuery.holdReady (), код выйдет из строя вскоре после появления этого предупреждения.

Чтобы избежать этого предупреждения, не используйте:

async: false

в любом из ваших звонков $ .ajax (). Это единственная функция XMLHttpRequest, которая устарела.

По умолчанию есть

async: true

https://stackoverflow.com/questions/27736186/jquery-has-depreated-synchronous-xmlhttprequest/27736383#27736383

Частичный ответ @Webgr действительно помог мне отладить это предупреждение @ console log, позор, что другая часть этого ответа принесла так много отрицательных голосов :(

Во всяком случае, вот как я узнал, что послужило причиной этого предупреждения в моем случае:

1. Используйте браузер Chrome > Нажмите F12, чтобы принести DevTools
2. Откройте меню ящика (в Chrome 3 вертикальные точки в правом верхнем углу)
3. Под Консоль > проверьте Log XMLHttpRequests опция
4. Перезагрузите свою страницу, которая давала вам ошибку, и посмотрите, что происходит с каждым запросом ajax в журнале консоли.

В моем случае другой плагин загружал 2 библиотеки .js после каждого вызова ajax, которые абсолютно не требовались и не были необходимы. Отключение мошеннического плагина удалило предупреждение из журнала. С этого момента вы можете попытаться решить проблему самостоятельно (например,. ограничить загрузку сценариев определенными страницами или событиями - это слишком специфично для ответа здесь) или свяжитесь с сторонним разработчиком плагинов, чтобы решить его.

Надеюсь, это кому-то поможет.

Я смотрел на ответы все впечатляет. Я думаю, что он должен предоставить код, который доставляет ему проблему. В приведенном ниже примере, если у вас есть скрипт для ссылки на jquery в page.php, вы получите это уведомление.

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

Я получаю такое предупреждение в следующем случае:

1. file1, который содержит < script type = "text / javascript" src = "/javascript / jquery-1.10.2.js" > < / script >. Страница имеет поля ввода. Я ввожу некоторое значение в поле ввода и нажимаю кнопку. Jquery отправляет ввод во внешний файл php.

2. внешний файл php также содержит jquery, и во внешнем файле php я также включил < 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 и работает без предупреждения.

Как я понимаю при загрузке первого файла (file1), я загружаю jquery-1.10.2.js и поскольку страница не перезагружается (она отправляет данные во внешний файл php с использованием jquery $. post), затем jquery -1.10.2.js продолжают существовать. Так что не нужно снова загружать его.

В приложении MVC я получил это предупреждение, потому что открывал окно Кендо с методом, который возвращал View () вместо PartialView (). View () пытался снова восстановить все сценарии страницы.

Это происходило со мной в ZF2. Я пытался загрузить модальный контент, но забыл отключить макет раньше.

Так:

$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"

и ошибка ушла.

И я получил это исключение для включения одного скрипта can.js в другой, например,.,

{{>anotherScript}}

Я получил это исключение, когда установил URL в запросе, например «example.com/files/text.txt». Я изменил URL на «http://example.com/files/text.txt», и это исключение исчезло.

Это решается в моем случае.

JS

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

Этот ответ был вставлен в эту ссылку

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

В моем случае это было вызвано сценарием flexie , который был частью приложения "CDNJS Selections", предлагаемого Cloudflare .

По данным Cloudflare, «это приложение устарело в марте 2015 года». Я выключил его, и сообщение мгновенно исчезло.

Вы можете получить доступ к приложениям, посетив https://www.cloudflare.com/a/cloudflare-apps/yourdomain.com

NB: это копия моего ответа в этой теме https://stackoverflow.com/questions/28322636/synchronous-xmlhttprequest-warning-and-script/30332136#30332136 (я посетил оба при поиске решения)

1. В Chrome нажмите F12
2. Разделительные инструменты- > нажмите F1.
3. См. Настройки - > general- > Aperance: "Не показывать предупреждение Chrome Data Saver " - установите этот флажок.
4. См. Настройки - > general- > Консоль: " Log XMLHTTPRequest " - установите этот флажок тоже.

Наслаждаться

Для меня, проблема была в том, что в запросе OK, Я ожидал, что ответ ajax будет хорошо отформатированной HTML-строкой, такой как таблица, но в этом случае, сервер испытывал проблемы с запросом, перенаправление на страницу ошибки, и поэтому возвращал HTML-код страницы ошибки (который имел `

Я исправил это с помощью следующих шагов:

1. Проверьте свои сценарии CDN и добавьте их локально.
2. Переместите ваши сценарии в раздел заголовка.

В моем конкретном случае я рендерил частичную рейль без lend mapplay: false, который перекачивал весь макет, включая все сценарии в теге < head >. Добавление render metage: false к действию контроллера устранило проблему.