Статьи

jQuery Вставка скрипта на защищенные / зашифрованные страницы

Ноябрь 30, 2018

Мы столкнулись с этой трудоемкой проблемой и решили поделиться ею с людьми, которые сталкиваются с такой же ситуацией. Извините за длину этого поста, но это было чертовски трудно исправить!

Проблема: динамическая вставка скрипта в тег заголовка DOM при загрузке страницы с использованием JavaScript / jQuery. В этом примере мы видим, как мы пытаемся получить скрипт openX для загрузки на страницу.

Мы столкнулись с проблемами с:

  • IE8 вызывает сообщения об ошибках из-за зашифрованной страницы / веб-сайта. Чтобы исправить это, мы можем выполнить проверку зашифрованной страницы и загрузить скрипт OpenX только для страниц, которые не зашифрованы.
  • Загрузка второго сценария, который ссылается на переменные, созданные первым сценарием, приводящие к неопределенным сообщениям об ошибках. Чтобы исправить это, мы просто добавили оператор if, чтобы проверить существование переменной перед ее использованием.
  • document.write, вызывающий обновление страницы — для исправления не используйте document.write после загрузки страницы. 
(function() { if (window.location.protocol !== 'https') { var openx = document.createElement('script'); openx.type = 'text/javascript'; openx.async = true; openx.src = ' '; //Insert into head var theHead = document.getElementsByTagName('head')[0]; theHead.appendChild(openx); console.log('script inserted into head'); } })();  (function() { if (window.location.protocol !== 'https') { var openx = document.createElement('script'); openx.type = 'text/javascript'; openx.async = true; openx.src = ' '; //Insert into head var theHead = document.getElementsByTagName('head')[0]; theHead.appendChild(openx); console.log('script inserted into head'); } })();

И если вы хотите включить многострочный js-скрипт в заголовок (т.е. не просто файл .js), вы можете сделать это следующим образом. 

 (function() { if (window.location.protocol !== 'https:') { /*Create dynamic scripts*/ var openX = document.createElement('script'); openX.type = 'text/javascript'; openX.defer = 'defer'; /*defer is only supported by IE*/ openX.async = true; /*async is a html5 proposal*/ openX.src = ' '; var multiOpenX = document.createElement('script'); multiOpenX.type = 'text/javascript'; multiOpenX.defer = 'defer'; multiOpenX.async = true; multiOpenX.innerHTML = ['var OX_4ddf11d681ca9 = OX();', 'OX_4ddf11d681ca9.addPage("2400");', 'OX_4ddf11d681ca9.fetchAds();' ].join('n'); /*Insert into head tag*/ var theHead = document.getElementsByTagName('head')[0]; theHead.appendChild(openX); theHead.appendChild(multiOpenX); } })();   (function() { if (window.location.protocol !== 'https:') { /*Create dynamic scripts*/ var openX = document.createElement('script'); openX.type = 'text/javascript'; openX.defer = 'defer'; /*defer is only supported by IE*/ openX.async = true; /*async is a html5 proposal*/ openX.src = ' '; var multiOpenX = document.createElement('script'); multiOpenX.type = 'text/javascript'; multiOpenX.defer = 'defer'; multiOpenX.async = true; multiOpenX.innerHTML = ['var OX_4ddf11d681ca9 = OX();', 'OX_4ddf11d681ca9.addPage("2400");', 'OX_4ddf11d681ca9.fetchAds();' ].join('n'); /*Insert into head tag*/ var theHead = document.getElementsByTagName('head')[0]; theHead.appendChild(openX); theHead.appendChild(multiOpenX); } })();

IE8, похоже, выдает ошибки при использовании тега innerHTML в разделе head. Я не вижу решения этой проблемы, кроме как из альтернативного подхода, который не использует innerHTML. Мы можем вернуться к jQuery.getScript () и затем передать параметры второго скрипта, как только первый загрузится, так: 

 $.getScript('ajax/test.js', function() { alert('Load was performed.'); });

Или даже поместить его в функцию и вызвать его из тела следующим образом: 

  Вы также можете написать многострочный скрипт таким образом (предупреждение: некоторые браузеры будут вставлять новые строки при продолжении, а некоторые нет). 
 var multiOpenX = ' '; var multiOpenX = ' '; 


  Финальный сценарий 


  Последний скрипт, который работал во ВСЕХ браузерах, включая IE8: 


  
  
  
 


  Также проверьте здесь для ссылки на различные проверки в URL: http://www.jquery4u.com/javascript/javascript-location-hostnames-url-examples/

35
Share: