Nginx

В предыдущей статье я затрагивал тему nginx.
А значит нужно его установить.
nginx [engine x] — это HTTP-сервер и почтовый прокси-сервер. Я начал разрабатывать nginx весной 2002 года, а осенью 2004 года вышел первый публично доступный релиз. В декабре 2009 года nginx использовался на 4% самых посещаемых сайтов в мире.
Я буду рассматривать установку в привычной и используемой мной системе Ubuntu Server 10.04 LTS, хотя думаю установка будет мало чем отличаться в любых Ubuntu-подобных системах, и возможно на Debian и его клонах.
Итак поехали.
Установка сводится к банальному
sudo aptitude install nginx
Готово. Теперь нужно немного подкорректировать конфиги , как самого nginx так и apache.
Начнем с apache :
Открываем /etc/apache2/ports.conf

NameVirtualHost *:80
Listen 80

меняем на :

NameVirtualHost *:88
Listen 88

Так как на 80 порту у нас теперь будет nginx.
Если у Вас уже было куча Виртуалхостов смените у них порты с 80 на 88 (хотя и это только для примера, — использовать можете любой).
И теперь коснемся самого nginx.
Редактировать мы будем секцию

http {
upstream backend
{
server 127.0.0.1:88;
}
server {
listen 80;
location ~/\.ht {
deny all;
}
location / {
proxy_pass http://backend/;
proxy_set_header Range "";
proxy_set_header Request-Range "";
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}

Перезапускаем сервисы :

/etc/init.d/apache2 restart
/etc/init.d/nginx restart

Опасная уязвимость для серверов с apache

Недавно наткнулся на статью про найденную уязвимость в веб-сервере apache.

Пять дней назад в листе рассылки Full Disclosure появился скрипт, по заявлению автора, убивающий Apache начиная от самых старых версий до самых новых.

Работает скрипт очень просто : запускает простой запрос в несколько десятков потоков.

HEAD / HTTP/1.1
Host: www.example.com
Range: bytes=0-,5-0,5-1,5-2,5-3,5-4,<...>,5-1299,5-1300
Accept-Encoding: gzip
Connection: close

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

Проверить, уязвим ли ваш сервер к этой атаке легко:

curl -I -H "Range: bytes=0-1,0-2" -s www.example.com/robots.txt | grep Partial

Если Вы увидели ответ :

206 Partial Content

То Ваш сервер 100% уязвим для такой атаки.

Что же делать и как поставить защиту ?

Самым простым способомбудет прописать для nginx запрет для проксирования пустых запросов :

proxy_set_header Range "";
proxy_set_header Request-Range "";

А вот если nginx у Вас нет, то рекомендую его установить. Или по сообщениям сайта  cybersecurity.ru :

Разработчики web-сервера Apache сообщают об исправлении опасной уязвимости CVE-2011-3192 , которая использовалась злоумышленниками для проведения атак на отказ в обслуживании web-серверов. Стоит отметить, что web-сервер Apache обеспечивает работу двух третей всех сайтов в мире.

Напомним, что опасная уязвимость была обнаружена независимыми специалистами в области информационной безопасности 20 августа. В тот же день в сети Интернет появился эксплоит, который позволял вывести из строя любой сайт, который использует Apache HTTP Server.

Уязвимость в Apache HTTP Server позволяла злоумышленникам аварийно завершать работу web-серверов, используя простую вредоносную программу. Ошибка заключалась в способе обработки большого количества Range запросов в HTTPD, что приводило к исчерпанию ресурсов удаленной системы. Ошибка была исправлена в новой версии Apache HTTP Server 2.2.20. Однако для того, чтобы предотвратить атаку, все администраторы сайтов, которые используют Apache HTTP Server, должны самостоятельно установить обновление.

Спойлеры в WordPress

Делаем Спойлеры в Worpress.

Для начала определимся для чего это нужно.

Применений Спойлерам очень много.

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

Итак как это работает ? Пример можно посмотреть у меня же на блоге. Переведите взгляд правее и посмотрите на меню — Рубрики/метки/Голосование/Каталоги. Все это занимает бОльшую часть боковой колонки, место которой можно более еффективно использовать.

По заголовку можно раскрыть/скрыть содержимое.

Практика.

Сначала нужно задать соответсвующие стили. Для этого открываем CSS файл с описанием стилей и вносим соответствующий код:

.onner {font-size: 1.4em;font-variant: small-caps;color: #08970c;border-bottom: 1px solid #ccc; width: 260px;font-weight: bold;}
 .spoiler {border:0px solid #ddd; padding:3px;}
 .spoiler .inner {border:0px solid #eee; padding:1px;margin:1px;}

Оформление можете редактировать на свой вкус и цвет.

Далее между тегами <head> и </head> подключаем java-скрипт:

<script type="text/javascript"> 
function showSpoiler(obj) {var inner = obj.parentNode.getElementsByTagName("div")[0]; if (inner.style.display == "none") inner.style.display = ""; else inner.style.display = "none"; } 
</script>

Ну и теперь собственно сам код спойлера:

<div class="spoiler"> 
<span class="onner" onclick="showSpoiler(this);">Раскрыть/Скрыть</span> 
<div class="inner" style="display:none;">
Тут пишем любой контент
</div></div>

Модальные окна facebox

Недавно столкнулся с темой использующей модальные окна facebox.
Довольно интересное решение.
Наверное все уже встречали окна типа lightbox — красивые всплывающие окна с картинками. При помощи lightbox можно делать как отдельные картинки , так и целые галереи.
Но есть в этом и один минус — показывать в этих окнах можно только картинки.
Facebox — это такие же всплывающие окна, как и lightbox только с одним большим отличием : загружать в них можно как картинки, так и текст, код, да и вообще почти все что угодно.
Facebox работает на jQuery — т.е. для ее работы необходимо подключить эту библиотеку версии не ниже 1.2.1.
Скачать facebox можно тут.

<script src="/js/jquery.js" type="text/javascript"></script>

Далее подключаем сам скрипт и его стили:

<!-- facebox start  -->
<link href="/js/facebox/facebox.css" media="screen" rel="stylesheet" type="text/css"/>
<script src="/js/facebox/facebox.js" type="text/javascript"></script>
<!-- facebox end -->

А так же скрипт по которому понятно, что окно должно быть модальным:

<!-- facebox rel=    -->
<script type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({
loading_image : 'loading.gif',
close_image   : 'closelabel.gif'
}) 
})
</script>
<!-- facebox rel= end -->

Чтоб вывести произвольный текст модальном окне пишем следующий код:

<a rel="facebox" href="#info">Появление произвольного блока в facebox</a>
<div id="info" style="display: none;">
Ваш текст
</div>

Пример блока :
Появление произвольного текстового блока в facebox

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

<a rel="facebox" href="remote.html">text</a>

Пример robots.txt в модальном окне

Картинки в wordpress

Очень часто при вставке картинок в wordpress возникает ситуация, когда хочется сделать обтекание картинки текстом.
Но когда выбираешь положение картинки слева (справа) текст отображается по нижней границе.
Связано это с тем , что при таком выборе wordpress добавляет стили отображения картинки

.aligncenter
.alignleft
.alignright
.wp-caption

Но многие авторы тем это не учитывают в стандартных таблицах стилей.
Откройте Ваш style.css и посмотрите есть ли описание этих классов.
Скорее всего — нет.
Для красивого отображения заменяем или дополняем таблицу стилей следующими классами:

.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}
.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* optional rounded corners for browsers that support it */
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

Теперь картинка должна смотреться так, как Вы и задумывали.
Если не хотите каждый раз делать отступ можно сразу прописать по 5 px:

.alignleft {
float: left;
margin-right: 5px;
}
.alignright {
float: right;
margin-left: 5px;
}

Вот и все премудрости.

Как настроить PHP Expert Editor для работы с Денвером

С высочайшего разрешения хозяина блога  решил всунуть свои «5 копеек»  и добавить в эту копилку  знаний и  цитадель коллективного разума  пару строк.

Так вот.  Как-то вдруг потребовался  мне редактор PHP кода. Хотелось чтобы был удобный, с кучей наворотов, подсветкой синтаксиса, пошаговой отладкой и остальными  нужными (или не очень) «фенечками».  Ну и наличие русского языка было бы желательно, ибо не овладел еще буржуйским в достаточных количествах.

После некоторых поисков выбор остановился на PHP Expert Editor 4.3 от Ankord Development Group (Украина).

43546 Весьма удобный редактор для  PHP, Perl, Python, HTML, Java Script. Поддержка Utf-8. Можно использовать встроенный  HTTP сервер и внешние, есть проверка синтаксиса PHP, встроенный браузер, FTP клиент с поддержкой SFTP, кодовый и файл эксплорер, настраиваемая подсветка кода, пошаговая отладка и т.д. и т.п.

И что самое интересное — программа бесплатна для пользователей из СНГ, а  товарищам из дальнего зарубежья придется выложить 35 евро.

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

После рысканья по инету нашел причину и решил поделиться с вами. Итак:

Как настроить PHP Expert Editor под Денвер :

1.  В папке редактора (у меня это  ‘C:\Program Files\PHP Expert Editor 4.3\DBG\PHP_DBG.DLL’)  лежат dll-ки к расширению которых добавлена версия. У меня Денвер 3 и PHP  там имеет версию 5.2.4. Следовательно берем файлик  php_dbg.dll-5.2.x  и копируем в папку с PHP Денвера (уменя это ‘Z:\usr\local\php5\ext’).  После того как скопируете, уберите  -5.2.x из расширения, файлик дожен иметь название php_dbg.dll.

2.  В файле php.ini  (у меня он тут ‘Z:\usr\local\php5’)   найдите строку  extension_dir = Путь к папке  с расширениями дожен быть указан жестко (с именем диска). У меня так:

extension_dir = "Z:\usr\local\php5\ext"

3. Там же в php.ini найдите группу значений Windows Extensions.  Допишите туда такую строку

extension=php_dbg.dll

Обратите внимание — перед строкой не должна стоять точка с запятой как перед  некоторыми другими значениями в этой группе !  Поверьте также чтобы не была закомментирована строка:

extension=php_gd2.dll

4. Добавляем  в php.ini секцию:

[Debugger]
debugger.enabled=on
debugger.profiler_enabled=on

5. Перезапускаем Денвер

6.  Теперь настройки самого редактора :

Настройки-> настройки редактора -> запуск и отладка-> настройки http-сервера: — ставим галку «Использовать внешний HTTP сервер»

—   «Имя   хоста»   —  имя вашего проекта в Денвере  (например  www.mysite)

—   «Root directory» —  я указал путь к папке с проектом ( Z:\home\mysite\www)

Теперь сюда  Настройки-> настройки редактора -> запуск и отладка-> интерпретаторы        скриптов:

— первые две строки — указываем путь к файлам  PHP (у меня это так):

Z:\usr\local\php5\php.exe
Z:\usr\local\php5\php-cgi.exe

6. Вот и все — теперь грузим наш скрипт — указываем точки останова — и поехали!!

И напоследок:  редактор PHP Expert Editor4.3 бесплатен для жителей СНГ,  но для того чтобы получить ключик (серийный номер)  нужно регистрироваться на сайте  разработчиков программы. Для самых ленивых (да простят меня авторы) выкладываю  программу с ключиками:  качайте ЗДЕСЬ или  ЗДЕСЬ Не судите строго — и не бейте ногами )) это мой первый пост.

