Jekyll не загружает Javascript для изображения - PullRequest
0 голосов
/ 19 сентября 2018

Этот - мой пример сайта, опубликованного на GitHub с использованием страниц GitHub с использованием Jekyll.Карта, которую вы видите на сайте, должна быть интерактивной для всех состояний, как показано в этой скрипке , которая показывает, как карта должна работать.

Основной файл Javascript, используемый здесь: jquery.imagemapster.js HEAD моего кода:

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.imagemapster.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
...

</head>

Или вы можете просто увидеть мой код , присутствующий в хранилище используется для публикации сайта.

Что я пробовал:

  1. Помещение всех изображений и сценария в папку с именем asset, иссылки на ресурсы.Это не сработало вообще.Изображение не было отображено.
  2. Размещение ресурсов в корневой папке.Это то, что я сделал.Изображения отображаются правильно, но скрипт все еще не работает.
  3. Чтобы проверить связь, я скопировал 4k строк кода в пару тегов <script> внутри головы.Это не сработало.

В конце концов, местное здание сайта, использующее Jekyll, работает отлично.Что я тут не так делаю?

1 Ответ

0 голосов
/ 19 сентября 2018

jquery.imagemapster.js загружается нормально, проблема в том, как вы загружаете библиотеки:

Смешанное содержимое: страница в 'https://mooncrater31.github.io/infer/#' была загружена через HTTPS, но запросил небезопасный скрипт 'http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'. Этот запрос был заблокирован;контент должен обслуживаться по протоколу HTTPS.

Это не позволяет вашему сайту использовать JQuery в современных и популярных браузерах (он же: Chrome), поэтому локально работает нормально, без https.

Чтобы решить эту проблему, просто загрузите их с HTTPS:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.imagemapster.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
...