Возможно ли заменить http://на//в <script src= "http://..." >?

У меня есть следующий элемент:

<script type="text/javascript" src="https://cdn.example.com/js_file.js"></script>

В этом случае сайт HTTPS, но сайт также может быть просто HTTP. (JS файл находится в другом домене.) Мне интересно, справедливо ли сделать следующее для удобства:

<script type="text/javascript" src="//cdn.example.com/js_file.js"></script>

Мне интересно, правильно ли удалить http: или https:?

Кажется, что я работаю везде, где я тестировал, но есть ли случаи, когда он не работает?

Ответ 1

Относительный URL без схемы (http: или https:) действителен, за RFC 3986: "Унифицированный идентификатор ресурса (URI): общий синтаксис" , Раздел 4.2. Если клиент задыхается, то это ошибка клиента, потому что они не соответствуют синтаксису URI, указанному в RFC.

Ваш пример действителен и должен работать. Я сам использовал этот метод относительного URL-адреса на сильно пострадавших сайтах и имел нулевые жалобы. Кроме того, мы тестируем наши сайты в Firefox, Safari, IE6, IE7 и Opera. Эти браузеры все понимают, что формат URL.

Ответ 2

Гарантируется, что он будет работать в любом браузере (я не принимаю во внимание браузеры с долей менее чем на 0,05%). Heck, он работает в Internet Explorer 3.0.

RFC 3986 определяет URI, состоящий из следующих частей:

     foo://example.com:8042/over/there?name=ferret#nose
     \_/   \______________/\_________/ \_________/ \__/
      |           |            |            |        |
   scheme     authority       path        query   fragment

При определении относительных URI (Раздел 5.2) вы можете опустить любой из этих разделов, всегда начиная слева. В псевдокоде это выглядит так:

 result = ""

  if defined(scheme) then
     append scheme to result;
     append ":" to result;
  endif;

  if defined(authority) then
     append "//" to result;
     append authority to result;
  endif;

  append path to result;

  if defined(query) then
     append "?" to result;
     append query to result;
  endif;

  if defined(fragment) then
     append "#" to result;
     append fragment to result;
  endif;

  return result;

URI, который вы описываете, является относительным URI без схемы.

Ответ 3

Есть ли случаи, когда он не работает?

Если родительская страница была загружена из file://, то она, вероятно, не работает (она попытается получить file://cdn.example.com/js_file.js, которую вы, конечно же, можете предоставить и локально).

Ответ 4

Многие называют это относительным URL-адресом протокола.

Он вызывает двойную загрузку файлов CSS в IE 7 и 8.

Ответ 5

Здесь я дублирую ответ в Скрытые функции HTML:

Использование независимого от протокола абсолютного Путь:
<img src="//domain.com/img/logo.png"/>
Если браузер просматривает страницу в SSL через HTTPS, тогда он будет запрашивать этот актив с протоколом https, в противном случае он запросит его с помощью HTTP.

Это предотвратит это ужасное "Эта страница Содержит как безопасные, так и не защищенные Элементы" в IE, сохраняя все ваши запросы по активам в рамках тот же протокол.

Предостережение: при использовании в <link> или @import для таблицы стилей, IE7 и IE8 дважды загрузите файл. Все остальные но все же просто отлично.

Ответ 6

Совершенно верно оставить протокол. Спецификация URL была очень понятна в течение многих лет, и я еще не нашел браузер, который этого не понимает. Я не знаю, почему этот метод не известен; это идеальное решение сложной проблемы пересечения границ HTTP/HTTPS. Подробнее здесь: Переходы Http-https и относительные URL

Ответ 7

Есть ли случаи, когда он не работает?

Просто, чтобы бросить это в миксе, если вы работаете на локальном сервере, это может не сработать. Вам нужно указать схему, в противном случае браузер может предположить, что src="//cdn.example.com/js_file.js" есть src="file://cdn.example.com/js_file.js", который будет ломаться, так как вы не размещаете этот ресурс локально.

Microsoft Internet Explorer, похоже, особенно чувствителен к этому, см. этот вопрос: Невозможно загрузить jQuery в Internet Explorer на localhost (WAMP)

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

Решение, используемое HTML5Boilerplate, должно иметь резервную копию, когда ресурс загружен неправильно, но это работает только если вы включили проверка:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- If jQuery is not defined, something went wrong and we'll load the local file -->
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

UPDATE: HTML5Boilerplate теперь использует <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js после принятия решения об уменьшении относительных URL-адресов протокола, см. [здесь] [3].

Ответ 8

Следуя ссылке gnud, раздел RFC 3986 5.2 говорит:

Если компонент схемы определен, указывая, что ссылка начинается с имени схемы, тогда ссылка интерпретируется как абсолютный URI, и мы закончили. В противном случае, эталонная схема URI наследуется от базового компонента схемы URI.

Итак, // верен: -)

Ответ 9

Да, это описано в RFC 3986, раздел 5.2:

(изменить: К сожалению, моя ссылка RFC устарела).

Ответ 10

Это действительно правильно, как утверждают другие ответы. Следует отметить, однако, что некоторые веб-искатели отправят 404s для них, запросив их на вашем сервере, как локальный URL. (Они игнорируют двойную косую черту и рассматривают ее как одну косую черту).

Вы можете настроить правило на своем веб-сервере, чтобы поймать их и перенаправить.

