Htaccess css не работает

CSS not loading after redirect with htaccess rewrite rule

I have the following Short-hand for a user profile url

The site is styled with the appropriate css file when i do site.com/name_of_user

but not when i do site.com/name_of_user/

Although the redirect is to the right page.

Help is appreciated!

12 Answers 12

the easiest way to fix this is to specify the full path to your CSS file in the of the HTML file.

If your mod_rewrite rule is modifying the path to where your CSS file is, you’d also want to place this before your RewriteRule :

This makes sure that the request doesn’t match a file before rewriting it.

I had this same problem and have found the easiest and most practical solution.

It’s super clean and easy to use.

link the css files relative to the root directory sample:

When your page URL is example.com/name_of_user/ , loading of resource css/js/images may cause problems if your HTML page is using relative paths for these resources. It is because browser resolves resource URLs using current URL.

So for example if a style tag is:

and your current page URL is:

Then browser will resolve css URL as as example.com/name_of_user/static/style.css instead of example.com/static/style.css . This will cause 404 for resource URLs and your page will be displayed without any style, scripts and images.

You can solve this problem using one of the following ways:

Use absolute path in your css, js, images files rather than a relative one. Which means you have to make sure path of these files start either with http:// or a slash / .

Otherwise You can add this just below section of your page’s HTML:

so that every relative URL is resolved from that base URL and not from the current page’s URL.

Источник

css / js не работает после добавления htaccess

У меня есть .htaccess файл, и это скрипт внутри него:

В моем файле макета я загружаю CSS и JS с абсолютным путем, как это:

И я получаю доступ localhost/project/register/ , но

Файл css / js не загружен из-за ошибки:

Почему он имеет прямой доступ к /public после localhost ? это должно быть localhost/project/public , а не localhost/public

Если я удаляю сначала / по ссылке css, то получаю доступ к localhost/project/register/public

3 ответа

Ваша ссылка CSS неверна. Он начинается с /public , что означает, что Apache попытается найти его в папке public в корневом каталоге сайта.

Вы должны обновить свой путь до относительного:

А затем добавьте это чуть ниже раздела HTML вашей страницы:

Так что каждый относительный URL разрешается из этого базового URL, а не из URL текущей страницы.

В качестве альтернативы тегу в HTML вы можете использовать это правило перенаправления в вашем .htaccess в качестве самого первого правила:

Однако обратите внимание, что правило перенаправления (даже с R=301 ) все равно заставит нового клиента отправлять 2 запроса на ваш веб-сервер. Сначала с URI /public/. , а затем с URI /project/public/. после перенаправления.

Кажется, у вас есть два отдельных вопроса.

На ваш вопрос, в этом правиле .htaccess нет ничего, что изменило бы способ отображения существующего файла .css или .js. И поэтому, весьма вероятно, что ваши ссылки раньше не работали, или у вас был какой-то другой контент в файле, прежде чем переписать URL-адреса иначе, чем вы удалили. В этом файле просто указывается, что если указан URL-адрес, и нет файла или каталога, который ему соответствует, то перепишите URL-адрес для определенного URL-адреса. Это кажется ошибкой, поскольку URL либо существует, либо его нет.

Ваш второй вопрос касается URL-адресов и почему в них нет /project . Я не уверен, почему вы считаете, что они должны иметь /project в них, но я предполагаю, что вы предполагали это, потому что ваш оригинальный HTML находится в этом каталоге. Вы начинаете свою ссылку с / , как в /public/assets/bootstrap/dist/css/bootstrap.min.css» . Это / означает, что путь является абсолютным, а не относительным, что означает, что путь начинается непосредственно после имени хоста. Если вы удалите начальный / , то путь будет относительно URL-адреса, с которого он вызывается.

Если вы хотите загрузить эти файлы относительно корня домена, а каталог public не находится в корне домена, вам потребуется предоставить домен полный . относительный путь:

Источник

Htaccess css не работает

Спасибо, помогает 🙂 (правда кроме флешки, она никак не хочет показываться)

А не подскажете еще один вопросик:

на сайте есть еще ссылки типа сайт.ру/index.php?tip=btl Чтобы из них сделать ссылки типа сайт.ру/btl/ — это надо отдельную строку прописывать? Сделал файл

Работает только нижнее правило. Что неправильно?

