Как HTML загружает внешние файлы JS

Question

Я новичок в веб-разработке, и недавно я наткнулся на код, который включает два внешних файла JS следующим образом:

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>

Я знаю, что браузер будет выполнять дополнительные HTTP-запросы для получения ссылочных файлов. Теперь вот что меня удивляет:

Когда я помещаю содержащий HTML-файл в папку XAMPP htdocs и получаю к нему доступ через localhost, все работает нормально. Однако, когда я просто открываю локальный.html-файл в Chrome или Firefox, он не сможет найти эти внешние сценарии JavaScripts.

Очевидно, что это не проблема, поскольку вы обычно не используете HTML-файл таким образом, но я все еще задаюсь вопросом, что здесь происходит. Нужен ли какой-нибудь сервер для включения внешних файлов JS? Интересно, что это работает, когда я включаю такие файлы:

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

Было бы очень интересно узнать почему =)

Ура!

Answer 1

У localhost есть протокол http://, если вы скопируете свой URL-адрес localhost и вставите его в любой редактор, вы можете просто увидеть http:// с помощью URL-адреса вашего локального хоста, но когда вы напрямую открываете файл с помощью file: // его нет, поэтому Ваши файлы были загружены при доступе через локальный хост XAMPP.

Answer 2

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script> использует относительный URL, он будет использовать схему протокола с отображаемой страницы, но в отношении хоста в URL. На странице HTTPS это будет запрос HTTPS, на странице HTTP это будет запрос HTTP.

Другими словами, он будет искать правильный протокол - HTTP или HTTPS - используемый запрашиваемой страницей и использовать его.

Вот хорошее прочтение на эту тему: http://nedbatchelder.com/blog/200710/httphttps_transitions_and_relative_urls.html