Например, с Nginx вы добавите что-то вроде:

location ~* /(?<redirect_domain>((([a-z]|[0-9]|\-)+)\.)+([a-z])+)/(?<redirect_path>.*) {
  return 301 $scheme:/$redirect_domain/$redirect_path;
}

Помните, что если вы используете периоды в своих URI, вам нужно будет увеличить специфичность, или это приведет к перенаправлению этих страниц на несуществующие домены.

Кроме того, это довольно массивное регулярное выражение для запуска для каждого запроса - на мой взгляд, стоит наказать несовместимые браузеры с 404s над (небольшим) успехом в большинстве совместимых браузеров.

Ответ 11

Мы видим 404 ошибки в наших журналах при использовании //somedomain.com в качестве ссылок на файлы JS.

Ссылки, которые вызывают появление 404s, выглядят следующим образом: ссылка:

<script src="//somedomain.com/somescript.js" />

404 запрос:

http://mydomain.com//somedomain.com/somescript.js

При регулярном появлении в наших журналах веб-сервера можно с уверенностью сказать, что: Все браузеры и боты НЕ НЕ соблюдают RFC 3986 раздел 4.2. Самая безопасная ставка заключается в том, чтобы включать протокол, когда это возможно.

Ответ 12

Образец, который я вижу на html5-boilerplate:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

Он работает плавно на разных схемах, таких как http, https, file.

Ответ 13

Поскольку ваш пример связан с внешним доменом, если вы используете HTTPS, вы должны убедиться, что внешний домен также настроен для SSL. В противном случае ваши пользователи могут видеть ошибки SSL и/или ошибки 404 (например, более старые версии Plesk хранят HTTP и HTTPS в отдельных папках). Для CDN это не должно быть проблемой, но для любого другого веб-сайта это может быть.

На стороне примечание, проверенное при обновлении старого веб-сайта, а также работает в url = части META REFRESH.

Ответ 14

1. Резюме

Ответ за 2019 год: вы все еще можете использовать URL-адреса, относящиеся к протоколу, но эта техника - анти-паттерн.

Также:

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

Переход с относительных к протоколу URL-адресов на https:// было бы неплохо.

2. Актуальность

Этот ответ актуален для января 2019 года. В дальнейшем данные этого ответа могут устареть.

3. Анти-шаблон

3.1. аргументация

Пол Ирриш (Paul Irish) - инженер-фронтовик и адвокат разработчика для Google Chrome - напишите в декабре 2014 года:

Теперь, когда SSL поощряется для всех и не имеет проблем с производительностью, этот метод теперь является анти-паттерном. Если нужный вам ресурс доступен по SSL, всегда используйте https:// asset.

Разрешение фрагменту запрашивать через HTTP открывает двери для атак, таких как недавняя атака GitHub "Человек на стороне". Всегда безопасно запрашивать HTTPS-ресурсы, даже если ваш сайт работает по протоколу HTTP, однако обратное неверно.

3.2. Другие ссылки

3.3. Примеры

4. Процесс разработки

Например, я пытаюсь использовать clean-console.

Файл примера KiraCleanConsole__cdn_links_demo.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>clean-console without protocol demonstration</title>
    <!-- Really dead link -->
    <script src="https://unpkg.com/[email protected]/bowser.min.js"></script>
    <!-- Package exists; link without "https:" -->
    <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
    <!-- Package exists: link with "https:" -->
    <script src="https://cdn.jsdelivr.net/npm/gemini-scrollbar/index.js"></script>
</head>
<body>
    Kira Goddess!
</body>
</html>

выход:

D:\SashaDebugging>clean-console -i KiraCleanConsole__cdn_links_demo.html
checking KiraCleanConsole__cdn_links_demo.html
phantomjs: opening page KiraCleanConsole__cdn_links_demo.html

phantomjs: Unable to load resource (#3URL:file://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js)


phantomjs:   phantomjs://code/runner.js:30 in onResourceError
Error code: 203. Description: Error opening //cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js: The network path was not found.

  phantomjs://code/runner.js:31 in onResourceError

phantomjs: Unable to load resource (#5URL:https://unpkg.com/[email protected]/bowser.min.js)


phantomjs:   phantomjs://code/runner.js:30 in onResourceError
Error code: 203. Description: Error downloading https://unpkg.com/[email protected]/bowser.min.js - server replied: Not Found

  phantomjs://code/runner.js:31 in onResourceError

phantomjs: Checking errors after sleeping for 1000ms
2 error(s) on KiraCleanConsole__cdn_links_demo.html

phantomjs process exited with code 2

Ссылка //cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js действительна, но я получаю ошибку.

Обратите внимание на file://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js и прочитайте ответы Thilo и bg17aw о file://.

Я не знал об этом поведении и не мог понять, почему у меня такие проблемы для Pageres.

5. Сторонние инструменты

Я использую кликабельные URL-адреса Sublime Text. Используйте его, я могу просто открыть ссылки из моего текстового редактора в браузере.

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

6. Заключение

Да:

Если у вас есть проблемы, как в пункте " Developing process, вы можете настроить рабочий процесс разработки.
В противном случае у вас есть проблемы, как в пункте " Third-party tools, вы можете добавить инструменты.

Но вам не нужны эти дополнительные проблемы. Читайте информацию по ссылкам в элементе Anti-pattern: относящиеся к протоколу URL устарели.