И еще вопросик возник. Страница подгружает данные из базы ориентируясь на параметры $_GET, в моем случае на $_GET[‘tip’] и $_GET[‘num’]. Но после перехода на ЧПУ гетов уже не будет, как же будет работать сайт?

slugger-ekb:

И еще вопросик возник. Страница подгружает данные из базы ориентируясь на параметры $_GET, в моем случае на $_GET[‘tip’] и $_GET[‘num’]. Но после перехода на ЧПУ гетов уже не будет, как же будет работать сайт?

Так он уже работает без $_GET, вы ж написали что страницы открываются. 😂

Посмотрите на правило RewriteRule, особенно на правую его часть.

Не волнуйтесь. Переменные $_GET[‘tip’] и $_GET[‘num’] будут принимать прежние значения.

slugger-ekb:
Знатоки, подскажите пожалуйста начинающему!
Есть сайт со ссылками типа сайт.ру/index.php?tip=btl&num=2. Хочу сделать ЧПУ типа сайт.ру/btl/2/, пишу следующий .htaccess:

RewriteEngine on
RewriteRule ^(.*)/(3+)/$ ?tip=$1&num=$2

(больше в файле ничего нет)
Сайт по ЧПУ ссылкам открывается, но почему-то без рисунков и без CSS. Где ошибка, что подправить.

Вариант еще один, по моему мнению на много проще:

кинуть в папку с изображениями и цсс файл .htaccess с таким содержимым:

Источник

.htaccess (не загружаются картинки и css по относительным путям)

Leshas0

Новичок

.htaccess (не загружаются картинки и css по относительным путям)

Друзья, помогите с такой проблемой никак не могу побороть.

Проект лежит в папке /project. URL проект имеет следующий: http://localhost/project/

Мой скрипт разбирает строчку на параметры вот так:

Options +FollowSymLinks
Options -Indexes
DirectoryIndex index.php

RewriteEngine ON
RewriteBase /project

RewriteCond % !\.(php|css|js|htc|png|gif|jpeg|jpg|ico)$
RewriteRule .* index.php

