Как загрузить локальные статические файлы, если CDN дает сбой без использования document.write ()? - PullRequest
Новая
       16

Как загрузить локальные статические файлы, если CDN дает сбой без использования document.write ()?

2 голосов
/ 03 июля 2019

Что я пытаюсь выполнить

Я буду размещать веб-приложение в локальной сети максимум для 50 человек.Никто из локальной сети не будет обращаться к веб-серверу.Прямо сейчас у меня есть веб-приложение, использующее CDN для доставки Bootstrap и jQuery, помимо прочего.Я бы хотел, чтобы веб-приложение использовало резервные копии локальных статических копий файлов CDN на случай, если что-то пойдет не так.


Мой вопрос

  1. Если мой веб-сервер используется только пользователями в локальной сети, какой метод лучше: CDN или локальные файлы?
  2. Как сделать откат на локальные файлы без , используя document.write()?

ПРИМЕЧАНИЕ. Я не пытаюсь выполнить это только для jQuery.Я хотел бы сделать это для нескольких файлов.


Связанные вопросы SO

Я посмотрел на десятки других вопросов, которые отвечают на мои вопросы.пытаюсь сделать, самые популярные перечислены ниже.
  1. Лучший способ использовать размещенный в Google jQuery, но прибегнуть к моей размещенной в Google библиотеке не удалось
  2. Как загрузить локальные файлы сценариев в качестве запасного варианта в случаях, когда CDN заблокирован / недоступен?
  3. Доступен ли Google CDN для jQuery в Китае?


То, что я попытался

Я реализовал следующий код из вопроса (1) 
<!--<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>-->
 <script>
     console.log(window.jQuery) // ==> undefined
     window.jQuery || document.write('<script type="text/javascript" src="{% static "js/jquery-3.4.1.min.js" %}"><\/script>');
     console.log(window.jQuery) // ==> undefined
 </script>

, но это решение:

  1. не удается загрузить документ
  2. заставляет Google Chrome DevTools указать следующее 
[Violation] Avoid using document.write(). https://developers.google.com/web/updates/2016/08/removing-document-write
[Violation] Parser was blocked due to document.write(<script>)

Это привело меня к такому вопросу под названием Скрипт с блокировкой синтаксического анализатора, исходный код, вызывается через document.write - как его обойти? .Затем я попытался реализовать принятое решение и добавил async к своему коду следующим образом: 

<script>
   console.log(window.jQuery) // ==> undefined
   window.jQuery || document.write('<script type="text/javascript" src="{% static "js/jquery-3.4.1.min.js" %}" async><\/script>');
   console.log(window.jQuery) // ==> undefined
</script>

, но все равно не удается загрузить документ, и я снова получаю следующую ошибку: 

[Violation] Avoid using document.write(). https://developers.google.com/web/updates/2016/08/removing-document-write.


В заключение

Итак, как правильно это сделать?Как мне сделать это без использования document.write ()?Похоже, что ответы на предыдущие вопросы устарели.

Ответы [ 2 ]

3 голосов
/ 03 июля 2019

Вам следует прослушать событие onerror , если оно произошло, загрузить локальное.Вот пример (вы должны изменить код для соответствия вашему случаю): 

<script>
    function onJqueryLoadError()
    {
        document.write('<scr' + 'ipt src="static/jquery-3.4.1.min.js"></scr' + 'ipt>');
    }
</script>
<script src="https://www.cdn/jquery-3.4.1.min.js" onerror="onJqueryLoadError()"></script>
0 голосов
/ 03 июля 2019
  1. Для 50 пользователей в локальной сети использование CDN (IMHO) является излишним. (Любой «игрушечный» веб-сервер должен подойти).
  2. Любое решение, вероятно, будет "хакерским" и в некоторой степени небезопасным: пытались ли вы извлечь страницу с помощью http-запроса (например, XMLHttpRequest), а затем вызвать eval ()?

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval

eval, вероятно, не правильный выбор (почти никогда).

Может быть, один из этих вариантов будет работать для вас лучше: Как загрузить код JavaScript в HTML-файл во время выполнения?

...