Должен ли я использовать абсолютные или относительные URL?
Если под абсолютными URL-адресами вы подразумеваете URL-адреса, включающие схему (например, http / https) и имя хоста (например, yourdomain.com), никогда не делайте этого (для локальных ресурсов), поскольку поддерживать и отлаживать будет ужасно.
Допустим, вы использовали абсолютный URL везде в своем коде, например <img src="http://yourdomain.com/images/example.png">. Теперь, что произойдет, когда вы собираетесь:
- переключиться на другую схему (например, http -> https)
- переключение доменных имен (test.yourdomain.com -> yourdomain.com)
В первом примере будет получено предупреждение о том, что на странице запрашивается небезопасный контент. Потому что все ваши URL жестко запрограммированы для использования http (: //yourdomain.com/images/example.png). А при запуске ваших страниц через http браузер ожидает загрузки всех ресурсов через https, чтобы предотвратить утечку информации.
Во втором примере, когда ваш сайт работает из тестовой среды, это будет означать, что все ресурсы по-прежнему указывают на ваш тестовый домен, а не на действующий домен.
Итак, чтобы ответить на ваш вопрос о том, использовать ли абсолютные или относительные URL-адреса: всегда используйте относительные URL-адреса (для локальных ресурсов).
В чем разница между разными URL?
Сначала давайте посмотрим, какие URL-адреса различий мы можем использовать:
К каким ресурсам эти URL-адреса пытаются получить доступ на сервере?
В приведенных ниже примерах я предполагаю, что веб-сайт работает из следующего местоположения на сервере /var/www/mywebsite.
http://yourdomain.com/images/example.png
Приведенный выше (абсолютный) URL пытается получить доступ к ресурсу /var/www/website/images/example.png. Этот тип URL - это то, что вы всегда хотели бы избегать при запросе ресурсов с вашего собственного сайта по причинам, изложенным выше. Однако это имеет свое место. Например, если у вас есть веб-сайт http://yourdomain.com и вы хотите запросить ресурс у внешнего домена через http, вы должны использовать это. Например. https://externalsite.com/path/to/image.png.
//yourdomain.com/images/example.png
Этот URL-адрес является относительным на основе текущей используемой схемы и должен почти всегда использоваться при включении внешних ресурсов (изображений, javascripts и т. Д.).
Этот тип URL использует текущую схему страницы, на которой он находится. Это означает, что вы находитесь на странице http://yourdomain.com и на этой странице есть тег изображения <img src="//yourdomain.com/images/example.png"> URL-адрес изображения будет разрешен в http://yourdomain.com/images/example.png.
Если бы вы были на странице http**s**://yourdomain.com и на этой странице есть тег изображения <img src="//yourdomain.com/images/example.png">, URL-адрес изображения будет разрешен в https://yourdomain.com/images/example.png.
Это предотвращает загрузку ресурсов через https, когда он не нужен, и автоматически проверяет, запрашивается ли ресурс через https, когда требуется .
Приведенный выше URL-адрес разрешается таким же образом на стороне сервера, что и предыдущий URL-адрес:
Приведенный выше (абсолютный) URL пытается получить доступ к ресурсу /var/www/website/images/example.png.
/images/example.png
Для локальных ресурсов это предпочтительный способ ссылки на них. Это относительный URL, основанный на корне документа (/var/www/mywebsite) вашего веб-сайта. Это означает, что если у вас есть <img src="/images/example.png">, он будет всегда разрешаться до /var/www/mywebsite/images/example.png.
Если в какой-то момент вы решите сменить домен, он все равно будет работать, потому что он относительный.
images/example.png
Это также относительный URL, хотя он немного отличается от предыдущего. Этот URL относится к текущему пути. Это означает, что он будет разрешаться по разным путям в зависимости от того, где вы находитесь на сайте.
Например, когда вы находитесь на странице http://yourdomain.com и используете <img src="images/example.png">, на сервере будет разрешено /var/www/mywebsite/images/example.png, как ожидается, однако, когда вы находитесь на странице http://yourdomain.com/some/path, и вы используете точно такое же изображение пометить его вдруг разрешит /var/www/mywebsite/some/path/images/example.png.
Когда использовать что?
При запросе внешних ресурсов вы, скорее всего, захотите использовать URL-адрес относительно схемы (если не хотите использовать другую схему), а при работе с локальными ресурсами вы хотите использовать относительные URL-адреса на основе корня документа.
Пример документа:
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link href='//fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700' rel='stylesheet' type='text/css'>
<link href="/style/style.css" rel="stylesheet" type="text/css" media="screen"></style>
</head>
<body>
<img src="/images/some/localimage.png" alt="">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
</body>
</html>
Некоторые (вроде) дубликаты