Авторизация отдельных страниц сайта

Уже не первый раз возникает вопрос : Если есть некоторое количество вэбстраниц, и некоторые из них надо защитить паролем.

Поправлюсь пароль можно поставить на  определенную папку.

Итак у вас есть сайт :

/www

В нем есть каталоги (директории)


/www/test1
/www/test2
/www/test3

В test1  и test3 — нужно входить только авторизованным пользователям.

Для этого создаем файл .htaccess file в папке /www/test1 и /www/test3 (имя файла начинается с .)
AuthType Basic
AuthName "Members Only"
AuthUserFile /www/test1/.htpasswd"
<limit GET PUT POST>
require valid-user
</limit>

Затем на нужно создать файл паролей  /www/test1/.htpasswd . Мы будем авторизовываться с помощью логина user1, давайте сделаем это:

htpasswd -c /www/test1/.htpasswd user1

Вводим пароль — готово.

аналогично проделываем и для /www/test3

Сам форум для веб-мастеров,то есть,осуществляется поддержка по всем CMS систем,так же,архив шаблонами и т.д..Есть раздел для SEO\\\\\\\\CEO и дизайнеров (фотошоп,графика,falsh)..

Неплохая статья о
настройке FreeBSD с нуля — Apache, PHP, MySQL, mc, webmin, proFTPd ...
Много полезных статей о поисковой оптимизиации SEO и не только.

