window.onerror: свойство url пусто при ошибке в динамически добавляемом скрипте (через тег скрипта)

#javascript #events #dynamic #onerror

#javascript #Мероприятия #динамический #onerror

Вопрос:

Что я хочу иметь возможность сделать, так это узнать, произошла ли ошибка в динамически добавляемом скрипте. Это должно быть выполнено путем проверки url свойства параметра onerror события.

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

Поэтому я попытался повторно связать событие после добавления тега скрипта, например

 document.head.appendChild(scriptElement);
document.getElementById(scriptTagId).addEventListener('onerror',someErrorFunction);
  

а также

 scriptElement.setAttribute('onerror','someErrorFunction(event);');
document.head.appendChild(scriptElement);
  

а также, как

 document.head.appendChild(scriptElement);
window.addEventListener('onerror',someErrorFunction);
  

но безрезультатно. На самом деле, ошибка даже обнаруживается только при использовании первого подхода, то есть при привязке onerror события к началу скрипта.

Ответ №1:

Я думаю, у вас возникла проблема, поскольку вы получаете элемент сценария по идентификатору. Вы можете использовать простой загрузчик скриптов для достижения конечного результата. Основное отличие заключается в том, что оно привязывается к свойствам onerror и onload элемента script, а не к использованию event listenrs

Редактировать

У меня не возникает никаких проблем с использованием этого скрипта window.onerror и привязкой к onafterscriptexecute вместо onload , и использованием document.currentScript для получения тега скрипта, который выдал ошибку.

 window.onerror = function(message, source, lineno, colno, error){
  console.log('window.error', {
    message,
    source,
    lineno,
    colno,
    error,
    src: document.currentScript.src
  })
}

function loadScript(src, callback) {
  console.log('loading: '   src)
  const script = document.createElement('script')
  script.onerror = function() {
    console.log('error loading script: '   src)
  }
  script.onafterscriptexecute = callback
  script.src = src
  document.head.appendChild(script)
}

loadScript('http://codepen.io/synthet1c/pen/BLwWOb.js', function(){
  console.log('this aint gonna happen')
})

loadScript('https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js', function(){
  console.log('success loaded jQuery')
})  

Комментарии:

1. спасибо за ваш ответ. К сожалению, это работает только в том случае, если URL-адрес файла скрипта неверен; однако это не учитывает синтаксические ошибки в самом скрипте или исключения в целом.

2. что мне было нужно, так это document.currentScript . Не знал, что это существует, еще раз спасибо.