А проблема, которую не могу побороть заключается в том, что я хочу использовать относительные пути для картинок и css, которые лежат в папке /theme (http://localhost/project/theme/), а приведённая выше конструкция этого не позволяет сделать. Я уже перепробовал массу вариантов, но картинки отображаются, а css подключается только при указании АБСОЛЮТНОГО адреса (http://. ), а я хочу использовать относительные.

Вот, что я написал в .htaccess. Почему не получается, не понимаю.

Options +FollowSymLinks
Options -Indexes
DirectoryIndex index.php

RewriteEngine ON
RewriteBase /project

# Вот эту строчку я добавил. Мои рассуждения: если запрошенный адрес заканчивается на png, gif, jpeg, jpg, ico, то
# всё это (^$) перезаписываем как хост (%) + запрошенный путь (%). Не работает.
# Пробовал вмето ^$ поставить .* — тот же результат (не работает).
RewriteCond % \.(png|gif|jpeg|jpg|ico)$ [NC]
RewriteRule ^$ %% [L]

# Это так и осталось нетронутым (т.е. копия кода выше)
RewriteCond % !\.(php|css|js|htc|png|gif|jpeg|jpg|ico)$
RewriteRule .* index.php

Подскажите, как заставить загружать картинки и подключать css по относительным путям?

Источник

Попытка номер раз создать почти идеальный htaccess

.htaccess — наш герой

Профессионалы знают, что такое htaccess.
Тем кто собираются уйти с народ.ру на php-хостинг только предстоит узнать, что это такое.
Те кто только что установил свои первые jooml’у или wordpress срочно должны узнать о нашем герое — htaccess

Зачем нам .htaccess ?

Представьте, что вы купили себе хостинг и кажется, почти обрели счастье. Но однажды (а может быть дважды, а может и трижды) ваш сайт перестает отвечать на запросы. Начинает медленно грузиться и вообще вести себя странно. А виртуальный хостинг это такая хитрая штука, что помимо вашего сайта на этом сервере находится ещё два десятка других сайтов. Все они разные по мощности, организованности и трафику. И когда ваш сосед по случайности, а может и умыслу запускает на своем хостинге сложные или избыточные в алгоритмах скрипты, это отзывается и на вас.

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

А ещё htaccess может решить некоторые вопросы с безопасностью вашего сайта.

Хочу идеальный .htaccess !

Оказывается в интернете много различной противоречивой информации относительно того как использовать .htaccess. Пришлось долго и нудно экспериментировать, чтобы понять что истинно, а что ложно. В большинстве случаев авторы советов в своих блогах забывают упомянуть, что для работы определенных условий нужен тот или иной модуль Апача.
Впрочем хватит слов, пора к делу. Попробуем создать почти идеальный .htaccess

1. Первой строкой задаем основные опции:

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

Опция -ExecCGI запрещает запуск CGI скриптов. Лучше разрешить только для конкретных папок. Повысит безопасность.
Опция -Indexes запрещает показывать содержимое каталогов, если в них нет индексного файла. На виртуальном хостинге обычно включена по умолчанию. Изменив минус на плюс +Indexes можете наоборот разрешить просмотр содержимого каталога (или каталогов).
Опция -Includes запрещает SSI. Если не знаете, что это — запрещайте (Можно поЯндексировать(! ) по запросу Server Side Include если хотите узнать об этом побольше). Можно использовать опцию IncludesNOEXEC, которая разрешит использовать SSI без запуска скриптов.
Опция +FollowSymLinks позволяет использовать символические ссылки на файлы или каталоги, не находящиеся в пределах корня вашего сайта.

Вы можете использовать htaccess с разными настройками для разных каталогов. В корне сайта вы можете объявить -Indexes, а в избранных каталогах создать ещё один файл .htaccess и в нем объявить +Indexes. Помните, что действие опций htaccess распространяет сверху вниз по дереву каталогов до самой глубокой вложенности, пока не будут отменены другим htaccess.

Необязательно полностью перечислять все опции в дочерних .htaccess если они не изменяются. Достаточно указать (переназначить) только те опции и директивы, которые изменяются. Остальные опции также унаследуются от родителя.

Скажем, у вас есть вот такой путь /site/folder_one/subfolder/other/
В файле /site/.htaccess вы указываете:

В файле /site/folder_one/.htaccess указываете:

В файле /site/folder_one/subfolder/.htaccess указываете:

Получиться вот что:
В папке site будут показываться файлы любого содержания, если только к ним напрямую обратиться. Или индексный файл, если не явного обращения к одному из файлов. В случае отсутствия индексного файла получена 403 ошибка.
К папке folder_one доступ закрыт. Даже если знать имя файла и набрать его в адресной строке в ответ сервер вернет ошибку 403.
Папка subfolder разрешена для обращений по прямому адресу или же в случае отсутствия индексного файла покажет содержимое каталога. Эти же права распространяться и на папку other.
Если убрать файл ,htaccess из папки folder_one, то она унаследует права от родительской site.

2. Немного SEO (куда же без него)

Обязательно не забыть про условие . Не окажись у хостера данного модуля и ваш сайт станет выдавать 500-ую ошибку. Данный конкретный модуль входить в сборку Апача по-умолчанию. Ну а вдруг… Хостеры и их админы бывают всякие.

В данной части пользы больше для SEO. Модуль rewrite как следует из его названия занимается перенаправлениями (привет Кэпу) .

В этой части файла мы указали две склейки: мы склеили ваш_сайт и www.ваш_сайт Даже если пользователь наберет ваш сайт без WWW его перебросить 301 редериктом на www.ваш_сайт.
А также мы избавились /index.php в строке запроса. Если пользователь наберет www.ваш_сайт/index.php его перебросит (снова 301 редериктом) на www.ваш_сайт.
Теперь поисковики не будут путаться между www и не будут дублировать главную страницу в результатах индексирования вашего сайта. Гуглим СЕО склейки домена, если не понимаете зачем это нужно.

3. Кто в папке главный?

Если у вас папке есть файлы index.html и index.php (не знаю, зачем и кому такое было нужно, но не раз видел такое) то как указать серверу кто их них более индексный?

А ещё можно там указать скажем roosso.php и тогда набрав в строке запроса адрес сайт.бла/бла/бла/ вы увидете не index, а roosso

4. Ещё настройки…

Первая строчка устанавливает часовой пояс. Например в Apache 2.22.22 был баг связанный с этой опцией. Функции времени в php не работали, пока не установишь часовой пояс.

Вторая строка это подпись сервера. Вы их не раз видели на всяких системных страницах типа 500ой ошибки или 403ей. Обычно там какая-нибудь техническая информация и почта вебмастера. Я предпочитаю даже в таких мелочах скрывать данные о софте на сервере. Коллеги параноики меня поддержат.

Угадайте, что делает третья строка?

5. Когда нет доступа к php.ini

С помощью .htaccess мы также можем управлять рядом настроек PHP. На виртуальном хостинге, как правило, нет возможности изменять настройки php.ini. Чаще всего этого и не требуется. Но все же есть ряд опций контроль над которыми может нам быть полезен. Например, увеличить лимит на загрузку файлов, или лимит передачи данным методом POST.

Первая строчка разрешить загружать файлы размером до 32 Мегабайт. По умолчанию в php обычно это значение 8 или 16 мегабайт.
Второй строкой разрешаем постинг объемом до 10 мегабайт. По умолчанию это значение обычно 2 Мегабайта.
Третья строка устанавливает кодировку по используемую вашими скриптами. По своей сути она дублирует строку: «AddDefaultCharset UTF-8». Но я чаще прибегаю к установке кодировки именно через php.
Четвертой строкой изменяем лимит времени выделенный на выполнение скрипта. По умолчанию он обычно равен 30 секундам. Но иногда для выполнения каких нибудь сложных обработок требуется больше времени.

6. Типы файлов. Ловкость рук и ни какого мошенничества.

В моей практике случалось пару раз, что после какого либо обновления провайдером софта, слетали типы файлов. Хотя такое редко. За 10 лет, всего два случая. Но иногда мне нужно было заставить html работать как php. А иногда требуется научить апач различать типы файлов, которые ему неизвестно. (Как оказалось Апачу вообще мало что известно из редких типов файлов.) В такой ситуации нас спасет следующий код:

Первая строчка позволит нашим php файлам иметь расширение html, но выполняться как php. Полезно бывает во многих случаях. А в старые добрые когда поисковики индексировали ЧПУ лучше, такая строчка всегда приходила на выручку.
Мы можем переназначить, добавить или подменить любые типы файлов под удобные нам разрешения.

Кстати, вы можете легко написать к примеру вот такую строку:

Потом переименовать все ваши файлы, изменив расширение на .i (не забыв конечно про ссылки) и адреса файлов у вас на сайте будут не сайт.мой/index.php?uri а сайт.мой/index.i?uri

Например я пишу

и создаю в корне своего сайта файл alex.roosso внутри обычный php код. Это вроде как страница обо мне любимом. И в адресной строке она будет выглядеть как www.black-web.ru/alex.roosso (ссылка рабочая, можете посмотреть что это так).

Второй строкой указано, какие расширения файлов должны выполняться как cgi скрипты.

Третья, четвертая и пятая строки, на всякий случай уточняют мим-тип файлов с разрешением css, js, xml. Не путайте с присвоением заголовка в ответе сервера на запрос, как это сделано в первых двух строках.

Шестая строчка это участка, нужна если на вашем сайте есть скачиваемый для пользователей контент. Если добавить эту строку, то при обращении к данным файлам им будет предлагаться скачать их на компьютер, а не как это сейчас в современным браузерах куча плагинов, которые даже word открывают в браузере.

Седьмую строку я закомментировал. Это строчка в принудительно-добровольном порядке, будет все файлы с вашего сервера запустить как php. Её лучше использовать лишь в отдельных папках, при необходимости.

7. Знают взрослые и дети, что архивы меньше весят…

Полезно, когда ваши страницы загружаются быстрее. Поэтому люди и придумали архивировать файлы. А потом они ещё подумали и решили, что архивировать можно и страницы на сайтах и картинки. Причем делать это незаметно для пользователя, но существенно снижать трафик и ускорять загрузку страниц. Волшебные слова прозвучали, теперь обсудим, как это можно сделать.

У Апача есть два модуля сжатия. Оба не являются модулями по умолчанию, поэтому необязательно могут присутствовать у вашего провайдера. Но как показала практика у 99% провайдеров один из них стоит. Наиболее распространен mod_deflate. Чтобы его с помощью сжимать весь контент на вашем сайте добавьте в .htaccess следующие строки:

Как видите мы должны перечислить mime type файлов, которые следует подвергать сжатию. Сюда можно добавить и видео и картинки, но толку это даст мало. Потому что jpeg или gif уже сами по себе являются сжатыми форматами. Также как avi или flv. Вы фактически нечего не выиграете указав их.

Второй менее популярный модуль это mod_gzip, Чтобы включить сжатие с его помощью добавьте вот такие строчки:

Данный модуль умеет работать с масками, что несомненно большой плюс. Да и синтаксис у него куда более гибкий чем у предыдущего. Но используют его реже. А по сжатию я даже не берусь судить, который из модулей лучше. Я сильной разницы не заметил при тестах.

8. А ещё быстрее можно?

Можно. Если применить кеширование страниц. У кеширования есть и плюсы и минусы, поэтому подходить к этому вопросу надо подготовившись. Для динамически обновляющегося сайт каждый 2-3 минуты, например популярного форума, нужно учесть, что пользователь должен видеть актуальную информацию. Но у любого сайт есть контент, который более или менее статичен. Например те же картинки, или файлы стилей. Поэтому нам потребуется по разному использовать кеширование различного содержимого на сайте. В html разметки мы всегда можем использовать meta теги. И через php мы может устанавливать заголовки ответа сервера. Остается вопрос, как быть с css, js, image и т.д. и т.п.

Помочь нам в этом могут два модуля: mod_headers и mod_expires которые могут установить заголовки в ответ сервера и подсказать вашему браузеру, что и как нужно кешировать. Один из модулей обычно стоит у провайдера, но как и в случае с любым модулем, который не входит в стандартную сборку Апача, 100% гарантии никто вам не даст. Поэтому снова во избежание 500й ошибки указывает условия для каждого из модулей.

Вот такой синтаксис у mod_headers. Думаю по комментариям ясно что к чему.
В данной секции я отключил кеширование php файлов. Хотя по моему мнению небольшой временной интервал кеширования им не повредит. 5-30 секунд, это интервал времени, за который мало что меняется. А многие пользователи любят пользоваться клавишей back (вернуться назад). Чтобы не загружать им страницу второй раз, а подхватить её из кеша, разумный интервал кеширования все же уместен.

Во второй секции где идут условия для mod_expires я именно так и делаю — для php ставлю небольшой интервал кеширования.

9. Правила вежливого тона…

В процессе модернизации своего сайта, мы часто оставляем хвосты ввиде ссылок, которые ведут на страницы, которые мы удалили. Иногда такие ссылки идут с других сайтов или из поисковых систем. Чтобы не терять пользователей вежливым тоном считается иметь собственные страницы для различного типа ошибок. Включая даже ошибки сервера. Например стандартное сообщение о 500й ошибки очень скучное и мрачное, и вряд ли вызовет у пользователя желание посетить вашу страницу ещё раз. Но в htaccess есть приемы, которые могут сделать даже эту страницу приветливей.

Для 400-х ошибок можно использовать и динамические страницы на php. А вот для 500 лучше сделать на html и js. Это часть ошибок обычно связана с ошибками сервера (в большинстве случаев) и php или cgi как правило в такой ситуации не работают.

Если вам лень делать столько страниц устанавливайте страницей ошибок главную страницу своего сайта или карту сайта.

Все это вы делаете исключительно для людей. Поисковым роботам плевать на то есть у вас страницы ошибок или нет. Они видят ответ сервера с кодом ошибки и блокируют вашу страницу в поиск. Так что имейте ввиду, это не панацея. Это лишь вежливость к вашей аудитории и имидж вашего сайта.

10. Подведем итог

Знатоки понимают, что в этой статье описано далеко не все. Я коснулся здесь лишь поверхности «айсберга». На самом деле возможности .htaccess куда много обширней, чем описано в статье. Но я и не преследовал целью перевести манаул по htaccess на русский язык. Всего чего я хотел это создать небольшой костяк файла .htaccess для тех, кто только приступил к изучению данного вопроса, чтобы сэкономить их время на поисках информации по сети.

В результате всех манипуляций у нас должен был получить файл следующего содержания:

Я старался не спешить в написании статьи и на это ушли почти сутки. Но все же где то я мог допустить ошибки в орфографии или пунктуации. Прошу не казнить, а миловать. А лучше писать в личку, чтобы я поправил ошибки.

И напоследок для любителей экспериментов несколько строк .htaccess. Сужу по своему опыту — на практике знания усваиваются лучше чем в теории.

… Для тех у кого всё получилось, идём на www.webpagetest.org мерять красоту до и после.
Andrey_Zentavr

Кому надо берите полностью готовый .htaccess здесь
Данный файл показал самую высокую производительность на тестах.
Также там куча всего закомментировано о чем я не упомянул в статье и что может пригодиться в тех или иных случаях.

Источник