Собственный стиль в WordPress

Пробовал сделать страничку с портфолио на WordPress, но столкнулся с тем , что надо было делать для этой странички собственный стиль. Наступил на грабли.

Сначала выложу принципы взятые из форумов по WP:

Создаем страницу _http://moi.site/test, имеющую индивидуальный шаблон.

1. В папке Темы делаем копию файла index.php (page.php, 404.php) и называем эту копию test.php

2. В самом начале test.php добавляем

Код:

<?php
/*
Template Name: Test template
*/
?>

3. Удаляем из полученного шаблона вывод основного цикла Loop (если он есть и если он не понадобится). Обычно Loop начинается

Код:

<?php while (have_posts()) : the_post(); ?>

и заканчивается

Код:

<?php endwhile; endif; ?>

4. Вставляем на освободившееся место то, что нам нужно.

5. В админке создаем страницу «Тестовая страница», выбрав в качестве шаблона «Test template». (Если всё сделано правильно, в правой колонке появится выбор шаблона.) Слаг (ярлык, короткую сслыку) страницы делаем «test».

И второй рекоммендуемый вариант :

«Подключение внешней страницы в Ваш сайт Wp», это может быть и форум и всё, что угодно.
Рассмотрим на примере подключения страницы яндекса
1. Заходим в папку с темой Ваше и ищием там файл index.php
2. Копируем этот файл в эту же папку с темой, только назовём его yandex.php
3. Открываем файл в блокноте, ищеи там <?php include (TEMPLATEPATH . ‘/theloop.php’); ?> и заменяем TEMPLATEPATH . ‘/theloop.php’ на ‘http://www.yandex.ru’ не потеряйте две ‘   ‘  это важно.
4. В самое начало этого же файла вставляем

<?php
/*
Template Name: yandex
*/

Вместо yandex здесь можно написать любое название темы или файла, в общем как Вы будете в адльнейшим из админки опознавать, что это именно, то, что Вам нужно.
Сохраняем.
Заливаем этот файл на сервер в папку с темой
5. Заходим Админка-Управление страницами-Создать страницу и в пункте Шаблон страницы выбираем там, то название которое вы указали в строке Template Name: yandex
Сохраняетесь.

<?php include (TEMPLATEPATH . '/theloop.php'); ?>   — таких вещей в шаблоне у меня не обнаружилось.

Зато вьехал что такое цикл (Loop) и что подним подразумевалось.

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<div class="title  clearfix">
<div class="date">
<p class="day"><?php the_time('j') ?></p>
<p class="month"><?php the_time('M') ?></p>
<p class="year"><?php the_time('Y') ?></p>
</div>
<h1><a href="<?php the_permalink() ?>" rel="bookmark" title="Постоянная ссылка на запись: <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>
<small>Разместил: <?php the_author() ?>. Рубрика: <?php the_category(', ') ?> | <?php edit_post_link('Изменить', '', ' | '); ?>  <?php comments_popup_link('Нет комментариев &#187;', '1 комментарий &#187;', '% коммент. &#187;'); ?></small>
<br class="endOfSection" />
</div> <!-- title -->
<div class="entry">
<?php the_content('<p class="more">Читать запись полностью &raquo;</p>'); ?>
<br class="endOfSection" />
<small><?php comments_popup_link('Нет комментариев &#187;', '1 комментарий &#187;', '% коммент. &#187;'); ?> </small>
<a class="backToTop" href="#" title="Back To Top">&nbsp;</a>
</div>
</div>  <!-- / POST -->
<?php endwhile; ?>
<div class="navigation">
<div class="alignleft"><?php next_posts_link('&laquo; Предыдущие записи') ?></div>
<div class="alignright"><?php previous_posts_link('Новые записи &raquo;') ?></div>
</div>
<?php else : ?>
<h2 class="center">Не найдено</h2>
<p class="center">Извините, но того, что Вы искали, тут нет.</p>
<?php endif; ?>

Вот такой кусок кода из index.php шалона и есть цикл (Loop). Удаляем его, а на его месте пишем свой код.

Да, у меня не заработало пока не определил в Настройках WordPress Главную страницу сайта.