Author Archives: Pashaster

About Pashaster

Создатель и основной автор данного проекта. Профессиональный разработчик с 4-летним стажем.

Как сделать поддомен сайта: пошаговая инструкция

kak-sozdat-poddomen-sajtaДоброго времени суток! :-)

Сегодняшняя статья будет посвящена тому, как создать поддомен сайта на хостинге.

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

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

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

А данная ситуация, стоит сказать, — не редкость, т.к. данное ПО весьма распространено благодаря своей низкой цене и широким возможностям.

Кстати, если вы до сих пор выбираете хостинг провайдера, то рекомендую обратить внимание на TheHost — пользуюсь его услугами уже в течении 2 лет и за всё это время проблем не возникало: сайт стабильно доступен, техподдержка работает оперативно, а цены, пожалуй, самые низкие на рынке.

Поехали!

Как сделать поддомен на сайте — инструкция

Сразу скажу, что процесс регистрации поддомена сайта недолгий и, благодаря наличию панели администрирования, займёт максимум минут 10.

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

Распишу все действия пошагово.

Шаг 1

Заходим в панель управления сервером, в нашем случае, ISPManager, адрес которой будет содержаться в письме, пришедшее вам после регистрации на thehost.ua и заказа услуги (хотя бы бесплатного хостинга с целью ознакомления с кабинетом пользователя).

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

Шаг 2

Выбираем пункт меню WWW домены и вверху открывшейся страницы нажимаем на кнопку «Создать»:
sozdanie-poddomena-ispmanager

После этого у нас откроется окно, содержащее настройки домена.

Шаг 3

Выглядит оно следующим образом:

kak-sdelat-poddomen-sajta-nastrojki-v-ispmanager

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

Также можно вручную указывать каталог, в котором сайт будет размещаться на сервере.

По умолчанию же он создаётся в корневой папке www, где размещаются все сайты после создания. Т.е. поддомены будут располагаться на одном уровне с основными доменами.

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

После ввода необходимых настроек нажимаем ОК.

Шаг 4

В итоге, на сервере создался каталог с дефолтным набором файлов, состоящим из заглушки и заготовки файлов robots.txt и .htaccess, а также доменное имя поддомена добавилось в список всех WWW доменов.

Через некоторое время после создания сайт будет доступен в браузере. Данная пауза вызвана временем обновления глобальной базы DNS, в которой содержатся все сайты, доступные через Интернет. Может пройти до 24 часов.

Ну, и после, всё, что останется для запуска сайта на поддомене — это подключиться к серверу по FTP или SSH (доступен на определённых тарифных планах) и залить файлы сайта в созданный каталог, удалив заглушку и прочие ненужные стандартные файлы.

Как создать поддомен в ISPManager — нюансы

Описанный выше способ позволяет сделать поддомены на домене, который полностью готов к использованию. Однако, у нас нет никакой возможности управлять его DNS записями (назначать почтовые, NS сервера и многие другие).

Если у вас возникнет такая необходимость в дальнейшем, то создать DNS запись для существующего WWW домена в ISPManager можно следующим образом:

kak-sozdat-poddomen-sajta-na-hostinge

Как видите на скриншоте, для этого необходимо зайти в ISPManager и выбрать пункт меню Доменные имена (DNS). После этого нажимаем на кнопку «Создать» вверху страницы и вводим необходимую информацию в появившемся окне.

На скриншоте представлен пример моей конфигурации для поддомена ssl.cccp-blog.com, который создавал в ходе написания данной статьи.

Как видите, здесь же можно автоматически создавать и WWW домен, который мы делали ранее. Для того, чтобы зарегистрировать поддомен, достаточно лишь поставить галочку в поле Создать WWW домен.

Поскольку в нашем случае WWW домен уже добавлен, я оставил данное поле пустым.

Нажимаем «ОК» — и доменная DNS запись создана.

После того, как она будет доступна в списке, доступ к DNS данным можно получить следующим образом:

kak-sdelat-poddomen-sajta-upravlenie-dns-zapisyami

После того, как вы нажмёте на кнопку Записи, перед вами откроется страница со списком всех DNS записей, доступных для выбранного домена, которая выглядит так:

kak-sozdat-poddomen-sajta-dns-zapisi

На данном экране доступен весь список DNS записей, которые можно удалять, править и добавлять новые с помощью кнопок вверху страницы.

Также через интерфейс ISPManager возможно настроить создание поддоменов сайта автоматически. Данную опцию можно выбрать при настройке WWW домена, скрин с которыми был представлен в статье ранее.

Благодаря этой опции у нас появится возможность делать динамические поддомены без манипуляций в ISPManager.

Там присутствовал пункт Авто поддомены, у которого значения были оформлены в виде выпадающего списка. По умолчанию выбрано значение «Отключены», но также доступны «В отдельной директории» и «В поддиректории WWW домена».

При выборе необходимого значения создать поддомен сайта можно будет путём добавления соответствующего каталога прямо на сервере. Сделали папку — и динамический поддомен готов. Круто, правда?

Однако, в данной ситуации, у нас не будет доступа к настройкам DNS записей поддомена и прочих, которые позволяет производить ISPManager в своём интерфейсе.

Собственно говоря, поэтому я и отключил создание автоматических поддоменов в ISPManager для своего сайта ssl.cccp-blog.com.

Кстати, заливать файлы на сервер можно не только через привычные FTP клиенты, входящие в джентельменский набор программ для создания сайтов, но и через интерфейс самого ISPManager:

sozdanie-poddomena-fajlovyj-manager

На скриншоте выше представлено содержимое моего тестового поддомена сайта ssl.cccp-blog.com, в который я решил установить чистую версию WordPress для дальнейших экспериментов.

А они продолжатся уже в следующей статье, в которой я буду устанавливать SSL сертификат на WordPress сайт.

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

Удобная штука, чтобы быстро и просто сделать бэкап файлов сайта.

Индексация поддоменов

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

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

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

Настройки индексирования поддоменов проще всего производить с помощью robots.txt.

На многих хостингах, при создании нового сайта через панель администрирования (ISPManager, VestaCP), помимо HTML заглушки, зачастую добавляется ещё и robots.txt со следующим содержимым:

User-agent: *
Allow: /

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

User-agent: *
Disallow: /

Также не лишним будет добавить следующую конструкцию в head секцию HTML кода страниц, которые вы хотите запретить индексировать:

<meta name="robots" content="noindex, nofollow">

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

Даже если вы преследуете противоположную цель: открыть все страницы для индексации сайта, расположенного на поддомене, вам также придётся залезть в HTML код для лучшей индексации и выдачи правильных версий сайта при поисковых запросах.

При добавлении поддомена сайта с мобильной версией нужно будет в HTML коде страниц мобильной версии добавить каноническую ссылку на соответствующую страницу основной версии:

<link rel="canonical" href="//www.site-main.com/page.html">

А на странице основного сайта нужно будет добавить следующий код для указания мобильной версии контента:

<link rel="alternate" href="//m.site-main.com/page.html">

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

На страницу с локализованным контентом добавляем каноническую ссылку на страницу основного сайта:

<link rel="canonical" href="//www.site-main.com/page.html">

А на основном добавляем следующий код для указания версии данной страницы на определённо языке.

Например, для указания английской версии страницы на основном сайте нужно будет добавить следующую конструкцию в head секцию HTML кода страницы:

<link rel="alternate" hreflang="en-US" href="//en.site-main.com/page.html">

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

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

Вот, что говорит сам Google по данному поводу:

Эти атрибуты помогают роботу Googlebot найти ваш контент, а нашим алгоритмам – определить взаимосвязь между обычными и мобильными страницами вашего сайта. Когда вы используете разные URL для одного и того же контента в различных форматах, атрибуты сообщают системе, что эти два URL содержат одинаковый контент и их следует считать одним объектом, а не двумя. Если обычная и мобильная версии страницы интерпретируются как независимые объекты, то в результатах Поиска на ПК могут присутствовать оба URL. В таком случае их рейтинг будет ниже, чем если бы роботу Google было известно об их взаимосвязи.

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

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

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

На этом у меня всё.

До новых встреч! :-)

Что такое поддомен сайта: 5 примеров

chto-takoe-poddomenДоброго времени суток! :-)

Сегодняшняя статья будет посвящена поддоменам. Мы поговорим о том, что такое поддомен сайта и в каких ситуациях он может применяться.

Сразу скажу, что создание поддоменов — процесс очень простой и абсолютно бесплатный. А на большинстве хостингов регистрировать их можно неограниченное количество (на VPS так уж точно).

Поэтому иногда использование поддоменов даже предпочтительнее регистрации новых доменных имён сайтов.

А вот насчёт минусов поддоменов… Об этом мы сегодня подробно и поговорим, рассмотрев попутно что такое поддомен сайта вообще, какие у него есть особенности и где его создание может быть полезным и вредным.

Поехали! :-)

Что такое поддомен сайта?

Думаю, что о том, что такое домен, вы в курсе? Нет, речь сейчас пойдёт не о владениях королей и феодалов в Средние века :-)

Речь пойдёт о доменных именах сайтов, которые служат для идентификации ресурсов в сети Интернет. Доменные имена всех существующих сайтов составляют общее пространство имён Интернета, которое работает благодаря DNS (система доменных имён).

DNS позволяет узнавать имя хоста (сайта) по его IP, информацию о маршрутизации почты и т.д.

Доменные имена сайтов состоят из нескольких доменов.

К примеру, доменное имя сайта example.com состоит из доменов com и example, разделённые точкой. В этой ситуации com будет доменом первого уровня, а example — второго уровня.

Т.е. example будет поддоменом домена com.

Таким образом, поддомен (субдомен, дочерний домен) — это домен, который является частью домена более высокого уровня.

Согласно Wikipedia, максимальное количество уровней поддоменов — 127, и каждый из них может содержать 63 символа, пока общая длина доменного имени не достигнет длины в 255 символов.

Маленькая ремарка. Первый слева домен доменного имени сайта называют именем сайта, а всё, что справа — доменной зоной. Возвращаясь к нашему примеру, example — это имя сайта, а com — доменная зона

Что такое субдомен в общем, думаю, понятно. Что же будет являться поддоменом сайта?

Поддомен сайта — это отдельный сайт, доменное имя которого содержит доменное имя основного сайта. Т.е. доменное имя основного сайта будет являться доменной зоной его поддомена.

Возвращаясь к нашему примеру, сайт с доменным именем new.example.com будет поддоменом сайта example.com. Разбирая его, как мы делали это раньше, new будет именем сайта и доменом третьего уровня, а example.com — доменной зоной.

Доменное имя основного сайта будет являться доменной зоной его поддомена… Что-то слишком часто встречается слово «домен» в этой фразе.

Это раздражает не только людей при чтении, но и поисковые системы при ранжировании страниц таких сайтов в результатах поиска.

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

Нужны ли поддомены тогда вообще и где они могу пригодиться? Давайте порассуждаем… :-)

Для чего нужны поддомены?

Итак, зачем нужны поддомены и в каких ситуациях их лучше использовать, если поисковики такие ресурсы не жалуют?

1. Тестовый сайт

Создание субдоменов может быть вам полезно в ситуациях, когда необходимо протестировать какой-либо функционал в «полубоевых» условиях, т.е. на реальном проекте (production, продакшене, проде), но без нанесения ему вреда.

В таких ситуациях создают препрод окружение, представляющее собой копию основного сайта, и размещают его на поддомене. Чаще всего, это test.site.com или dev.site.comstg.site.com, когда тестовых окружений несколько (DEV и STAGE).

2. Тренировочный сайт

Иногда сделать поддомен на сайте может быть отличной идеей, когда вам нужно просто с чем-то потренироваться.

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

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

3. Внутренний ресурс

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

Например, у вас есть блог, и вы хотите продавать какую-то смежную продукцию (курсы или свои творения, шаблоны для сайтов и плагины, например).

Делать отдельный сайт на отдельном доменном имени в данном случае не рекомендуется, т.к. придётся долго объяснять пользователям, какое отношение новый ресурс имеет к основному (если вы, конечно, не хотите скрыть эту связь намеренно).

Если же в его URL будет присутствовать указание основного сайта, то вопросы о связи отпадут.

4. Мобильная версия сайта

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

Все вы, наверное, обращали внимание на то, что при входе на различные крупные ресурсы с мобильного телефона у вас в браузере отображается не его URL, а нечто подобное: m.site.commobi.site.commobile.site.com.

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

Но при SEO продвижении сайта нужно будет учитывать некоторые нюансы, т.к. продвигаться будут, по сути, два разных сайта.

5. Региональная версия сайта

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

Например, ru.site.comua.site.comkz.site.com и т.д. Наличие таких поддоменов может привлечь больше трафика на сайт благодаря большему числу страниц в поисковом индексе.

Может сложиться такая ситуация, что весь ТОП-10 поисковой выдачи будет состоять из страниц основного сайта и его поддоменов. Тогда пользователь гарантированно попадёт к вам :-)

Нужен ли поддомен при SEO продвижении?

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

Да даже те профессиональные SEO оптимизаторы, статьи которых я изучал, не могут дать однозначный ответ.

Одни говорят, что, благодаря созданию поддоменов можно иметь больше страниц в поисковом индексе и в перспективе занять весь ТОП-10.

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

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

Особенно, учитывая нелюбовь поисковикам к поддоменам в общем.

Но все SEO-шники в своих советах сходятся в одном — экспериментировать :-)

Собственно говоря, на этом принципе и построено SEO в общем, т.к. поисковики секретов своего ранжирования не выдают.

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

Так что, если у вас опыт экспериментов с поддоменами для SEO продвижения сайтов — не ленитесь делиться им в комментариях со всеми для улучшения кармы :-)

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

Пишите ваши отзывы, предлагайте новые темы для статей и делитесь информацией со своими друзьями в социальных сетях.

На этом всё.

Удачи и до новых встреч! :-)

Переезд на HTTPS: инструкция, проблемы и рекомендации

perekhod-na-httpsПриветствую вас, друзья!

Сегодня я продолжу тему, начатую мною в предыдущих статьях и посвящённую теме HTTPS и SSL сертификатов, которая активно обсуждается в сети последние года три.

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

В частности, сайтам с HTTPS обещались более высокие позиции в данной поисковой системе.

Тогда же начался массовый переход на HTTPS существующих сайтов, который и продолжается по сей день.

Однако, данный процесс несёт не только пользу, как может показаться, но и массу проблем, особенно неподготовленным пользователям. Об этом свидетельствует неспешные темпы перевода сайтов на HTTPS, подкреплённые статистикой: всего около 30% современных сайтов работают по протоколу HTTPS.

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

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

Поехали :-)

Переход на HTTPS — проблемы

Прошу прощения, что начинаю с неприятного. Но надо же вас как-то замотивировать читать инструкцию по переезду на HTTPS :-)

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

А именно с того, к чему может привести неграмотный переезд сайта на HTTPS.

1. Недоступность сайта

Бывают такие случаи, когда после перехода на HTTPS сайт просто перестал открываться. Такое явление может возникнуть из-за большого количества редиректов с HTTP на HTTPS и их зацикленности.

При возникновении любый проблем с доступностью после перевода сайта на HTTPS изучайте сообщения в браузере и немедленно сообщайте о них технической поддержке своего хостинг-провайдера. Если там находятся квалифицированные специалисты, то в 80% случаев они вам помогут.

2. Снижение трафика

В сети полно грустных историй вебмастеров, у которых на сайтах после перехода на HTTPS упали позиции или даже некоторые страницы выпали из поискового индекса.

Причин может быть много:

  • Отсутствие 301 редиректов с HTTP адресов на HTTPS.
  • Часть страниц может быть на HTTP, а часть на HTTPS (смешанное содержимое от англ. mixed content). Ещё одной причиной считать содержимое сайта смешанным является наличие HTTP ссылок на страницах, работающих по HTTPS протоколу.
  • Ссылки в sitemap могут быть с учётом HTTP.
  • После перехода на HTTPS новый адрес сайта не был добавлен в кабинетах вебмастера Google и Яндекс.
  • Версия сайта на HTTPS не была отмечена как основная, а старый сайт не был помечен как зеркало. Из-за этого позиции могут понижаться вследствие дублирования контента и разбавления ссылочной массы между двумя доменами.

3. Неправильная работа сайта

Может проявиться в том, что скрипты будут не грузиться вообще или некоторые картинки будут отсутствовать. Причина заключается в HTTP ссылках на статические ресурсы после полного переезда сайта на HTTPS.

4. Потеря статистики посещаемости

После перехода на HTTPS может возникнуть ситуация, что ваши партнёры, рефералами (referrals, affiliates) которых вы являетесь, перестанут видеть трафик с вашего сайта через популярные сервисы аналитики: Google Analytics, Яндекс. Метрика и другие.

Особенно эта проблема может стать актуальной для людей, зарабатывающих на своих сайтах путём размещения баннеров и ссылок, получая доход за переходы и действия, произведённые пользователями при переходе по ним.

Таким образом, после переезда сайта на HTTPS из-за данной проблемы вы просто можете потерять свои деньги, а ваш рекламодатель увидит следующую картину переходов с вашего сайта:

kak-perevesti-sajt-na-https-i-ne-poteryat-trafik

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

Поэтому ваш сайт может просто выпасть из данной цепочки.

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

А решения?… Что делать, шеф? :-)

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

Как перевести сайт на HTTPS — инструкция

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

1. Установка SSL сертификата на сервер

Переезд сайта на HTTPS начинается с покупки и установки SSL сертификата.

Тут всё просто: выбираем подходящий сертификат, покупаем его, устанавливаем на сервер и подключаем к своему сайту.

О том, зачем нужен SSL сертификат, какие виды SSL сертификатов существуют на сегодняшний день, чем они отличаются и сколько стоят, подробно написано в статье о том, что такое HTTPS, ссылку на которую я привёл в самом начале статьи.

2. Настройка движка сайта

После установки SSL сертификата, для корректной работы по новому протоколу в коде самого сайта и его настройках нужно будет произвести ещё кое-какие изменения.

Первым делом, нужно будет указать, что URL сайта отныне содержит не HTTP, а HTTPS протокол. Такие настройки требуются в большинстве CMS для создания правильных внутренних ссылок, которые являются относительными.

Также важно будет проверить, чтобы существующие страницы сайта корректно открывались по URL с учётом HTTPS протокола.

3. Сообщить поисковикам об изменениях

После этого нужно сообщить поисковикам о том, что сайт перешёл на HTTPS протокол. Для индексации новых URL страниц c учётом HTTPS протокола, необходимо сообщить об их наличии поисковым роботам с помощью так называемых «аддурилок»:

  • Яндекс: https://webmaster.yandex.ru/addurl.xml
  • Google: https://www.google.com/webmasters/tools/submit-url
  • Bing: https://www.bing.com/toolbox/submit-site-url

4. Изменение главного зеркала

У Яндекса и других поисковых систем есть такое понятие, как «зеркало». Зеркалами считаются копии сайтов, среди которых есть главное зеркало – сайт, страницы которого как раз присутствуют в поисковой выдаче.

Процесс переноса ссылочного веса с зеркал на главное называется склейкой зеркал и занимает до нескольких месяцев. На скорость, к сожалению, повлиять никак нельзя, остаётся только ждать.

Главное зеркало сайта устанавливается вручную в кабинетах вебмастеров Google, Яндекс и Bing. При переносе сайта на HTTPS главным зеркалом сайта должна быть именно HTTPS версия. Также указать главное зеркало можно с помощью robots.txt, прописав в нём (или изменил) директиву Host, которая должна выглядеть так:

Host: https://site.com

А также главное зеркало сайта можно указать с помощью 301 редиректа, которые всё равно будут необходимы для переноса веса с HTTP URL страниц на HTTPS.

5. Изменение внутренних ссылок

Параллельно с добавлением HTTPS адресов страниц в аддурилки и настройкой главного зеркала необходимо проверить внутренние ссылки на сайте. Причём, это должны быть не только перекрёстные ссылки внутри статей, но и URL статических файлов (картинок, JS и CSS файлов).

Если ссылки прописаны в абсолютном виде, то нужно будет заменить в них протокол HTTP на HTTPS.

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

Могут быть как относительно протокола в следующем виде:

//site.ru/page.html

Так и относительно корня сайта:

/page.html

Лучше делать изменение внутренних ссылок при помощи специальных скриптов, которые помогут найти и заменить ссылки как в коде сайта, так и в БД, автоматически.

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

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

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

Стоит также учесть, что при использовании сторонних библиотек по CDN или иным другим способом, когда в коде сайта располагается ссылка на них, нужно также заменить их с учётом HTTPS протокола. Либо заменить абсолютные HTTP адреса относительными.

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

6. Установка 301 редиректов с HTTP на HTTPS адреса страниц

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

Сделать это можно при помощи специальных плагинов и пакетов (для того же WordPress HTTPS плагинов существует уйма). Либо даже с помощью средств языков программирования.

Но самым быстрым и простым вариантом является организация 301 редиректа на уровне веб сервера с помощью специальных директив в их конфигурационных файлах.

Если ваш сайт работает на Apache сервере, то добавьте в файл .htaccess, который должен располагаться в корне сайта (или создайте его) следующий код:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{HTTPS} off
    RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
    RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
    RewriteRule ^ https://%1%{REQUEST_URI} [R=301,L]
</IfModule>

Если же вы используете Nginx, то вам потребуется следующая конструкция:

server {
    listen 80 default_server;
    listen [::]:80 default_server;
    server_name example.com www.example.com;
    return 301 https://$server_name$request_uri;
}

Яндекс рекомендует устанавливать 301 редиректы после полной склейки зеркал, т.к. при установке редиректов страницы могут исключаться из поисковой выдачи.

7. Изменение внешних ссылок

Если вас ресурс существует достаточно долго, то, скорее всего, в Интернете можно отыскать ссылки на него с других ресурсов. Будь то обычные посты в социальных сетях или покупные ссылки, которыми вы увеличивали свой ТИЦ за деньги.

Естественно, что все они прописаны с учётом HTTP протокола, который было бы хорошо изменить на HTTPS. Но если у вас нет возможности это сделать, то сильно не огорчайтесь, т.к. при склейке доменов ссылки на любое зеркало сайта учитываются поисковиками для главного зеркала.

Таким образом, старые ссылки будут продолжать работать, передавая веса и ТИЦ.

8. Проверка канонических ссылок

Если вы используете на своём сайте канонические ссылки для исключения дублирования контента (работают для поисковиков как и 301 редирект), то необходимо на них всех поменять url с HTTP на HTTPS:

<link rel="canonical" href="https://site.com/url">

Напомню, что чаще всего такие конструкции располагаются в секции head HTML кода страницы. Однако, могут присутствовать и в других местах, например, на элементах пагинации, которые сами, в свою очередь, могут быть оформлены следующим образом:

<link rel="prev" href="https://site.com?page=1">
<link rel="next" href="https://site.com?page=2">

Если ссылки у них будут указаны также с учётом HTTP протокола, то их также нужно будет перевести с HTTP на HTTPS.

9. Правки на мультиязычных сайтах и в пагинации

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

<link rel="alternate" hreflang="ru" href="https://site.com/">

Если таковая присутствует, то необходимо будет перевести страницу на HTTPS, т.е. изменить её URL с учётом данного протокола.

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

10. Коррективы sitemap.xml

При проверке URL внутренних ссылок не забудьте заглянуть в XML карту сайта или плагины, которые её формируют, и проверить, чтобы она отныне содержала только HTTPS ссылки.

В принципе, если в ней будут URL, указанные через HTTP, то благодаря правильно настроенным 301 редиректам роботы всё равно попадут на итоговую страницу, но это приведёт к наличию у вас на сайте большого числа редиректов, что не останется без внимания поисковиков и снизит скорость загрузки контента.

Также в robots.txt нужно поменять ссылку на саму sitemap.xml с учётом нового протокола HTTPS:

Sitemap: https://site.com/sitemap.xml

11. Сохраняем реферальный трафик

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

Оно заключается в добавлении мета тега referer, с помощью которого задаётся содержимое заголовка Referer HTTP запроса, отправляемого пользователем вашего сайта через браузер. В идеале там должен содержаться URL сайта, на котором находился юзер при отправке запроса.

По умолчанию, при передаче запросов браузеры руководствуются реферальной политикой No Referrer When Downgrade, которая подразумевает передачу реферальных данных (ссылки на ресурс, с которого запрос был инициирован) только с HTTPS на HTTPS ресурс.

При передаче с HTTPS на HTTP заголовок не будет содержать никаких данных и запрос будет считаться прямым, т.е. когда пользователь ввёл URL сайта вашего партнёра прямо в браузере.

Сразу хочу уточнить, что в значении Referer заголовка будет находиться URL без параметров.

Итак, чтобы изменить данное поведение, нужно в HTML коде необходимых страниц (лучше всего, конечно, сделать это для всего сайта) разместить следующую конструкцию в секции head:

<meta name="referrer" content="значение_параметра">,

Наиболее часто используемыми на практике являются следующие значения параметров:

  • no-referrer — реферальные данные не будут передаваться;
  • no-referrer-when-downgrade — значение по умолчанию: ссылка источника будет передаваться только сайтам, поддерживающим HTTPS протокол, как и на вашем; сайтам, работающим по HTTP, ничего не будет передаваться;
  • origin — реферальные данные будут передаваться не зависимо от протокола и при переходе как с вашего основного сайта, так и с его поддоменов;
  • origin-when-crossorigin — при внутренних запросах, т.е. когда переход на URL произошёл пользователем с этого же сайта, будет передаваться полный адрес страницы; в случае же запроса с другого сайта заголовок будет пуст;
  • unsafe-url — реферальные данные будут передаваться в любом случае: и при внутренних запросах, и при перекрёстных;

Со списком всех политик безопасности и их описанием (правда, на английском) вы можете познакомиться здесь — https://www.w3.org/TR/referrer-policy/#referrer-policies

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

<meta name="referrer" content="origin">

После произведения действий, описанных в данной инструкции по правильному переходу на HTTPS сайтов с HTTP, всё, что вам останется — ждать. Ждать полной переиндексации сайта и замещения страниц из поиска с HTTP урлами на HTTPS аналоги.

К сожалению, даже если вы всё сделаете верно, стоит готовиться к кратковременному снижению трафика, т.к. 301 редиректы передают от 85% до 99% ссылочного веса. Трафик может восстанавливаться несколько месяцев.

Также не удивляйтесь тому, что при переходе на HTTPS пропал ТИЦ или данный показатель значительно снизился.

Не волнуйтесь, со временем показатели восстановятся, а трафик может даже и увеличиться благодаря сегодняшней лояльности поисковиков к HTTPS сайтам. Но, как уже говорилось, должно пройти время.

Переезд на HTTPS — снова проблемы…

Аффтар жжот :-) Только привёл инструкцию, как избежать проседания трафика и прочих проблем переезда сайта на HTTPS — и снова здрасьте… Какие ещё проблемы?

К сожалению, список трудностей, которые могут возникнуть при переходе с HTTPS на HTTP, не ограничивается перечнем, приведённым в начале.

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

Некоторые из них вызваны особенностями самого защищённого протокола HTTPS, о чём я и захотел поговорить с вами насполедок.

1. Частичная недоступность

Обычно проявляется следующим сообщением об ошибке HTTPS подключения к сайту в браузере:

oshibka-prosrochennogo-sertifikata-pri-perehode-na-https

Причина: В принципе, ничего страшного в данном явлении нет, т.к. сообщение появляется при использовании самоподписанного SSL сертификата или когда истёк срок действия сертификата.

Но пользователи, в большинстве своём, — люди простые :-) Просто берут и закрывают сайт в поисках «безопасной» альтернативы.

Естественно, данное поведение не пройдёт незамеченным мимо поисковиков, которые пристально следят за временем нахождения юзеров на страницах сайта, от чего зависят ваши позиции в выдаче.

Решение: Своевременно оплачивайте сертификат или просто переоформляйте его при использовании бесплатного. Многие хостинги, кстати, предоставляют своим клиентам скрипты для автоматического переоформления бесплатных сертификатов от Let’s Encrypt.

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

Кстати! Такая ситуация может возникнуть ещё и тогда, когда недобросовестный регистратор подсунул вам «левый» сертификат. Поэтому при возникновении данных проблем обязательно сообщитетем,  у кого вы купили ваш SSL сертификат.

2. Страницы сайта стали дольше загружаться

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

Причина: Заключается в наличии операций по шифрованию и дешифровке трафика при передаче по протоколу HTTPS.

Решение: К сожалению, бороться с этим не получится, да и бессмысленно, т.к. это нюансы технологии. Как вариант – заняться переоптимизацией сайта там, где это возможно (организовать серверное кэширование, минимизировать размер картинок и других статических файлов – html/css/js).

3. Потеря статистики социальных сигналов (репосты, лайки и т.д.)

Переезд на HTTPS сулит и ещё одну проблему, которая заключается в обнулении счётчиков лайкнувших и зарепостивших вас пользователей. Мелочь, вроде бы. Но, в некоторых случаях, данный нюанс может создать серьёзные проблемы для бизнеса.

Причина: Это происходит из-за того, что статистика считается для конкретного домена. Поскольку сайт при переходе с HTTP на HTTPS, фактически, изменил свой url, то вся статистика будет утрачена и начнёт считаться заново.

Решение: К сожалению, с этим ничего нельзя сделать, пока разработчики социальных сетей не внесут в свои продукты соответствующие изменения. А пока они этого не сделали, вы можете воспользоваться плагинами. Например, для WordPress существует замечательный плагин от WarfarePlugins, позволяющий сохранить статистику социальных сигналов при переходе сайта на HTTPS.

Но данный функционал, естественно, не является основным. Это, скорее, бонус. Основное предназначение расширения — увеличение социальной активности ваших пользователей, что неминуемо приведёт к увеличению трафика.

Минусов у него всего два: плагин на английском и он платный, но цена не заоблачна и составляет единоразовые 30$. В принципе, вы заплатите эти же деньги или даже больше, если будете обращаться к фрилансерам с подобной просьбой.

Как перейти на HTTPS — рекомендации

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

Однако, есть способы минимизировать этот эффект и сделать так, что ваш бизнес понесёт при этом незначительные потери.

Для этого есть несколько рекомендаций.

1. Переход в период снижения посещаемости

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

А если вдруг ресурс будет некоторое время вообще недоступен, то вы потеряете меньше клиентов, чем в период продаж.

Для большинства ресурсов период застоя – с начала мая до донца сентября, т.к. у большинства людей в данное время отпуска.

Однако, всё равно, для каждой тематики и ресурса он свой, поэтому анализируйте свой годовой трафик, чтобы вычислить подходящее время для перевода сайта на https.

2. Использование сервисов для мониторинга ошибок перехода на HTTPS

В самом начале статьи были рассмотрены проблемы, возникающие при переезде сайтов на HTTPS, а также некоторые их причины. Даже если проблему вы и сможете самостоятельно определить, то проработать абсолютно все причины её возникновения вручную будет весьма долго и затруднительно для неопытных пользователей.

Поэтому я советую анализировать сайт с использованием специальных сервисов незамедлительно после установки SSL сертификата на сервер, настройки движка сайта и 301 редиректов. Таким образом, вы сможете узнать о возникших проблемах при переходе с HTTP на HTTPS раньше Яндекса и Google, что позволит вам избежать проседания трафика.

Одним из таких сервисов является Serpstat, который предоставляет следующую аналитику ошибок SSL сертификата и HTTPS соединения в целом:

proverka-ustanovki-ssl-sertifikata-i-oshibok-perevoda-sajta-na-https

Как видите, здесь происходит проверка установки SSL сертификата и наличия типичных ошибок, которые могут возникнуть при переходе на HTTPS, приведённые в самом начале статьи. И хорошо, что на моём тестовом сайте они не были обнаружены.

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

Большой плюс данной аналитики от Serpstat в том, что ошибки подробно описываются, и предлагаются способы их решения. Поэтому очень рекомендую :-)

3. Настройка HTTPS соединения на копии сайта

Поскольку неправильный перенос сайта на HTTPS чреват многими проблемами, то я, как веб разработчик, хочу дать чисто профессиональный совет :-)

Он заключается в тестировании изменений, а в данной случае, настройке HTTPS соединения, на локальном веб-сервере или копии сайта на одном тестовом поддомене сайта, а не в «продакшене».

Это немного растянет процесс переезда на HTTPS по времени, но зато у вас будет 100% гарантия того, что после переноса сайта на основной домен поисковые роботы сразу будут индексировать контент правильно.

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

В процессе вас ещё что-то отвлекло… И, в итоге, когда вы доделаете всю работу, у вас есть все шансы обнаружить в кабинетах вебмастеров Google, Яндекс и Bing кучу ошибок, из-за которых позиции вашего сайта в выдаче уже начали падать.

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

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

Единственное, в случае работы с копией сайта, приведённая ранее инструкция будет слегка отличаться.

Сперва я рекомендовал бы скопировать сайт и подключить к нему SSL сертификат на сервере. Затем я бы откорректировал все внутренние ссылки и сделал бы 301 редиректы. Исправил бы robots.txt и добавил бы канонические тэги.

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

Спрашивается: а что делать, если сертификат был куплен на одно доменное имя? Как его использовать на тестовом поддомене?

Всё просто: купленый сертификат устанавливаем на сервере, где будет размещаться основной сайт, а также подключаем его к основному домену. Для тестового можно использовать бесплатный SSL сертификат от Let’s Encrypt либо самоподписанный.

Ну, а если вы купили Wildcard сертификат или вообще мультидоменный, то проблем с этим нюансом у вас не будет в принципе.

Как видите, проблем может возникнуть масса. Особенно у «матёрых» сайтов с большой посещаемостью и историей, которые сегодня активно переходят на HTTPS.

Но, если вы только собираетесь создавать сайт и лишь «прощупываете почву» по поводу HTTPS и SSL сертификатов, то я бы однозначно рекомендовал бы устанавливать их с самого старта проекта, чтобы избежать трудностей перевода в будущем :-)

И вот, почему…

Перевод сайта на HTTPS — выводы

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

Дело даже не в возросшем уровне киберпреступности, а в том, что компания Google, являющаяся владельцем крупнейшего в мире одноимённого поисковика, постоянно стимулирует вебмастеров делать перевод с HTTP на HTTPS своих ресурсов на данный протокол.

Последним новшеством стала отметка сайтов, работающих по HTTP протоколу, как небезопасных, в Google Chrome, начиная с 29 января 2017 года и 56 версии браузера.

А, учитывая, что сегодня Google Chrome используют более 55% всех пользователей Интернет, то существует большая вероятность, что те из них, кто ничего не знает о данной особенности браузера и HTTPS протоколе в целом, просто уйдут с вашего сайта в поисках «безопасного».

Правда, данные санкции касаются не всех сайтов, а только тех, где имеются формы для ввода информации пользователем.

Блогов, похоже, это не коснётся, т.к. данный сайт отображается в Google Chrome 59 в штатном режиме без всяких предупреждений.

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

И чем раньше вы его сделаете, тем лучше.

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

Поэтому вполне возможна ситуация, когда переезд сайта на HTTPS с HTTP  приведёт к росту посещаемости практически с первых дней, как это произошло на этом сайте:

uvelichenie-trafika-posle-pereezda-na-https

Главное следовать изложенной в статье пошаговой инструкции как перевести сайт на HTTPS и руководствоваться рекомендациями в процессе.

Пишите свои отзывы в комментариях, делитесь своим опытом переезда на HTTPS и указывайте мне на мои ошибки. Это тоже нужно :-)

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

Всем удачи и до новых встреч!

Импорт базы данных MySQL в консоли

import-bazy-dannyh-mysqlДоброго времени суток, коллеги :-)

Сегодня я продолжу знакомить вас с работой с MySQL в консоли и командной строкой MySQL.

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

Логическим продолжением этого повествования будет восстановление БД и хранящейся в ней информации с помощью операций импорта базы данных MySQL. И, что немаловажно, мы продолжим делать это с помощью инструмента всех трушных разработчиков — через консоль.

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

Но, перед тем, как мы приступим к обзору способов и инструментов, немного философии на тему «Что такое импорт базы данных MySQL, каким он бывает и как его лучше всего делать?».

Потерпите 😉

Импорт базы данных MySQL: что и зачем?

Итак, импорт, как и экспорт БД MySQL, бывает двух видов информации, хранящейся в базе:

  1. структуры базы, её таблиц и хранимых в них данных (в простонародье именуемых дампом БД);
  2. просто данных, хранящихся в таблице либо собранных с помощью SELECT запросов.

В данной статье будут рассмотрены оба варианта.

Для восстановления из дампа MySQL базы данных с её структурой и всей хранимой информацией, как уже было сказано, нужен файл дампа БД, который представляет из себя текстовый файл с любым расширением (предварительно может быть запакован в архив для уменьшения размера), содержащий SQL команды для создания самой базы и таблиц, а также наполнения их информацией.

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

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

Для этих целей подойдёт и обычный txt файл, данные в котором будут разделены, либо файлы, создаваемые в специальных табличных редакторах (Microsoft Office Excel, OpenOffice и т.д.), имеющих отличное расширение: xls, csv, odt и др.

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

Добавление данных в MySQL: инструменты

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

Перечислю их, начиная с самых низкоуровневых, заканчивая высокоуровневыми (с точки зрения применения всяческих оболочек и надстроек):

  1. Консоль сервера и командная строка MySQL;
  2. Скрипты, написанные на языках программирования, позволяющие делать запись данных в MySQL с помощью языковых средств;
  3. Готовые программы, предоставляющие визуальный интерфейс для работы с БД (тот же самый phpMyAdmin, MySQL WorkBench, MySQL Manager и др.).

Думаю, что порядок расположения инструментов не вызовет ни у кого вопросов, т.к. средства языков программирования, как правило, работают на базе команд консоли MySQL, а программы базируются на скриптах или же работают с MySQL командной строкой напрямую.

Так или иначе, во главе всего лежит консоль, а остальные инструменты, по сути, являются её эмуляторами.

Поэтому использование консоли при импорте данных в MySQL позволяет обойти различного рода ограничения, устанавливаемые настройками языков программирования на Web сервере и самих программ (которые, кстати, не всегда возможно изменить).

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

Думаю, все, кто хоть раз пытался загрузить дамп в MySQL БД большого размера через phpMyAdmin, понимают, о чём я говорю.

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

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

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

И на этой позитивной ноте мы переходим к долгожданной практике и рассмотрим способы и команды для консольного переноса данных в базу.

Как восстановить MySQL базу из дампа через консоль?

Итак, для того, чтобы развернуть дамп MySQL из консоли есть два пути:

  1. с помощью команды в командной строке MySQL;
  2. в самой консоли сервера.

Начнём по порядку.

Итак, чтобы импортировать дамп базы данных MySQL в существующее хранилище через командную строку MySQL, нам сначала нужно её запустить и выбрать нужную базу данных, в которую мы будем заливать наш дамп.

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

После того, как вы сделаете указанное, вводим в MySQL Shell следующую команду:

source путь_и_имя_файла_дампа;

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

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

mysql -u имя_пользователя -p имя_базы_данных &lt; путь_и_имя_файла_дампа

Вот и всё. Главное — дождаться окончания импорта, если файл очень большой. Об окончании заливки дампа можно судить по тому, когда консоль сервера будет снова доступна.

Собственно говоря, в этом и заключается недостаток данного способа по сравнению с предыдущим, т.к. в первом есть возможность наблюдать за операциями, производимыми с БД во время импорта, а во втором — нет.

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

В Linux это можно сделать следующим образом:

gunzip < [имя_файла_архива.sql.gz] | mysql -u [user] -p[password] [databasename]

В Windows стандартной утилиты для распаковки архива в консоли нет, поэтому её нужно будет установить дополнительно.

Как видите, импорт дампа MySQL через консоль – операция весьма простая, которая выполняется одной командой. Так что для выполнения данной процедуры не обязательно быть разработчиком.

Если вдруг вы не знаете, как запустить консоль сервера, то можете найти эту информацию в статье о командной строке MySQL, ссылку на которую я уже располагал ранее.

Кстати, описанными способами возможен также и импорт таблицы MySQL, а не целой базы. В этом случае в заливаемом вами дампе должны присутствовать операции её создания и наполнения данными.

Загрузка данных в MySQL базу из файла в консоли

О восстановлении БД MySQL из дампа в консоли мы поговорили. Теперь самое время разобраться с тем, как аналогичным образом можно импортировать данные из файлов, в том числе из xls и csv в MySQL базу.

Для данной задачи у нас снова есть те же два инструмента, что и в предыдущем случае: командная строка MySQL и консоль сервера.

Снова начнём обзор по порядку.

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

А далее прописываем в консоли следующую SQL команду:

LOAD DATA INFILE 'путь_и_имя_файла_дампа'
INTO TABLE `таблица_базы_данных`
COLUMNS TERMINATED BY ',' ENCLOSED BY '\"'
LINES TERMINATED BY '\n';

Не забудьте, что, если сервер MySQL был запущен с опцией —secure-file-priv (что часто бывает при использовании MySQL дистрибутивов, входящих в WAMP/MAMP сборки), то имя файла нужно указывать с учётом системной переменной secure_file_priv.

О том, как узнать её значение и изменить его, подробно написано в статье об экспорте базы данных MySQL.

Для того, чтобы сделать импорт базы данных MySQL в консоли сервера, не заходя в MySQL Shell, нам пригодится утилита mysqlimport, входящая в состав дистрибутива MySQL, и следующий её вызов:

mysqlimport –u имя_пользователя –p имя_базы_данных имя_и_путь_к_файлу_импорта

Данная утилита является аналогом SQL команды LOAD DATA INFILE, только для командной строки. Но, спрашивается, почему тогда среди параметров её вызова не указана таблица, в которую будут загружаться данные из файла?

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

Т.е. если вы захотите сделать импорт из Excel таблицы в MySQL таблицу users, то ваш файл должен называться users.xls.

Расширение у импортируемого файла, как уже говорилось, может быть любым.

С помощью mysqlimport также можно загружать сразу несколько файлов xls или csv в MySQL. Чтобы данные попали по назначению, названия файлов и таблиц БД, как и в предыдущем примере, также должны совпадать.

Если вдруг в импортируемом файле столбцы идут не в той же последовательности, что и колонки таблицы БД, то для уточнения их порядка нужно использовать опцию —columns в следующем виде:

mysqlimport –u имя_пользователя –p имя_базы_данных --columns столбец1, столбец2, … имя_и_путь_к_файлу_импорта

Естественно, что в своих примерах я не рассмотрел полный список параметров mysqlimport, т.к. некоторые из них весьма специфичны и на практике используются крайне редко.

Если захотите ознакомиться с ними самостоятельно, то полный их список доступен здесь — https://dev.mysql.com/doc/refman/5.7/en/mysqlimport.html

Особенности загрузки данных в MySQL базу из дампа

Если хотите, чтобы процесс импорта большой базы MySQL проходил быстрее, то необходимо создавать дамп БД с использованием специальных опций команды mysqldump, о которых я писал в своей предыдущей статье об экспорте БД MySQL, ссылку на которую размещал в тексте ранее.

У самих команд импорта баз данных MySQL таких опций, к сожалению, нет.

Единственное, для увеличения скорости при загрузке большого дампа БД можете использовать следующую фишку.

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

2. Прописываем в начале файла следующие строки:

SET foreign_key_checks = 0;
SET UNIQUE_CHECKS = 0;
SET AUTOCOMMIT = 0;

Обратите внимание! Может быть они уже есть или закомментированы (многие программы, с помощью которых делают дампы, могут добавлять их автоматически)

3. В конце файла прописываем обратные действия:

SET foreign_key_checks = 1;
SET UNIQUE_CHECKS = 1;
SET AUTOCOMMIT = 1;

Кстати, данные команды помогут не только ускорить процесс импорта, но и сделать его возможным.

Дело в том, что, если вы хоть раз заглядывали в файл дампа для импорта БД MySQL, то могли заметить, что операция задания структуры загружаемых таблиц выглядит так:

DROP TABLE IF EXISTS `clients`;
CREATE TABLE `clients` (
…
);

Т.е. выполняется поиск в БД таблицы с таким же именем, как и у импортируемой, и если таковая найдена, то она удаляется и создаётся заново.

И если вдруг существующая таблица будет связана внешними ключами с другими, то вся загрузка провалится.

Поэтому отключение проверки существования внешних ключей и прочих – это ещё и отличная гарантия успешного выполнения процесса импорта базы данных MySQL.

Особенности импорта csv в MySQL БД и других файлов

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

Причём, в отличие от предыдущей ситуации, в данном случае прописать директивы в файл не получится, т.к. SQL команды в нём не будут восприниматься и выполняться.

В предыдущей статье об экспорте базы MySQL я уже упоминал о том, как это сделать с помощью следующей операции в командной строке MySQL:

SET FOREIGN_KEY_CHECKS=0;

Однако, там я не упомянул, что системная переменная MySQL FOREIGN_KEY_CHECKS имеет два значение: глобальное и сессионное (для текущей сессии).

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

Сессионное значение системной переменной MySQL устанавливается только на время сеанса работы пользователя с сервером MySQL. Сеанс или сессия начинается при подключении клиента к серверу, при котором ему присваивается уникальный connection id, и заканчивается при отключении от сервера, которое может произойти в любой момент (например, по таймауту).

Почему я об этом решил вспомнить?

Потому что при выполнении команд загрузки файла в MySQL БД через консоль сервера, без захода в MySQL Shell, я обнаружил, что отключение проверки внешних ключей приведённым ранее способом не работает.

В консоли всё так же выдавалось сообщение об ошибке, вызываемой наличием в таблице внешних ключей.

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

SET SESSION имя_переменной = значение_переменной;
SET @@session.имя_переменной = значение_переменной;
SET @@имя_переменной = значение_переменной;

В приведённых командах переменная явно помечается как сессионная.

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

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

Сделать это можно одним из перечисленных способов:

SET GLOBAL имя_переменной = значение_переменной;
SET @@global.имя_переменной = значение_переменной;

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

SELECT @@GLOBAL.foreign_key_checks, @@SESSION.foreign_key_checks;

На этом сегодняшняя статья, посвящённая импорту базы данных MySQL, подошла к концу. Делитесь своими впечатлениями и собственными наработками в комментариях. Думаю, что многим будет интересен ваш опыт.

Если публикация вам понравилась — вы всегда можете поделиться ею со своими друзьями в социальных сетях и сказать спасибо автору с помощью формы под статьёй.

До новых встреч! :-)

Делаем дамп базы MySQL и экспорт данных в консоли

damp-bazy-mysqlПриветствую вас, друзья! :-)

Сегодня я решил продолжить разговор о работе с MySQL в консоли и уделить внимание процедуре экспорта базы данных MySQL.

В статье я расскажу о том, как сделать дамп базы MySQL, а также производить выгрузку данных из MySQL в Excel файл и csv формат.

Мы рассмотрим различные варианты выборки информации из базы данных сайта: создание дампа одной и нескольких БД, экспорте данных из отдельных таблиц и результатов произвольных SELECT запросов.

А также поговорим о том, как сделать вывод данных из MySQL базы в консоли сервера и командной строке MySQL.

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

Во-первых, потому что по данной теме уже достаточно материала в сети. Причём качественного материала, который я не горю желанием копипастить.

А, во-вторых, я уже вкратце сам рассматривал процесс вывода информации из MySQL базы в SQL файл в одной из своих статей, где рассказывал об установке WordPress на хостинг.

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

Хочу, чтобы вы поняли меня правильно: я ни в коем случае не хочу вас обидеть, а просто желаю, чтобы вы потратили своё время с максимальной пользой для дела и получили то, что искали.

На этом вступительная часть окончена и мы переходим к обзору консольных команд для создания дампа базы MySQL, которые я решил рассортировать по объёму сохраняемых данных: начиная от экспорта всей БД, заканчивая отдельными таблицами и результатами произвольных запросов.

Создание дампа базы MySQL через консоль

Хочу в самом начале сделать небольшое уточнение.

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

Также, если кто-то не в курсе, бэкап базы данных MySQL — это, по сути, её дамп, сделанный в определённый период времени, который позволяет восстановить структуру и данные базы при необходимости.

Экспорт данных — это просто извлечение информации из таблиц в текстовом виде для дальнейшей работы с текстовом или графическом редакторах.

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

Для создания дампа БД у MySQL есть встроенная утилита под названием mysqldump, которую нужно использовать за пределами командной строки MySQL в консоли сервера или другой оболочке.

Итак, для самого простого и распространённого варианта — экспорта данных конкретной БД в консоли MySQL для переноса её на другой сервер или внутреннего копирования нужно выполнить следующую команду:

mysqldump -u имя_пользователя -p имя_базы_данных > путь_и_имя_файла_дампа

Данная утилита может создавать дампы базы MySQL только в виде файлов с SQL командами, поэтому какое бы вы расширение для своего файла не выбрали — в любом случае его содержимое будет одинаковым. И не забудьте перед экспортом информации из MySQL проверить права на запись у директории, в которой он будет располагаться, чтобы создание файла было возможно.

Если вдруг вам нужно будет сделать дамп со всеми базами данных на сервере, то используйте следующий вариант команды:

mysqldump -u имя_пользователя -p --all-databases > путь_и_имя_файла_дампа

Для создания дампа лишь для нескольких конкретных баз данных вам понадобится вызов mysqldump со следующими параметрами:

mysqldump -u имя_пользователя -p --databases имя_базы_данных1, имя_базы_данных2, ... > путь_и_имя_файла_дампа

В итоге, в каждом случае вы получите дамп базы MySQL, содержащий команды для создания структуры содержащихся таблиц (поля, их типы, индексы, ключи и т.д.), а также операции наполнения их данными.

Данный вариант годится только для восстановления и копирования баз данных целиком.

О том, как делать бэкапы определённых таблиц MySQL и получать их данные в читаемом виде, речь пойдёт дальше.

Делаем дамп таблицы MySQL и экспорт данных

Для создания дампа определённых таблиц MySQL базы данных нам понадобится всё та же утилита mysqldump, вызываемая со следующими параметрами:

mysqldump -u имя_пользователя -p имя_базы_данных имя_таблицы1, имя_таблицы2, ... > путь_и_имя_файла_дампа

Ещё при вызове mysqldump можно указывать требуемые таблицы в качестве значения параметра —tables, при использовании которого параметр —databases будет игнорироваться:

mysqldump -u имя_пользователя -p --databases имя_базы_данных1, имя_базы_данных2 --tables имя_таблицы1, имя_таблицы2, ... > путь_и_имя_файла_дампа

Приведённый пример выведет на экран следующую ошибку:

mysqldump: Got error: 1049: Unknown database 'имя_базы_данных1,' when selecting the database

Как видите, будет использоваться только самая последняя БД из списка указанных. В принципе, такое поведение вполне логично, т.к. во всех БД указанных таблиц может не оказаться.

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

А что, если нужно получить просто хранимую в них информацию и, желательно, в читаемом виде, чтобы можно было её отправить менеджеру и просмотреть в обычном текстовом или табличном редакторе? У MySQL есть средства и для этого.

Достичь задуманного нам поможет вариант вызова утилиты mysql из консоли с определёнными параметрами:

mysql -u имя_пользователя -p имя_базы_данных -e "SELECT * FROM имя_таблицы"

Данная команда позволит нам выполнить запрос к требуемой БД и вывести результат в консоль, не заходя в командную строку MySQL.

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

mysql -u имя_пользователя -p -e "SELECT * FROM имя_таблицы" > путь_и_имя_файла

Благодаря данным конструкциям мы можем не только получить данные, хранящиеся во всех полях таблицы, но и в конкретных. Для этого достаточно вместо символа wildcards (*) прописать через запятую требуемые.

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

Если же захотите экспортировать данные из MySQL базы в xls или csv формате, чтобы полученный файл корректно отображался в табличных редакторах, то о том, как это сделать будет рассказано немного позже :-)

Создание бэкапов и вывод данных из MySQL базы с помощью запросов

О том, как сделать дамп базы данных MySQL — одной и нескольких, а также отдельных их таблиц, мы поговорили. Но иногда на практике бывают случаи, когда нужно экспортировать набор данных, не ограниченный одной таблицей. Либо нужно выбрать лишь некоторые данные из таблицы.

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

Для бэкапа нам понадобится всё та же утилита mysqldump, которую нужно будет вызвать в таком виде:

mysqldump -u имя_пользователя -p имя_базы_данных имя_таблицы --where "уточняющий_запрос" > путь_и_имя_файла_дампа

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

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

mysql -u имя_пользователя -p -e "SELECT * FROM имя_таблицы WHERE уточняющий_запрос" > путь_и_имя_файла

Как вы понимаете, помимо различных уточнений, указываемых в запросе с помощью директивы WHERE, можно использовать и прочие SQL конструкции: JOIN, UNION и т.д.

Статистику собрать получится какую угодно :-)

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

SELECT * FROM таблица_базы_данных WHERE уточняющий_запрос INTO OUTFILE 'путь_и_имя_файла';

Данная команда как раз и предназначена для создания файлов с результатами выборки. Причём, результаты можно не только экспортировать в файлы, но и записывать в переменные, а также выводимые данные можно форматировать различными способами.

Если перечисленное — ваш случай, то с полным списком параметров и вариантов вызова данной команды вы можете ознакомиться здесь — https://dev.mysql.com/doc/refman/5.7/en/select-into.html

Далее речь как раз пойдёт о корректном выводе данных MySQL в xls и csv форматы с помощью данной команды. А с musqldump в рамках данной статьи мы прощаемся.

В завершение своего краткого экскурса по mysqldump хочу привести вариант вызова команды со списком параметров для создания оптимизированного дампа базы MySQL и таблиц, восстановление БД и отдельных таблиц из которого будет занимать меньше времени, чем при обычном вызове:

mysqldump -u имя_пользователя -h хост_или_IP_сервера_MySQL -p --no-autocommit --opt имя_базы_данных > путь_и_имя_файла_дампа;

Ради эксперимента я использовал данный вариант для того, чтобы сделать дамп базы MySQL размером в 143 Мб. Последующее восстановление заняло 59 секунд времени против 1 минуты и 3 секунд, когда БД восстанавливалась из дампа, сделанного вызовом mysqldump без специальных параметров.

Согласен, что это мелочь. Но это только в случае данного объёма данных. Если использовать данную методику при создании дампа размером более 1Гб, то разница будет более существенной.

Если вы столкнётесь с такой ситуацией, то не забудьте ещё предварительно запаковать дамп базы MySQL в архив. Лучше всего tar.gz. Тогда восстановление займёт ещё меньше времени.

Экспорт данных из MySQL в Excel и csv файлы

Я не зря объединил информацию о выводе информации из MySQL в эти два формата в одном блоке, т.к. они очень похожи, используются примерно одинаково (для структурирования информации в виде таблиц) и команды для экспорта будут вызываться одни и те же.

Как известно, единственным существенным различием между данными форматами является то, что расширение xls и xlsx имеют файлы, создаваемые в программе Microsoft Office Excel, которая работает только под Windows, а csv файлы являются более универсальными и операции с ними возможны во многих редакторах.

Это не значит, что xls нигде, кроме Microsoft Office Excel, не откроется. Тот же OpenOffice подтверждает обратное.

Но для такой возможности данная поддержка должна присутствовать в программном продукте. csv же файлы доступны для чтения даже в обыкновенном текстовом редакторе типа «Блокнот», только такая форма будет не совсем читабельной.

Начну с того, что экспортировать в xls или csv можно только результаты SQL запросов, работать с которыми мы с вами научились ранее, т.к. всю базу данных в один файл будет невозможно вывести за одну операцию.

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

Нет, сделать это, конечно, возможно, но вряд ли одной командой и вообще вряд ли кто-то будет таким заниматься в консоли. Думаю, что для данных целей понадобится специальное ПО или, как минимум, скрипт.

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

Итак, если мы говорим о том, как сделать экспорт данных из MySQL в xls и csv, то сделать это можно прямо в консоли сервера через утилиту mysql либо в командной строке MySQL, работой с которой я знакомил вас в предыдущей своей статье.

Начнём по порядку.

Экспортировать данные из MySQL базы данных в csv и xls форматы прямо в консоли сервера можно следующими командами.

На Linux системах:

mysql -u имя_пользователя -d имя_базы_данных -p -e "SELECT * FROM таблица_БД;" | sed "s/'/\'/;s/\t/\",\"/g;s/^/\"/;s/$/\"/;s/\n//g" > путь_и_имя_файла.csv

В принципе, при крайней необходимости можете сделать данной командой и экспорт данных MySQL в Excel файл. Но я, если честно, на практике данным не занимался и что выйдет в итоге — без понятия, т.к. работаю сейчас под Windows. Если будете пользоваться данной командой под Linux — напишите в комментариях, пожалуйста, о результатах вашей работы. Думаю, информация будет интересна всем.

На Windows:

Экспорт данных из MySQL таблиц в csv приведённой выше командой в данном случае, к сожалению, не удастся, т.к. у Windows, в отличие от Linux, нет встроенной консольной команды для работы с потоками, какой является sed в Linux.

Установить её, конечно, можно, но слишком много хлопот. Ещё, как вариант, можете использовать CygWin — эмулятор консоли Linux для Windows систем.

Хорошо, если она у вас уже установлена. В противном случае экспорт данных из БД MySQL выбранным способом принесёт нам слишком много хлопот.

Зато извлечение информации в xls файл прост как 5 копеек :-) Запустить его очень просто следующим способом, который я опробовал лично:

mysql -u имя_пользователя -d имя_базы_данных -p -e "SELECT * FROM таблица_БД;" > путь_и_имя_файла.xls

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

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

Не знаю, возможно, при произведении каких-либо специфических действий в Microsoft Office Excel и возникнут проблемы в дальнейшем, я так глубоко не копался. При обычном просмотре данных, по крайней мере, я ничего необычного не встретил.

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

Описанным выше путём можно экспортировать содержимое БД MySQL и в csv файл, в принципе. Но тогда данные из разных полей таблицы будут записаны скопом, без разделителей, что может плохо отображаться в различных программах для работы с таблицами, в которых обычно с csv файлами и работают.

OpenOffice, кстати, всё равно :-) Он автоматически разграничил информацию, полученную способом, которым мы экспортировали содержимое базы MySQL в xls. Не знаю, как он это делает — но рекомендую пользоваться :-)

Ну, а тот же самый Microsoft Office Excel отобразил всю информацию, соответствующую одной записи в таблице, записав её в одну ячейку без каких-либо разделителей. Думаю, что подобным образом поступят и другие редакторы таблиц.

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

И тут я плавно подошёл ко второму способу экспорта MySQL данных в csv и xls, который заключается в использовании командной строки MySQL.

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

SELECT * FROM таблица_базы_данных
INTO OUTFILE 'путь_и_имя_файла.csv'
FIELDS TERMINATED BY ',' ENCLOSED BY '"'
LINES TERMINATED BY '\n';

В результате её выполнения вы получите csv файл по пути, прописанному вами при вызове, который будет корректно открываться в большинстве современных табличных редакторов. На всякий случай напоминаю, что запускать данную команду нужно только после соединения с базой данных MySQL.

Данная команда также отлично подходит и для экспорта данных MySQL в xls файл для корректного отображения в Microsoft Office Excel. Только в этом случае разделители нам не нужны, т.к. они будут мешать в разбиении информации по ячейкам:

SELECT * FROM таблица_базы_данных INTO OUTFILE 'путь_и_имя_файла.xls';

Однако, на практике не всё так просто, как я описал. Во время выполнения команды вы можете столкнутся со следующей ошибкой в консоли, препятствующей выполнению экспорта:

ERROR 1290 (HY000): The MySQL server is running with the --secure-file-priv option so it cannot execute this statement

Она вызвана тем, что ваш MySQL сервер был запущен с опцией —secure-file-priv. Лично я столкнулся с данной проблемой из-за того, что для работы в консоли пользуюсь дистрибутивом MySQL, входящим в комплект WAMP OpenServer, который, в свою очередь запускает MySQL сервер данным образом.

Здесь есть два способа решения проблемы:

  • Изменить параметры запуска MySQL сервера
  • Изменить путь к конечному файлу экспорта MySQL

Первый способ мне показался слишком сложным, т.к. пришлось бы копаться в конфигурации OpenServer, которая не мною была написана со всеми вытекающими из этого обстоятельствами :-) Поэтому я решил пойти вторым путём. Если вы столкнулись с подобной проблемой — повторяйте за мной.

Сперва нужно зайти в командную строку MySQL и выполнить одну из следующих команд:


SHOW VARIABLES LIKE "secure_file_priv";
SELECT @@GLOBAL.secure_file_priv;

Результатом выполнения обеих будет значение глобальной переменной MySQL secure_file_priv, которая содержит путь к каталогу, через который могут осуществляться операции экспорта и импорта данных MySQL (в будущем ссылка на статью об импорте данных).

Т.е. при использовании команд LOAD DATA и SELECT … INTO OUTFILE экспортируемые и импортируемые файлы могут располагаться только внутри данного каталога.

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

Как потом выяснилось, это распространённая ситуация в случае использования коробочных WAMP и MAMP серверов.

К сожалению, привычными методами изменения значений глобальных переменных MySQL в моём случае воспользоваться не удалось:

SET имя_переменной = значение;

В результате я увидел в консоли лишь следующую ошибку:

ERROR 1238 (HY000) at line 1: Variable 'secure_file_priv' is a read only variable</strong>.

В итоге, чтобы изменить значение переменной secure_file_priv и открыть операции экспорта и импорта, мне потребовалось зайти в файл конфигурации MySQL mysql.ini, который расположен в корневой директории дистрибутива MySQL, или к нему можно получить доступ иным способом, если MySQL входит в комплект вашего WAMP/LAMP/MAMP сборки сервера.

Вам, кстати, если захотите изменить путь к буферному каталогу обмена файлами, нужно будет сделать то же самое.

В моём случае в конфиге данная переменная уже существовала, только в закомментированном виде:

secure-file-priv = "%dprogdir%\\userdata\\temp"

Если у вас её не будет, то пропишите её с нуля в секции [mysqld] (по крайней мере, у меня она располагалась там).

Я её раскомментил и решил использовать в том виде, в каком она была прописана. Т.е. при экспорте данных из MySQL и их импорте обратно файлы у меня теперь будут храниться в каталоге c:\openserver\userdata\temp\.

После изменения конфига (любого, кстати), не забывайте перезапускать ваш сервер либо отдельную службу, настройки которой вы правили, если есть такая возможность, чтобы изменения вступили в силу!

Для уверенности, после перезапуска MySQL сервера ещё раз выводим на экран переменную secure_file_priv и копируем её значение в буфер обмена.

А теперь нам нужно вызвать команду, что и в начале, только перед названием файла, в который будет сохраняться информация из БД MySQL, прописать путь, хранимый в изменяемой нами переменной в следующем виде:

SELECT * FROM таблица_базы_данных INTO OUTFILE 'значение_secure_file_priv\имя_файла.csv';

После этого экспорт данных из MySQL в моём случае заработал.

Важный момент! Если вы работаете с MySQL под Windows, то не забывайте при указании пути к файлу поменять «\» на «/», иначе ошибка с —secure-file-priv всё равно продолжит выводиться.

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

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

Всем удачи и до новых встреч! :-)

MySQL консоль: 35 основных команд

mysql-komandnaya-strokaДоброго времени суток, коллеги :-)

Да, именно коллеги, потому как простому смертному MySQL командная строка (или MySQL Shell, как её ещё любят называть разработчики), равно как и работа с MySQL в консоли, вряд ли пригодится.

Для того, чтобы данная тема была интересна, нужно быть, как минимум, бэкэнд-разработчиком или начинающим системным администратором, которые не пользуются phpMyAdmin и другими интерфейсами принципиально.

Хотя, возможно, вы просто подписаны на уведомления и решили прочитать новую статью из чистого любопытства.

Ну что ж… Весьма похвально :-)

В любом случае, я постараюсь, чтобы материал был одинаково интересен и понятен всем, кем бы вы ни работали и как бы вы ни были связаны с программированием. Собственно, чего я своими статьями и добиваюсь, в принципе :-)

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

Одним словом, мы рассмотрим весь жизненный цикл БД и все основные операции, которые могут вам понадобиться в процессе. В результате у нас получится что-то вроде шпаргалки системного администратора, которой я сам буду активно в будущем пользоваться, т.к. всего в памяти не удержишь.

Поехали :-)

Когда MySQL командная строка может пригодиться?

Сразу скажу, что, если вы не собираетесь работать системным администратором или деплойщиком, то каждый день работать с MySQL через командную строку вам вряд ли понадобиться. Для повседневного использования вполне подойдёт старый добрый phpMyAdmin либо какой-то другой веб интерфейс или приложение для работы с MySQL.

Хотя, здесь имеет место привычка. Лично у меня есть знакомые из ранга «трушных кодеров», которые являются фанатами консоли со времён MS-DOS и чистого Linux, видимо, где работать с ОС можно было только из консоли.

Поэтому они и презирают всякого рода графические «примочки». Хотя, большинству пользователей подойдут именно они.

Лично я сам предпочитаю использовать phpMyAdmin как основную программу при создании сайтов для работы с MySQL, т.к. по природе своей являюсь визуалом. Однако, иногда на практике встречаются ситуации, когда знания MySQL командной строки и умения работы с MySQL в консоли сервера просто необходимы.

У меня на данный момент их было три:

  1. Впервые я столкнулся с работой в MySQL консоли, когда понадобилось сделать импорт большого дампа БД. Через phpMyAdmin он не загружался целиком, т.к. отваливался где-то посередине по таймауту, несмотря на изменение настроек времени выполнения операции и размеров загружаемых файлов. В принципе, можно было подобрать нужные значения, но мне показалось это слишком длительным процессом.
  2. В следующий раз поработать с MySQL через командную строку пришлось для отключения проверки внешних ключей, когда нужно было удалить данные из таблицы, которая с помощью ключей была связана с другими. В phpMyAdmin я просто не нашёл, как это сделать.
  3. В серьёзных компаниях для работы с MySQL используется исключительно консоль без каких-либо phpMyAdmin-ов. Не знаю почему конкретно, но знающие люди говорили, что это как-то связано с безопасностью. В результате, всем приходилось работать с командной строкой MySQL, в том числе и мне :-)

Но, повторюсь, работа с MySQL в консоли и командной строке вполне подходит и для повседневного использования. Все известные визуальные программы для работы с БД всё равно работают на основе консольных команд MySQL. Поэтому, кому как нравится :-)

Запуск консоли на разных ОС

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

Действие простое, многим знакомое, для которого достаточно знания «горячих клавиш».

Запуск консоли в Windows:

  • Win+R для открытия командной строки Windows с правами администратора;
  • Вводим команду cmd
  • Нажимаем Enter на клавиатуре

Запуск консоли в Linux дистрибутивах (терминала): в Ubuntu, с которой я работал, достаточно системной комбинации клавиш Ctrl+Alt+T. Про остальные ОС на базе Linux ничего сказать не могу.

Запуска консоли в MacOS: сам я таким не занимался, т.к. Мак-ом ещё не обзавёлся и вряд ли обзаведусь за ненадобностью, но, насколько мне удалось узнать, «горячих клавиш» для вызова терминала в этой ОС нет. Так что если вы являетесь пользователем «яблочной» продукции, то запустите консоль через интерфейс ОС, благо, что мануалов в сети много.

Немного стыдно даже такую информацию публиковать на случай, если на данную статью случайно набредёт какой-то профессиональный системный администратор с бородатым опытом, т.к. он подумает: «Автор считает своих читателей программистами, но при этом учит запускать консоль… Псих какой-то :-)».

Да, вполне логично :-) Но я просто учитываю ситуации, что наряду с профессиональными разработчиками сюда могут попасть и новички. Поэтому я и стараюсь делать информацию полной и доступной для всех категорий пользователей, о чём уже говорил.

Основные команды консоли MySQL

Итак, первым делом, нам нужно получить доступ к MySQL командной строке в консоли. Для этого открываем консоль сервера и, если у вас MySQL установлен глобально в виде сервиса, то для «проверки связи» прописываем следующее:


mysql -V

Консольная команда mysql позволяет нам запустить одноименную утилиту, являющуюся командной строкой MySQL.

Это позволит нам узнать версию MySQL, установленного на компьютере и убедиться, что он вообще установлен как служба. Если это так, то в ответ в консоли вы увидите примерно следующий текст: mysql Ver 14.14 Distrib 5.7.16, for Win64 (x86_64).

Да, я не «трушный кодер», потому что сижу под Виндой :-) Но, не суть. На Unix системах процедура будет такой же.

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

В консоли переходим в каталог, где находится исполняемый файл MySQL (на Windows, по крайней мере, это mysql.exe) следующей командой:


cd C:\OpenServer\modules\database\MySQL-5.7-x64\bin

Путь к дистрибутиву у вас, естественно, может отличаться. В качестве примера я решил запустить одну из версий MySQL, входящих в комплект OpenServer.

И запускаем MySQL, проверяя попутно его версию:


mysql.exe -V

В результате в консоль должно было вывестись аналогичное первому случаю сообщение mysql Ver 14.14 Distrib 5.7.16, for Win64 (x86_64).

Всё, с запуском MySQL командной строки через консоль сервера разобрались, теперь будем подключаться непосредственно к серверу MySQL.

Подключение к серверу MySQL в консоли

Cервер MySQL может не обязательно находиться на той же машине, на которой вы пытаетесь получить к нему доступ в консоли. Следовательно, для того, чтобы подключение к удалённому серверу MySQL через консоль было возможно, утилита mysql имеет множество параметров, с помощью которых можно указывать необходимые настройки.

Для того, чтобы запустить командную строку MySQL в консоли, нам достаточно прописать в консоли сервера следующее:


mysql

Однако, в таком случае вы получите следующую ошибку: ERROR 1045 (28000): Access denied for user ‘ODBC’@’localhost’ (using password: NO). Так сообщение об ошибке выглядит у меня на Windows. Если же вы используете Linux, то вместо ODBC будет имя вашего системного пользователя, под которым вы совершаете действия в системе.

Всё это потому, что по умолчанию при подключении к MySQL серверу в консоли используется пользователь ODBC на Windows без пароля и системный юзер на Linux с его же паролем. Хост по умолчанию localhost, т.е. данный пользователь может подключаться только с локальной машины.

Поэтому выхода у вас два: либо использовать другого пользователя для входа в командную строку MySQL, либо создать пользователя MySQL с нужной учёткой. Но для второго способа нам без первого всё равно не обойтись :-) Поэтому для начала подключаемся к серверу MySQL под стандартным пользователем root, который создаётся при установке MySQL на компьютер и для которого по умолчанию разрешён доступ с localhost:


mysql -u root -p

При требовании ввести пароль просто нажимаем Enter (если вы его не вводили, конечно, при установке MySQL). После этого вы будете подключены к серверу MySQL с присвоением вам идентификатора подключения и получением доступа к командной строке MySQL.

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


mysql -u имя_пользователя -p пароль_пользователя -h хост_или_IP_сервера_MySQL

Вместо кириллических символов с подчёркиванием, естественно, нужно ввести свои данные латинницей. Кстати, данную команду при желании можете прописать немного в другом формате:


mysql --user=имя_пользователя --password=пароль_пользователя --host=хост_или_IP_сервера_MySQL

Если по какой-то причине вы не хотите, чтобы ваш пароль подключения к MySQL отображался в консоли (что правильно, на самом деле), можете использовать следующую команду:


mysql -u имя_пользователя -h хост_или_IP_сервера_MySQL -p

Поскольку пароль не указан явно, вам будет предложено его ввести на следующем шаге. Причём, введённые вами символы отображены не будут даже в виде звёздочек (wildcards), вместо этого будет просто пустая строка.

Помимо указанных настроек подключения возможно использовать следующие параметры, значения которым будут указываться аналогичным с вышеперечисленными образом:

  1. —port или -P — для указания порта подключения к серверу MySQL;
  2. —protocol — протокол, по которому будет осуществляться подключение (возможные варианты: TCP для Windows и Linux, SOCKET для Linux, PIPE и MEMORY для Windows);
  3. —socket или -S — данный параметр пригодится, если вы захотите подключаться через сокеты, следовательно, значение параметра будет сокет;
  4. —pipe или -W — параметр нужен, если вы захотите использовать именованные «трубопроводы» или «пайпы» для подключения;
  5. —shared-memory-base-name — этот параметр вам пригодится для MEMORY подключений через общую память на Windows;

Понятное дело, что на этом список всех параметров подключения к MySQL серверу не ограничивается. В реальности их намного больше.

Если по какой-то причине стандартный вариант с указанием хоста, пользователя и пароля вам не подойдёт, то для выяснения полного перечня параметров подключения вам будет полезна следующая информация — https://dev.mysql.com/doc/refman/5.7/en/connecting.html

Как создать базу данных в MySQL консоли

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

CREATE DATABASE имя_базы_данных;

То же самое действие можно сделать и с помощью специальной MySQL утилиты mysqladmin. Запускается она изолированно от командной строки MySQL, т.е. для её использования вам нужно будет выйти из неё или открыть новую консоль сервера.

А затем вызвать следующую команду:

mysqladmin create имя_базы_данных;

К слову, с помощью утилиты mysqladmin можно не только создавать и удалять базы данных, не заходя в консоль MySQL, но и оперировать серверной конфигурацией, процессами MySQL, управлять репликациями, пинговать сервера и делать ещё много всего интересного.

Более подробно о mysqladmin можете прочитать здесь — https://dev.mysql.com/doc/refman/5.7/en/mysqladmin.html

Как создать пользователя MySQL в командной строке

Не часто, но иногда требуется создать нового пользователя MySQL. Причём, в консольном режиме.

В командной строке MySQL это делается следующим образом:


CREATE USER 'имя_пользователя'@'хост_или_IP_машины' IDENTIFIED BY 'пароль_пользователя';

Пользователь создан. Параметр хост_или_IP_машины означает, что при создании пользователя нужно указывать IP, с которого он сможет подключаться к серверу, или имя хоста (подойдёт доменное имя рабочей машины в сети).

Кстати, при указании хоста для подключения к MySQL серверу можно использовать символ процента — %, который означает, что создаваемый пользователь может соединяться с сервером MySQL с любого IP адреса или хоста.

При этом нужно учитывать, что в данном случае localhost не входит в список адресов, указываемых с помощью %, т.к. localhost обозначает подключение через UNIX сокет вместо стандартного TCP/IP. Т.е. если созданный пользователь MySQL будет подключаться к серверу не с помощью сокетов, а по другому протоколу, указываемому при соединении с MySQL сервером в консоли, то ему нужно будет создавать две учётные записи пользователя:


CREATE USER 'имя_пользователя'@'%' IDENTIFIED BY 'password';
CREATE USER 'имя_пользователя'@'localhost' IDENTIFIED BY 'password';

С созданием пользователя MySQL в консоли мы разобрались. Теперь зададим права пользователя для выполнения любых действий с нашей только что созданной базой данных следующей командой:


GRANT ALL PRIVILEGES ON имя_базы_данных.* TO 'имя_пользователя'@'хост_или_IP_машины';

Опция ALL, как вы поняли, как раз и указывает на то, что пользователю разрешаются любые действия с определённой БД. Полный список прав, которые можно выдавать пользователям с помощью команды GRANT, можно найти здесь (правда, описание параметров на английском) — https://dev.mysql.com/doc/refman/5.7/en/grant.html#grant-privileges

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

Если захотите создать суперюзера, т.е. обладающего глобальными привилегиями для осуществления различных действий со всеми БД на сервере, то используйте следующий вызов команды:


GRANT ALL ON *.* TO 'имя_пользователя'@'хост_или_IP_машины';

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


FLUSH PRIVILEGES;

А если захотите поменять права пользователя, то используйте сначала следующую команду чтобы сбросить все права:


REVOKE ALL PRIVILEGES ON *.* FROM 'имя_пользователя'@'хост_или_IP_машины';

А затем установите ему нужные с помощью GRANT, как это было описано ранее.

Если же вам в будущем потребуется изменить пароль пользователя MySQL, то для этого достаточно выполнить в MySQL Shell следующие команды:

SET PASSWORD FOR 'имя_пользователя'@'хост_или_IP_машины' = PASSWORD('новый_пароль');

FLUSH PRIVILEGES;

Сброс кэша привилегий MySQL сервера нужен с той же целью, что и при смене прав — без этого действия смена пароля пользователя MySQL может быть не засчитана, поэтому не ленитесь пользоваться :-)

В Интернете, кстати, полно примеров использования следующей команды для сброса пароля MySQL пользователя:

UPDATE mysql.user SET Password=PASSWORD('пароль') WHERE User='имя_пользователя';

Но у меня на MySQL 5.7 данный вариант не сработал, выдав ошибку ERROR 1054 (42S22): Unknown column ‘Password’ in ‘field list’. Её причина оказалось отсутствие поля Password в таблице mysql.user.

Из чего можно предположить, что данный вариант работает лишь для старых версий MySQL, где в таблице пользователей данное поле существовало. Поэтому для уверенности используйте мой первый вариант, если вы, конечно не вынуждены работать с допотопным ПО без возможности обновления версий :-)

На этом создание нового пользователя MySQL и обзор действий с его правами и паролями закончен. Идём далее.

Выбор базы данных при работе с MySQL через командную строку

Теперь, после создания пользователя в MySQL Shell и назначения ему прав на работу с БД нам нужно выбрать эту самую базу, чтобы можно было оперировать самой базой и хранящимися в ней данными.

Для этого используем следующую команду в MySQL консоли:


USE имя_базы_данных;

Если всё прошло успешно, то в консоли выведется сообщение Database changed, что будет сигнализировать о том, что мы выполнили вход в базу MySQL через консоль. Кстати, при соединении с сервером MySQL, изначально можно указывать БД, с которой необходимо будет работать. Для этого нужно прописать следующую команду в консоли сервера:


mysql --user=имя_пользователя --password=пароль_пользователя --host=хост_или_IP_сервера_MySQL --database=имя_базы_данных

Или то же самое, только с запросом ввода пароля пользователя MySQL:


mysql -u имя_пользователя -h хост_или_IP_сервера_MySQL имя_базы_данных -p

На этом всё. Думаю, никаких сложностей с подключением к базе данных MySQL через консоль теперь у вас не возникнет :-)

Работа с таблицами MySQL через консоль MySQL

Итак, базу данных MySQL через консоль мы создали. Теперь было бы неплохо научиться с ней работать для случая, когда командная строка MySQL будет единственным средством доступа к хранящимся на сервере данным (как это было у меня, о чём я говорил в начале статьи).

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

CRUD операции, если кто-то не в курсе, — это операции по созданию, чтению, обновлению и удалению данных от англ. «Create, Read, Update, Delete» (возможно, на собеседованиях вам такое понадобится).

Напоминаю, что для выполнения действий с таблицами вы должны сперва подключиться к БД MySQL с помощью команды USE.

Итак, первая на повестке у нас команда создания таблицы MySQL в БД через командную строку, которая выглядит так:


CREATE TABLE имя_таблицы (название_поля_1 тип_поля_1, название_поля_2 тип_поля_2(размер_поля_2), INDEX(название_поля_1), ...);

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

Кстати, если вы захотите скопировать таблицу в другую базу данных или просто создать копию в текущей, вам помогут следующие команды:


CREATE TABLE новое_имя_таблицы LIKE старое_имя_таблицы;
INSERT новое_имя_таблицы SELECT * FROM старое_имя_таблицы;

Данные команды позволяют скопировать структуру таблицы и её данные вместе с индексами и триггерами таблиц. Если вам нужны просто данные и структура (имена полей и их типов данных), то можете обойтись вызовом одной команды:


CREATE TABLE новое_имя_таблицы AS SELECT * FROM старое_имя_таблицы;

Следующая операция из блока CRUD у нас чтение. В случае таблиц чтением будет вывод на экран их структуры. Для этого существует следующие четыре команды:


SHOW FULL COLUMNS FROM имя_таблицы;
DESCRIBE имя_таблицы;
EXPLAIN имя_таблицы;
SHOW CREATE TABLE имя_таблицы;

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

Вторая и третья команды являются просто сокращёнными формами первой команды без расширенной информации. Зачем было их плодить — даже не представляю… Разве что, чтобы было что спросить на собеседованиях при приёме на работу? :-)

Четвёртая команда, помимо имени, типов полей и значений их по умолчанию позволяет получить значения ключей таблиц, движков таблиц (InnoDB, MyISAM), кодировку и др.

Update операция в случае таблиц представляет собой изменение их структуры, т.е. различные действия с полями таблиц MySQL:


ALTER TABLE имя_таблицы DROP COLUMN название_поля;
ALTER TABLE имя_таблицы ADD COLUMN название_поля VARCHAR(20);
ALTER TABLE имя_таблицы CHANGE старое_название_поля новое_название_поля VARCHAR(50);
ALTER TABLE имя_таблицы MODIFY название_поля VARCHAR(3);

Первая команда позволяет удалить определённое поле таблицы, вторая — добавить, третья позволяет переименовать поле и попутно изменить тип хранимых в нём данных, а четвёртая — изменить исключительно тип данных.

Тоже самое можно делать и с индексами таблиц с помощью во многом похожих команд:


ALTER TABLE имя_таблицы ADD UNIQUE INDEX имя_индекса (название_поля_1, ...);
ALTER TABLE имя_таблицы rename INDEX старое_имя_индекса TO новое_имя_индекса;
ALTER TABLE имя_таблицы DROP INDEX имя_индекса;

Приведённые команды позволяют добавлять, переименовывать и удалять индексы из таблиц MySQL через командную строку. Для добавления и удаления индексов есть, кстати, ещё альтернативный вариант использования самостоятельных команд, а не делать это через ALTER TABLE. Поэтому при желании можете использовать их:


CREATE UNIQUE INDEX имя_индекса (название_поля_1, ...) ON имя_таблицы;
DROP INDEX имя_индекса ON имя_таблицы;

Приведённые команды являются эквивалентами первой и последней из предыдущего блока. Для переименования индекса, к сожалению, отдельной команды не существует. А для изменения типа индекса, к сожалению, вообще нет никакой возможности в MySQL. Единственный выход — удалить индекс и создать его снова с нужным типом.

Ну, и наконец, мы дошли до последней операции из блока CRUD — к удалению. Удалить таблицы MySQL из БД очень просто. Достаточно в консоли MySQL выполнить следующую команду:


DROP TABLE имя_таблицы;

Иногда на практике возникают ситуации, из-за которых не получается удалить таблицу или изменить её структуру. Как правило, это связано с использованием в БД внешних ключей для связи таблиц между собой. С этой ситуацией я лично сталкивался неоднократно, о чём говорил в начале статьи.

Поэтому, если при удалении или обновлении структуры таблицы или её данных MySQL вернул вам ошибку с текстом Cannot delete or update a parent row: a foreign key constraint fails, то следующая информация вам будет как нельзя кстати.

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

Собственно говоря, с данной целью внешние ключи MySQL и нужны.

Итак, для удаления данных, которому мешают внешние ключи необходимо выполнить следующие действия в консоли MySQL:


SET FOREIGN_KEY_CHECKS=0;
#необходимая_mysql_команда
SET FOREIGN_KEY_CHECKS=1;

Кстати, если захотите удалить внешний ключ, то процедура будет такой же, как и при удалении индекса:


ALTER TABLE имя_таблицы DROP FOREIGN KEY имя_внешнего_ключа;

Чтобы узнать имя внешнего ключа MySQL таблицы, используйте уже знакомую команду MySQL консоли SHOW CREATE TABLE.

Работа с данными таблиц MySQL через командную строку

Для таблиц CRUD операции в MySQL консоли мы рассмотрели. Для полной картины данной шпаргалке не хватает только команд для работы с самими данными, хранящимися в таблицах БД. Думаю, многие знают эти команды и пользовались ими на практике, но всё же напомню их ещё раз.

CRUD операции для работы с данными таблиц MySQL будут выглядеть так:

INSERT INTO имя_таблицы (поле1, поле2, ...) VALUES (значение_поля_1, значение_поля_2, ...);
SELECT поле1, поле2, ... FROM имя_таблицы;
UPDATE имя_таблицы SET поле1 = значение_поля_1, поле2 = значение_поля_2;
DELETE FROM имя_таблицы WHERE поле1 = значение_поля_1;

Приведённые выше команды соответствуют операциям создания, чтения, обновления и удаления данных из таблиц БД MySQL. При использовании SELECT и UPDATE также возможно использовать уточняющий оператор WHERE, с помощью которого можно конкретизировать выбор данных способом, описанным в случае использования DELETE.

Также при выборке данных из БД с помощью SELECT можно использовать следующий вариант для получения значений всех полей таблицы:

SELECT * FROM имя_таблицы;

Естественно, что в данных операциях могут использоваться и другие операторы, помимо WHERE. Особенно их много при выборке данных с помощью SELECT: тут и UNION для объединения результатов нескольких запросов, и различные типы JOIN. Все перечислять очень долго и утомительно как для меня, так и для вас будет читать это.

Поэтому давайте договоримся: если вам захочется о чём-то узнать поподробнее — просто напишите об этом в комментариях, и я постараюсь вам ответить. Или же это сделают другие сведущие участники нашего сообщества. Ок? 😉

Так что пока на данном блоке останавливаться не будем.

Если же вам нужно будет удалить все данные из таблицы, то можете воспользоваться следующей MySQL командой:

TRUNCATE имя_таблицы;

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

Как удалить базу данных MySQL через командную строку

Жизненный цикл работы с базой данных подходит к концу и завершается вполне логично — её удалением. Для того, чтобы сделать данную операцию в консоли MySQL, нужно выполнить следующую команду (при этом удаляемая БД может быть и не выбрана командой USE):

DELETE DATABASE имя_базы_данных;

То же самое действие можно сделать и с помощью MySQL утилиты mysqladmin, о которой я уже упоминал в начале статьи при создании БД:

mysqladmin drop имя_базы_данных;

При вызове команды в консоли сервера появится следующее сообщение:

Dropping the database is potentially a very bad thing to do.
Any data stored in the database will be destroyed.

Do you really want to drop the ‘имя_базы_данных’ database [y/N]

Вкратце — это предупреждение о том, что удаление базы данных MySQL — идея очень плохая. Также запрашивается подтверждение действия. Если согласны — пишем y и нажимаем Enter на клавиатуре, после чего на экран выведется следующее сообщение (если всё прошло успешно, конечно же):

Database «имя_базы_данных» dropped

Вот так :-)

Как удалить пользователя MySQL в консоли

Теперь та же участь постигнет и создаваемого нами пользователя MySQL, чтобы продемонстрировать вам, как это делается. Но для начала неплохо бы перед самим удалением проверить, существует ли требуемый пользователь на самом деле.

Начиная с MySQL 5.7 для обоих этих действий существует одна команда:

DROP USER IF EXISTS имя_пользователя;

В более ранних версиях MySQL требовалось две отдельные команды:

GRANT USAGE ON *.* TO 'имя_пользователя'@'хост_или_IP_адрес';
DROP USER 'имя_пользователя'@'хост_или_IP_адрес';

К сожалению, в данном случае сообщение о выполнении операции в консоли MySQL традиционно малоинформативно :-( Поэтому, чтобы узнать, что удаление пользователя пользователь MySQL всё-таки произошло, можно воспользоваться следующей командой, которая выводит на экран список всех существующих на текущем MySQL сервере пользователей:

SELECT User FROM mysql.user;

Данный вариант команды выведет только имена пользователей. Если же вам нужно будет посмотреть хосты, с которых пользователи могут коннектиться к серверу, и список привилегий, то можете вызвать команду в следующем виде:

SELECT User, Host, Grant_priv FROM mysql.user;

Также в таблице mysql.user существует масса других полей, в которых хранятся другие типы привилегий и прочая информация, с полным списком которой можно познакомиться здесь — https://mariadb.com/kb/en/library/mysqluser-table/

Не смущайтесь, что это документация к СУБД MariaDB. Технически это то же самое, что и MySQL, т.к. MariaDB является всего лишь её ответвлением или форком от англ «fork» — ответвление, вилка.

Зачем её было делать — снова без понятия :-) Разве что, чтобы всем гордо заявлять, что «у меня своя СУБД»?.. Но о точных мотивах и различиях MySQL и MariaDB я, честно говоря, не сильно в курсе. Поэтому если вы что-то об этом знаете — было бы интересно прочитать об этом в комментариях.

Выход из консоли MySQL

Вот и всё, жизненный цикл БД и пользователя, начавшийся их созданием и завершившийся удалением подошёл к концу. Следовательно, командная строка MySQL, с которой мы работали в консоли сервера с помощью утилиты mysql, нам больше не нужна.

Осталось только выйти из неё…

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

Правильным поведением в данной ситуации будет всего лишь вызов команды exit в командной строке MySQL, после чего сервис с нами вежливо попрощается :-)

vykhod-iz-mysql-v-konsoli

И всего-то :-) Так что в следующий раз не нужно плодить консоли и переоткрывать их каждый раз, когда нужно будет выйти из MySQL в консоли и снова получить к ней доступ для управления сервером.

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

Говоря о практическом применении изложенной в статье информации хочется напомнить, что приведёнными конструкциями можно пользоваться не только в командной строке MySQL и консоли сервера, но и в консоли phpMyAdmin и прочего ПО, которое предоставляет такую возможность.

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

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

Обещаю, что в процессе вы узнаете много нового, как и я при написании каждой своей статьи :-)

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

На этом всё! Удачи и до новых встреч :-)

Что такое SSL, HTTPS и TLS

chto-takoe-httpsВсем доброго времени суток ! :-)

Те, кто подписан на обновления проекта и следят за выходом новых статей, заметили, что в последнее время я увлёкся вопросами кибербезопасности. В результате свет увидел статьи о капче, как одного из механизмов защиты сайта от роботов, и публикацию о безопасности WordPress.

В последней, при перечислении различных мер и плагинов для защиты WordPress сайтов от злоумышленников, я вскользь упомянул о протоколе HTTPS и подумал, что кто-то из вас может не знать, что это такое. Да что уж там скрывать: при написании статьи я сам был знаком с данным термином только поверхностно.

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

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

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

Так что HTTPS даёт не только защищённость данных ресурса, но и является средством SEO оптимизации сайта.

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

Как вы уже поняли, темы сегодня будут подниматься очень важные и непростые. Поэтому советую всем запастись попкорном и устроиться поудобнее — впереди вас ждёт много информации :-)

Поехали!

Что такое HTTPS?

Начнём с истории :-)

Несколько лет назад основным протоколом передачи данных в среде Web был HTTP (Hypertext Transfer Protocol). Алгоритм его работы прост и основан на установке соединения типа «клиент-сервер». При этом обмен информацией производится в текстовом формате, следовательно, возникает риск отслеживания сообщений между клиентами.

В связи с этим в последние годы в Интернете стало популяризироваться использование расширения протокола HTTP под названием HTTPS (HyperText Transfer Protocol Secure).

Браузеры Chrome и Firefox уже отмечают сайты на HTTP как «небезопасные», Google понижает сайты на старом протоколе в выдаче — всё это делается с целью стимуляции вебмастеров перехода с HTTP на HTTPS.

Поэтому возникло даже целое понятие «миграция на HTTPS», поскольку в Рунете и Буржунете ресурсы массово начали осуществлять перевод с HTTP на HTTPS.

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

Кроме вопросов безопасности наличие SSL-сертификата с августа 2014 года положительно влияет на позиции сайта в поисковой выдаче Google, который является главным пропагандистом данного протокола.

Почему же поисковики вдруг взъелись на HTTP и стали заставлять всех переходить на HTTPS?

HTTPS, несмотря на обильное внимание в последнее время, является достаточно древним протоколом, созданным в далёком 1994 году компанией Netscape Communications для своего браузера Netscape Navigator.https-dlya-seo

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

Ещё одним отличием от HTTP является сетевой TCP порт, используемый для передачи данных. Вместо 80 для HTTPS используется 443. Зачем нужен HTTPS для сайта становится понятно после ознакомления со статистикой взломов интернет магазинов, платежных систем и социальных сетей.

Уникальный алгоритм с механизмом самообучения проанализировал взломы 313 190 реальных сайтов, на которых производилось более 760 000 взломов. Больше трети взломов связаны были именно с подменой пакетов при передаче данных.

Что такое TLS и SSL?

Пытаясь разобраться с тем, что такое HTTPS и для чего он нужен, я немного запутался, т.к. при упоминании о данном протоколе постоянно мелькали ссылки на другие протоколы – SSL и TLS.

И то протокол, и то протоколы… Какая между ними связь вообще?

Но, как это часто и бывает, я слишком поспешно изучал новый материал и не заметил маленькую деталь: HTTPS – это протокол передачи данных, а SSL и TLS – это криптографические протоколы. Т.е. это разные типы протоколов и у них, следовательно, разные назначения, что не мешает использовать их все вместе в рамках одного процесса – передачи данных.

Главное отличие HTTP от HTTPS в том, что в последнем данные передаются поверх протоколов SSL и TLS, т.е. сначала шифруются в соответствии с криптографическими протоколами, а потом уже передаются стандартным способом при помощи транспортных протоколов (например, TCP/IP, как и при использовании HTTP).

Если интересно, что такое криптографический протокол, то, согласно Википедии, это – набор криптографических алгоритмов (способов шифрования), который определяет порядок их применения и способы использования.

Другими словами, криптографический протокол – это последовательность действий и использования защитных механизмов при передаче и обмене информацией.

SSL (Secure Sockets Layer — уровень защищённых сокетов) появился достаточно давно, в 1995 году, практически одновременно с изобретением самого HTTPS.

А в 1999 году SSL, находясь в версии 3.0, плавно перешёл в другой криптографический протокол TLS (Transport Layer Security — Протокол защиты транспортного уровня), который активно используется по сей день наряду с SSL.

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

В связи с этим, TLS сейчас имеет версию 1.2, которая была выпущена в 2008 году, а SSL и вовсе прекратил своё развитие, оставшись вечно молодым с 1996 года, когда был выпущен SSL 3.0.

Несмотря на то, что эти протоколы родственные и даже используются вместе, из-за чего в литературе можно встретить их упоминание в связке TLS/SSL, работают они всё-таки по-разному.

В связи с этим разработчикам на практике часто приходится совершать дополнительные действия, чтобы информация, защищаемая с помощью TLS/SSL передавалась и распознавалась корректно.

Но я не буду сейчас вдаваться в эти детали, т.к. они могут быть интересны весьма узким специалистам. Если вы к таковым относитесь и хотите прочитать об особенностях SSL и TLS, а также об их сходствах и различиях более детально, то рекомендую вам следующую статью о TLS/LLS.

Хорошо, с тем, как взаимодействуют HTTPS, SSL и TLS более-менее разобрались. А что такое SSL сертификат и каким он боком к HTTPS?

Что такое SSL сертификат?

SSL сертификат – это, как раз, и есть один из защитных механизмов, который используется для шифрования данных при передаче их с применением криптографического протокола TLS/SSL. Именно благодаря наличию сертификата безопасности, можно использовать протокол HTTPS, который и был разработан для создания зашифрованных каналов передачи данных.

doverennyj-ssl-sertifikatПо сути, SSL сертификат является уникальным шифром, с помощью которого кодируется информация, что делает возможным её чтение только тем, кому этот ключ известен.

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

Помимо способа шифрования, SSL сертификат содержит также следующую информацию:

  • наименование владельца сертификата (должно быть уникальным);
  • дата регистрации и срок окончания действия сертификата;
  • полный и уникальный идентификатор регистрационного центра, который выдал сертификат;
  • цифровая подпись регистратора;
  • открытый ключ владельца.

SSL сертификаты выпускаются центрами сертификации (CA — Certification Authority). Также для передачи данных по протоколу SSL возможно использовать «пустой» сертификат (содержит фиктивную информацию о домене и владельце, нужен лишь в тестовых целях для настройки HTTPS соединения) и самоподписанный, более подробно о котором мы поговорим далее.

Окей, для чего нужен SSL сертификат на сайт — понятно, но как он работает?

Как работает SSL сертификат?

Существует два основных пути шифрования информации: симметричным ключ (общий секретный ключ) и асимметричный (открытый ключ). Протокол SSL/TLS поддерживает оба.

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

Данный тип шифрования использует следующие алгоритмы: DES, 3-DES, RC2, RC4 и AES.

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

Асимметричный SSL ключ состоит из двух ключей. Один из них является открытым, который, как правило, публикуется в самом сертификате, а другой – секретным, который никому не сообщается.

Эти ключи работают в паре и выполняют противоположные функции. Если данные шифруются открытым ключом, то расшифровываются они секретным. Если информация кодируется с использованием секретного ключа, то декодируются они открытым. Правда, в случае современных SSL сертификатов работает только вторая схема.

Таким образом, SSL сертификат используется для подтверждения подлинности сервера клиентом и наоборот.

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

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

Это и создаёт защищённый туннель передачи информации, который защищает её от хищения и изменений.

Перед тем, как установить защищенное соединение проверяется также DNS и IP-адрес сервера веб-сайта, прописанные в сертификате, что дополнительно позволяет повысить безопасность передачи данных.

Схематично принцип работы HTTPS можно представить следующим образом:

princip-raboty-https

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

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

Когда после прохождения всех проверок подлинности соединение между клиентом и сервером по протоколу HTTPS всё-таки установлено, в браузере напротив URL загорается красивый зелёный значок, свидетельствующий о защищённости соединения. В разных браузерах его вид может отличаться:

kak-vyglyadit-https-v-raznykh-brauzerakh

Самым распространённым алгоритмом асимметричного SSL шифрования является RSA.

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

Ох уж эта безопасность… Вечно в ней всё запутано :-)

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

Виды SSL сертификатов и их группы

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

Каким образом? Всё просто: стоимость SSL сертификатов различается от их предназначения и области применения.

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

Итак, какие же виды SSL сертификатов существуют и когда какой лучше использовать?

Типы SSL сертификатов по типу валидации

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

Считается, что чем больше данных лица, подающего заявку на оформление SSL сертификата (CSR — Certificate Signing Request), проверяется, тем сложнее его будет подделать и тем большую защиту он будет предоставлять.

От этого также зависит стоимость сертификатов и срок их оформления.

Самоподписанный SSL сертификат (SSC — Self Signed Certificate)

Я решил начать с данного типа, т.к. получить его проще всего и он является единственным абсолютно бесплатным SSL сертификатом среди всех существующих. Самозаверенный, самоизданный, самосозданный — как только данный SSL сертификат не называют :-)

Но у всех этих слов корень «сам», который говорит о том, что содержащаяся в самоподписанном SSL сертификате информация проверена самим создателем. Другими словами, создатель сертификата в данном случае является одновременно и центром сертификации (CA).

Главным плюсом такого SSL сертификата является то, что он является абсолютно бесплатным, создать его можно самостоятельно и в неограниченном количестве. Однако, самоподписанный SSL сертификат обладает одним весьма жирным минусом — он не обеспечивает защиту передаваемым по HTTPS и шифруемым с его помощью данным.

Он делает возможной Main-In-The-Middle атаку на сайт, в ходе которой злоумышленник может перехватить сертификат инициатора зашифрованного соединения и использовать его для дешифровки закодированных данных, передаваемых по HTTPS.

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

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

samopodpisannyj-ssl-sertifikat-ustanovit

Как итог — человек уходит с такого сайта, даже не посмотрев на него, а вы, как владелец, теряете всю свою клиентуру и смысл создания сайта пропадает в целом. А всё — из-за банальной экономии :-)

Поэтому самоподписанный SSL сертификат для основного сайта не годится. Его можно использовать для тестирования HTTPS настроек сервера и сайта, а также для внутренних целей (например, когда на основном ресурсе соединение производится по HTTPS и поэтому его нужно настроить на DEV и STAGE окружениях).

Если хотите, чтобы SSL сертификат увеличивал ваши позиции в поисковой выдаче и повышал доверие пользователей — закажите другой тип сертификата.

SSL сертификат, подтверждающий доменное имя (Essential, DV — Domain Validation)

На этот вид приходится более 70 % всех сайтов на HTTPS в Рунете, т.к. данные SSL сертификаты самые дешёвые и порядок их оформления практически моментальный. Регистрация SSL сертификатов с проверкой прав на владение доменом доступна как физическим, так и юридическим лицам.

Определить сайты с установленным DV SSL сертификатом легко – в адресной строке браузера возле доменного имени светится закрытый зелёный замок.

doverennyj-ssl-sertifikat-v-brauzere

При выдаче такого сертификата в CA (сертификационный центр) отправляется письмо с запросом, который будет удовлетворён лишь когда выяснится, что у вас есть права на владение доменом.

Для этого email, с которого вы отправляете заявку на получение SSL сертификата, должен быть прописан либо в доменной информации WHOIS либо иметь в качестве почтового домена доменное имя сайта, т.е. быть в формате mail@sitename.zone.

Кстати, последний тип email должен иметь в качестве имени только определённые названия, т.е. если вы захотите заказать SSL сертификат для сайта site.ru, то запрос на его получение вы сможете послать в сертификационный центр лишь со следующих email:

  • admin@site.ru
  • administrator@site.ru
  • hostmaster@site.ru
  • postmaster@mail.ru
  • webmaster@mail.ru

Могу предположить, что данное ограничение сделано с целью пресечения атак злоумышленников на сертификационные центры путём автоматизированного отправления заявок на оформление SSL сертификатов и получения к ним доступа.

Также, в качестве альтернативных оправке email средств подтверждения регистрации SSL сертификата компании-регистраторы могут использовать размещение на сайте текстового пустого файла с хэш-названием либо просьбу изменить DNS запись домена сайта, чтобы вы могли подтвердить свои права на обладание доступа к ней.

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

Этот тип SSL сертификата подходит для большинства сайтов, которым HTTPS соединение нужно только лишь для удовлетворения критерий Google и повышения позиций в поисковой выдаче.

Если же помимо данного момента для вас важно также доверие пользователей и существует реальная необходимость обеспечения защиты передаваемых данных (банки, Интернет-магазины и пр. ресурсы, имеющие дело с конфиденциальной информацией пользователей), то лучше обратить внимание на другие виды SSL сертификатов.

SSL сертификаты, подтверждающие организацию (Instant, OV — Organization Validation)

Данный тип SSL сертификатов уже будет содержать указание организации, для которой он регистрируется. Следовательно, процедура выпуска SSL сертификата в данном случае будет несколько отличаться от предыдущего.

Физическое лицо OV сертификат получить не может, регистрация SSL сертификата данной вида доступна только юридическим лицам.

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

Говоря по правде, на практике Instant SSL сертификат ничем не отличается от Essential, т.к. в браузере сайты с данными сертификатами отображаются одинаково — в адресной строке возле доменного имени каждого будет присутствовать зелёный закрытый замок.

informaciya-ob-ssl-sertifikata

Но при этом процедура оформления его сложнее и дольше, чем у предыдущего. Также цена SSL сертификата данного вида будет выше, чем у DV.

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

Таким образом, OV SSL сертификат более безопасный, чем DV, и если у вас есть официально зарегистрированная компания, то лучше остановиться всё-таки на данном варианте.

Если вы хотите оформить именно данный тип SSL сертификата, то заранее приведите в порядок информацию (и для ускорения процедуры переведите её на английский язык), которая будет проверяться CA при выдаче данного SSL сертификата:

  1. Наличие компании в «жёлтых страницах», т.е. в телефонных справочниках организаций. Для регистрации в таком справочнике можете воспользоваться сайтом yp.ru.
  2. Указание организации в WHOIS данных домена, что подтверждает права владения доменным именем.
  3. Документы о регистрации компании.
  4. Также будьте готовы к телефонному звонку из CA на номер, указанный в форме заказа SSL сертификата, или на номер, прописанный в WHOIS данных домена. Будьте готовы, что диалог может вестись на английском языке.

Не факт, что все эти данные будут проверяться, но лучше быть подготовленным :-)

SSL сертификаты с расширенной проверкой (EV — Extended Validation)

Процедура оформления данного вида SSL сертификата самая сложная из всех перечисленных. Зато, в качестве вознаграждения, вы получите указание вашей организации в адресной строке браузера возле доменного имени сайта.

chto-takoe-https-greenline

За эту особенность данный тип SSL сертификатов часто называют «зелёной строкой (Green Line)». Такое новшество увеличивает уровень доверия пользователей к сайту.

Стоит сказать, что порядок выпуска Extended SSL сертификатов не только долгий (порядка 10-14 дней), но ещё и соответствует определённым стандартам, которые были озвучены на специализированном форуме CA/Browser Forum в 2007 году. Он состоит из следующих этапов, выполняемых центром сертификации перед выпуском EV сертификата:

  1. Проверка физической, правовой и операционной деятельности субъекта (компании, получающей сертификат).
  2. Соответствие информации об организации официальным документам.
  3. Проверка организации на обладание исключительными правами на использование домена.
  4. Проверка правомочности выпуска организации Entended Validation SSL-сертификата.

При проверке организации центром сертификации обращают внимание на ту же информацию, что и для OV SSL сертификатов. Следовательно, и сама регистрация доступна только юридическим лицам.

Также следует отметить, что не всякий CA имеет право на выдачу такого сертификата. Для того, чтобы центр сертификации мог выдавать EV SSL сертификаты, он сам должен соответствовать указанным выше требованиям и ежегодно подтверждать это соответствие.

Да, неудобства создаются серьёзные, но зато подделать такой сертификат практически невозможно, за что его часто называют SSL сертификатом повышенной надёжности.

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

Стоимость SSL сертификата повышенной надёжности также самая высокая из всех перечисленных ранее.

Виды SSL сертификатов, учитывающих прочие особенности

Основные типы SSL сертификатов по проверяемой при их регистрации информации мы рассмотрели. Но сертификаты различаются не только по указанному признаку.

poluchit-besplatnyj-ssl-sertifikatДа, тип валидации — основное различие, определяющее основные пункты меню выбора сертификата при заказе его у регистраторов через сайты. Однако, если выбрать какой-то конкретный, то можно обнаружить множество опций, оформленных в виде полей для проставления галочки, которые соответствуют дополнительным особенностям SSL сертификатов.

Вот о них-то мы сейчас и поговорим. Сразу скажу, что, в отличие от приведённых ранее типов SSL сертификата, данные могут комбинироваться с ними и между собой в различных вариантах в зависимости от желания компании-регистратора.

SSL сертификаты с поддержкой повышения уровня шифрования (SGC)

Данный вид SSL сертификатов является устаревшим и был актуален только во времена повсеместного использования старых браузеров, поддерживающих только 40 или 56 битное шифрование.

При использовании данного сертификата уровень шифрования принудительно повышался до 128 бит.

Сейчас смысл такие SSL сертификаты приобретать отсутствует. Тем более, что стоят они достаточно недёшево.

Разве что для внутренних нужд компаний, использующих устаревшие компьютеры и ПО. Но, как правило, внутренние ресурсы закрыты от доступа по внешним IP адресам, так что смысла использования SGC сертификата также мало.

Групповые SSL сертификаты (WildCard)

Данный вид SSL сертификатов можно использовать не только для основного сайта, но и для его поддоменов.

Мало кто знает, но имя сайта в формате site.ru и www.site.ru — это два разных доменных имени, поэтому если вам нужно, чтобы HTTPS соединение было доступно с сайтом в обоих случаях, то WildCard сертификат — это то, что вам нужно (данная особенность может быть оформлена в виде отдельной опции).

При покупке данного типа SSL сертификата стоит учитывать, что они стоят дороже обычных и смысл их покупать есть только если у вас много поддоменов.

Мультидоменные SSL сертификаты (SAN — Subject Alternative Name, MDC — Multi-Domain Certificate, UCC — Unified Communications Certificate)

Также, как и предыдущий вид SSL сертификата, может использоваться одновременно для нескольких сайтов. Но, в отличие от WildCard, с помощью одного SAN сертификата возможно организовывать HTTPS подключение к ресурсам с различными доменными именами, расположенным на одном сервере.

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

Кстати, данный тип SSL сертификата можно использовать в ситуациях, когда вам необходимо настроить HTTPS подключение как к различным ресурсам, так и к их поддоменам.zachem-nuzhen-https-dlya-sajta

Т.е. SAN сертификаты будут идеальным вариантом для вебстудий и фрилансеров, т.к. позволят вам немного сэкономить при массовом подключении HTTPS своим клиентам. только при условии большого числа заказов, естественно, т.к. мультидоменный SSL сертификат — удовольствие не из дешёвых.

Количество доменов, использующих один такой сертификат ограничено и зависит от цены SSL сертификата. «Зелёную строку» данный тип сертификата не позволяет сделать ни на одном из подключаемых доменов.

Однако, есть и ещё одна «ложка дёгтя»: поскольку Green Line данные сертификаты не предоставляют, то подделать их проще, чем стандартные одиночные EV SSL сертификаты. А если взломают один сайт, то автоматически злоумышленники получат доступ ко всем остальным и их поддоменам, использующий общий сертификат.

SSL сертификаты с поддержкой IDN

Этот тип SSL сертификатов необходим для кириллических доменов (содержащих кириллические символы), т.к. они имеют свою специфику. К сожалению, не все регистраторы SSL сертификатов предоставляют данную возможность.

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

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

SSL-cертификаты для ПО (CodeSigning SSL)

Напоследок я решил оставить самый специфичный тип SSL сертификата, который пригодится достаточно ограниченному кругу лиц.

Данный класс SSL сертификатов используется для подписи ПО и скриптов с целью подтверждения автора программы. Также его наличие гарантирует, что код не подвергался изменениям после того, как была наложена цифровая подпись.

CodeSigning SSL сертификат еще называют сертификатом разработчика.

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

Сколько стоит SSL сертификат?

С классами SSL сертификатов мы разобрались. При их перечислении я неоднократно упоминал, что стоимость у них различна от их особенностей.

skolko-stoit-ssl-sertifikatТеперь, когда мы все их изучили, пришло время разобраться со стоимостью SSL сертификатов, т.к. многих от положительного решения вопроса о том, нужен ли SSL сертификат сайту останавливает порой именно эта информация.

Точнее, не сама информация, а преувеличенные слухи от знакомых, которые устанавливали себе на ресурсы самые защищённые SSL сертификаты, а следовательно, и дорогие.

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

Итак:

  • Самоподписанный SSL сертификат — абсолютно бесплатный, но подходит только для тестовых целей;
  • DV – от 10-20$ в год, бесплатный SSL сертификат можно получить только для некоммерческого использования (например, персональных блогов без монетизации) или лишь на ограниченное время;
  • OV — от 50-60$ до нескольких сотен в год;
  • EV – от 150-300$ в год;
  • Wildcard — от 100 $ в год, т.е. смысл его есть приобретать, если у вас есть более 5 поддоменов;
  • SAN – от 60 $, в зависимости от количества доменов;
  • SGC — от 300$ в год, так что при наличии лишних денег лучше вместо этой опции купить мультидоменный SAN;
  • IDN — за данную опцию, как правило, дополнительно доплачивать не придётся;
  • CodeSigning SSL — от 90$ в год.

От себя могу сказать, что цены далеко не заоблачные. Не настолько, чтобы рисковать безопасностью и удобством процесса установки и настройки ради получения бесплатного SSL сертификата для сайта, к которой стремятся многие отечественные бизнесмены вслед за бесплатной Windows, фильмами и крякнутыми играми.

Где купить SSL сертификат?

Приобрести SSL сертификат вы можете либо у официальных сертификационных центров, либо обратиться к хостинг-провайдерам, которые выступают посредниками.
Плюсы и минусы есть у каждой группы продавцов: у первых стоимость зачастую выше, чем чем у хостинг провайдеров, зато вторые при недобросовестном подходе могут подсунуть вам «левый», который скорее не поможет сайту, а навредит ему.
Среди официальных CA бессменными лидерами являются следующие:

  1. Comodo
  2. Twawte
  3. Geotrust
  4. GoDaddy
  5. GlobalSign
  6. Symantec

Статистика выпуска SSL сертификатов данными компаниями выглядит так:

zachem-nuzhen-ssl-sertifikat

Если говорить о хостинг-провайдерах, то могу порекомендовать те, услугами которых пользуюсь лично уже на протяжении более 2 лет — TheHost, у которого можно купить дешёвые SSL сертификаты можно, начиная от 7,5$ в год, и AvaHost, которые вообще выдают SSL сертификаты бесплатно своим клиентам. Если не верите — убедитесь сами :-)

Если захотите воспользоваться услугами второго хостера, то у меня для вас приятная новость — это эксклюзивный промокод на скидку в 20% на услуги AvaHost исключительно для читателей и друзей проекта cccp-blog.com. Используйте его при регистрации и экономьте ещё больше — AVA-CCCPBLOG

При покупке SSL сертификатов помимо перечисленных ранее особенностей следует учитывать ещё и следующие:

  • У SSL разная скорость выпуска. Одни станут доступными для вас уже через 10 минут, а другие придется ждать несколько недель.
  • Некоторые сертификаты даются лишь на 1 год, без возможности перевыпуска по старой цене.
  • Центры сертификации предоставляют гарантию пользователям, как дополнительный актив и подтверждение репутации. Например, если ваш сайт взломают через подделку SSL сертификата, вы сможете получить компенсацию от 10000$ до нескольких миллионов.
  • Некоторые регистраторы предоставляют тестовый период, в течении которого пользоваться SSL сертификатом можно бесплатно.
  • Часто у регистраторов встречаются всякого рода акции, в рамках которых SSL сертификат можно получить бесплатно при заказе доменного имени либо с громадными скидками в 50% и выше.
  • Возврат средств (манибэк, moneyback) в течении 30 дней после покупки, если качество товара вас по каким-то причинам не устраивает.

У каждого регистратора SSL сертификатов условия разные и поэтому их всегда нужно уточнять перед тем, как купить SSL сертификат.

Поэтому я и перечислил все возможные «подводные камни», на которые следует обращать внимание. Если вы столкнётесь с ещё какими-то, то дайте мне об этом знать в комментариях :-)

Нужен ли HTTPS сайту?

nuzno-li-perekhodit-na-httpsПереход на HTTPS – это важный шаг для любого вебмастера. Пользователи привыкли видеть надежный замок рядом с адресной строкой и очень пугаются, когда браузеры говорят о небезопасности перехода. Для владельца сайта переход на https – это новый уровень безопасности и новые возможности для продвижения в поисковой выдаче.

Но так ли всё однозначно? Нужен ли HTTPS сайту вообще?

Для того, чтобы определиться с тем, стоит ли переходить на HTTPS, давайте ещё раз проанализируем все особенности данного протокола, а также достоинства и недостатки установки SSL сертификатов.

Плюсы HTTPS протокола следующие:

  1. Пользователь однозначно идентифицируется посредством SSL сертификата. Вы точно знаете, с кем соединены в момент передачи данных на сайте. Просто нажмите на замочек в адресной строке, и вы получите информацию о компании, которой был выдан данный сертификат. Это предотвращает случаи мошенничества и позволяет быстро выявлять правонарушителей.
  2. Данные защищаются от изменения в процессе передачи. Еще одной причиной, зачем нужен HTTPS, стало резкое увеличение количества взломов сайтов путем перехвата сообщений. Хакеры могли просматривать передаваемые между сервером и клиентом пакеты данных и инкапсулировать в них вредоносную информацию. Простыми словами, они видели, что запрашивает сервер, глушили ответ от клиента и направляли свои пакеты данных. Применение HTTPS полностью исключило подмену данных, поскольку в зашифрованном канале передается и контрольная сумма. Любая попытка изменить данные приведет к изменению целостности, которая будет замечена сервером.
  3. Относительно низкая стоимость SSL сертификатов, необходимых для подключения HTTPS. Цены стартуют с 10$ за год использования. К тому же постоянно проводятся различные акции, благодаря которым можно получить SSL сертификат бесплатно либо с огромной скидкой.
  4. Простота подключения HTTPS благодаря автоматизированным инструментам в панелях управления большинства современных хостингов. Благодаря ним в большинстве случаев установку SSL сертификата на сайт можно выполнить самостоятельно и нет необходимости в платных услугах профессионалов. Кроме того, по большинству моментов, возникающих в процессе инсталяции, вас смогут проконсультировать сотрудники хостингов и CA.
  5. Польза HTTPS для SEO. При одинаковых условиях, сайты на устаревшем HTTP будут ранжироваться хуже в поисковиках, чем с HTTPS, поскольку они вызывают меньше доверия. Официально использование HTTPS было включено в перечень факторов ранжирования еще в 2015 году. Представители Google настойчиво рекомендуют сайтам перейти на HTTPS как можно скорее, поскольку роль этого протокола в ранжировании будет только расти.
  6. Более точная аналитика. Мало кто знает, что HTTPS даёт возможность получать более точное количество переходов на сайт через различные сервисы аналитики, чем при использовании HTTP. Это связано с потерей информации о переходе при переключении с HTTPS на HTTP. Например, если подключение к вашему сайту происходит по стандартному HTTP протоколу, а к вам на сайт зашёл пользователь с HTTPS сайта, то переход будет засчитан как прямой, а не с другого ресурса.

Однако, за все эти преимущества HTTPS нужно рано или поздно платить. Поэтому при установке SSL сертификата на сайт нужно быть в курсе минусов HTTPS, которые могут привести к достаточно серьёзным проблемам:

  1. HTTPS использует SSL сертификаты, которые в большинстве случаев платные. Бесплатные варианты для основных сайтов и коммерческого использования не годятся.
  2. Неправильная установка SSL сертификата может полностью сделать сайт недоступным для поисковых роботов и пользователей, что чревато падением посещаемости и ухудшением позиций в ПС.
  3. Из-за ошибок конфигурирования HTTPS на сайте может возникнуть большое количество дублей страниц, либо некоторые могут остаться на HTTP, что также может стать поводом к снижению позиций в поисковой выдаче и появлением сообщения о небезопасности соединения в браузерах. Если ссылки внутри сайта были прописаны вручную, то после перехода на HTTPS без настройки редиректа они перестанут работать.
  4. Несмотря на простоту подключения SSL сертификата на сайт, которое можно выполнить самостоятельно, необходимы будут специальные настройки сайта, с которыми вы вряд ли справитесь самостоятельно без особых знаний (речь идёт о 301 редиректах и добавлении правил маршрутизации для HTTPS адресов).
  5. Компания, выдавшая SSL сертификат, может отозвать его в любой момент без объяснения причин, что также может обернуться снижением посещаемости ресурса в целом.
  6. Незначительно, но замедляется скорость подключения к сайту, поскольку для обработки запросов требуется расшифровка и шифрование ответов.

Как видите, плюсов и минусов HTTPS достаточное количество. Если резюмировать всё вышесказанное, то перевод сайта на HTTPS действительно сулит много пользы, однако, малейшая ошибка в его настройке приведёт вас к потере ваших позиций в поисковой выдаче и клиентов.

kupit-ssl-sertifikat-deshevoПри переводе существующего сайта на HTTPS существует большая вероятность ошибки, вследствие чего вы можете потерять из выдачи как некоторые страницы, так и весь сайт. Именно по этой причине я и не спешу переводить данный сайт на HTTPS. Тем более, что в сети сейчас полно ресурсов с высокой посещаемостью, которые по-старинке используют HTTP.

К тому же, HTTPS — это не панацея в вопросах безопасности. В 2011 году иранские хакеры в рамках централизованной атаки в ответ на санкции США взломали CA компаний Comodo и DigiNotar и похитили сотни тысяч сертификатов, которые можно использовать для подмены пакетов.

Не менее обескураживающим известием в этом году стало то, что среди похищенных сертификатов были принадлежащие ЦРУ, Моссаду, Британской разведке MI-6. Таким образом, защищенные ресурсы стали попросту бесполезными для этих известных организаций и стали угрожать комплексной безопасности, ведь хакеры стали рассылать по фальшивым сертификатам трафик, получая ответы от банков, почтовых и грузовых компаний, и других стратегически важных объектов.

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

Но всё же HTTPS нужен этому миру, о чём свидетельствует более, чем лояльное отношение к нему Google. Скажу более: это чуть ли не единственная весомая на сегодня причина покупки SSL сертификатов вообще. К тому же, пусть информация о взломе центров сертификации вас не пугает — прошло уже много лет с тех пор и специалисты по безопасности сделали определённые выводы по поводу уязвимостей своих систем.

nuzhen-li-https-sajtuТак что описанную выше информацию принимайте просто как известный факт :-) Также целью размещения списка проблем, к которым может привести неправильная настройка и установка SSL сертификатов, было замотивировать вас обращаться за помощью к профессионалам. Причём не только в области программирования, но и SEO, которые позволят вам сделать необходимые настройки с минимальным ущербом.

Но есть и ещё один выход — это подписаться на обновления данного проекта с помощью ссылки в начале статьи, чтобы быть в курсе выхода статьи с полным перечнем инструкций и наглядных примеров по самостоятельной установке SSL сертификата на сайт, которую я планирую.

В случае же старта нового проекта я бы однозначно использовал HTTPS для передачи данных на самом старте, пока страницы не попали в индекс поисковиков и риск что-то поломать был бы минимален. Тем более, что цена SSL сертификатов сегодня достаточно смешная.

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

Ну, а в целом, осуществлять ли вам перевод сайта на HTTPS или нет — дело сугубо ваше личное. Моей целью было лишь призвать вас ответственно подходить к данному шагу, а не делать всё с бухты-барахты :-)

На этом у меня всё. Надеюсь, что статья помогла вам ответить на вопросы о том, что такое HTTPS, SSL, TLS, а также зачем нужен SSL сертификат, какими они бывают, где и как их можно купить.

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

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

Всем удачи и до новых встреч :-)

Делаем слайдер на JavaScript своими руками

js-slajderВсем привет! :-)

Поскольку я работаю Fullstack PHP разработчиком, то иногда приходится решать задачи, связанные с фронтэндом, несмотря на то, что я его недолюбливаю :-)

О моём отношению к всему, что связано с «прекрасным» вы, собственно говоря, могли оценить по дизайну данного сайта, который разрабатывался мною единолично :-)

Однако, сравнительно недавно я столкнулся с необходимостью реализации слайдера на JavaScript, причём сделать это нужно было без каких-либо готовых библиотек и даже без всеми любимого jQuery.

Вызвана данная необходимость была тем, что в результате должен был получиться JS скрипт, который через сторонний сервис подключался бы на сайт. Следовательно, готовые карусели на JavaScript сразу отпадали, т.к. для их интеграции нужно было в HTML код сайта добавлять подключение библиотеки через тэг script и копировать сами файлы либы на сервер или тянуть их по cdn, но для этого снова потребовалось бы править код ресурса.

Поскольку мои возможности были ограничены, я остановился на разработке слайдера для сайта на HTML, CSS JS с нуля без каких-либо сторонних библиотек, чем и решил поделиться с вами в сегодняшней статье.

Как сделать JavaScript слайдер: начало

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

Заказчикам всегда наплевать на то, как код написан, какая у него архитектура, главное — видеть результат!

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

В качестве основы я взял этот JavaScript слайдер изображений — https://codepen.io/gabrieleromanato/pen/pIfoD.

Остановиться я решил именно на нём, т.к. его JS код был написан с применением принципов ООП и классы в нём основываются на прототипах, а не на банальных функциях.

Честно говоря, я глубоко не понимаю и не признаю сегодняшнюю шумиху вокруг JavaScript с использование ООП, фреймворков и прочих архитектурных штук в языке, который изначально задумывался как простенький язык динамических сценариев. Равно как и сам JS я откровенно недолюбливаю с его синтаксическим винегретом, позволяющим одни и те же конструкции писать несколькими способами.

Но, к сожалению, в современном мире мои позиции мало кто разделяет, т.к. данный язык развивается сумасшедшими темпами и предпринимает даже попытки завоевать умы бэкенд разработчиков с помощью Node.js как альтернативы Java, PHP, C#, Ruby и других монстров.

В итоге, чтобы банально не остаться без работы, приходится по-тихоньку с JavaScript разбираться. А в выбранной мною реализации слайдера на чистом JavaScript я встретил то, что, как вы поняли, презираю в данном языке. Поэтому я её и выбрал, чтобы был хоть какой-то повод поработать и разобраться с JavaScript ООП и прототипными классами — иначе я бы к ним добровольно никогда в жизни не прикоснулся бы :-)

На базе найденного мною кода мне необходимо было разработать слайдер на чистом JS во всплывающем окне (такую штуку ещё называют popup, попап и т.д.), который имел бы кнопки переключения слайдов и кликабельные индикаторы текущего слайда. Также нужно было сделать кнопку для закрытия данного окна.

Вот, что у меня получилось в итоге.

Делаем библиотеку JS слайдера

Сперва я решил всё реализовать по уму и сделать JavaScript слайдер для сайта в виде библиотеки, подключаемой на сайт одним-единственным скриптом, в котором будут вызываться компоненты слайдера, разбитые по подкаталогам. Назвать её я решил popupSlider.js в честь её изначального предназначения.

Её код можно найти на GitHub по этому адресу — https://github.com/Pashaster12/popupSlider.js

Структура библиотеки вышла следующая:

kak-sdelat-javascript-slajder-svoimi-rukami

Папка slides предназначена для картинок слайдов. В controls размещены картинки элементов управления JS каруселью (кнопки закрытия слайдера и переключения слайдов). А в assets — статические элементы JS слайдера: HTML разметка и файл с CSS стилями.

Ну, а файл popupSlider.js — это и есть сердце самой библиотеки, в котором прописаны действия JavaScript карусели и устанавливается связь с остальными файлами. Именно его мы и будем подключать на сайте, а он уже будет вызывать остальные.

Я решил начать с HTML разметки нашей JS карусели картинок, которая в моём случае выглядит так:

<div id="cq-popup-bg"></div>
<div id="cq-popup">
    <a id="cq-popup-btclose" href="#"></a>
    <div id="slider">
        <div id="slider-wrapper">
            <div class="slide">
                <img src="slides/1.jpg" alt="" />
                <div class="caption">
                    <div class="caption-container">
                        Text 1
                    </div>
                </div>
            </div>
            <div class="slide">
                <img src="slides/2.jpg" alt="" />
                <div class="caption">
                    <div class="caption-container">
                        Text 2
                    </div>
                </div>
            </div>
            <div class="slide">
                <img src="slides/3.jpg" alt="" />
                <div class="caption">
                    <div class="caption-container">
                        Text 3
                    </div>
                </div>
            </div>
        </div>
        <div id="slider-nav">
            <a href="#" data-slide="0" class="current"></a>
            <a href="#" data-slide="1"></a>
            <a href="#" data-slide="2"></a>
        </div>
        <a href="#" class="horizontal-controls" id="prev"></a>
        <a href="#" class="horizontal-controls" id="next"></a>
    </div>
</div>

Для оформления слайдера на JavaScript в виде попапа я использовал следующие стили:

#slider {
    margin: auto;
    width: 600px !important;
    overflow: hidden;
}
#slider-wrapper {
    width: 9999px;
    height: 343px;
    position: relative;
    transition: left 400ms linear;
}
.slide {
    float: left;
    width: 600px;
    position: relative;
    overflow: hidden;
}
.caption {
    width: 600px;
    height: 110px;
    line-height: 1.5;
    font-size: 15px;
    font-weight: 300;
    text-align: center;
    color: #000;
    display:table;
}
.caption-container {
    display: table-cell;
    vertical-align: middle;
    padding: 0 20px;
}
#slider-nav {
    position: absolute;
    bottom: -36px;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
}
#slider-nav a {
    width: 8px;
    height: 8px;
    text-decoration: none;
    color: #000;
    display: inline-block;
    border-radius: 50%;
    margin: 0 5px;
    background-color: #fafafa;
}
#slider-nav a.current {
    background-color: #337ab7;
}
.horizontal-controls {
    position: absolute;
    display: inline-block;
    width: 12px;
    height: 20px;
    top: 50%;
    margin-top: -10px;
}
#prev {
    background: url(../controls/arrow_left_inactive.png);
    left: -40px;
}
#prev:hover {
    background: url(../controls/arrow_left_active.png);
}
#next {
    background: url(../controls/arrow_right_inactive.png);
    right: -40px;
}
#next:hover {
    background: url(../controls/arrow_right_active.png);
}
#cq-popup {
    width: 600px;
    z-index: 23;
    left: calc(50%);
    top: calc(50%);
    position: fixed !important;
    background-repeat: no-repeat;  
    background-position: right;
    background-color: #fff;
    font-family: "Roboto","Segoe UI","Helvetica","Georgia","Calibri","Verdana";
    transform: translate(-50%, -50%) scale(1);
}
#cq-popup .header {
    display: inline-block;
    font-size: 17px;
    font-weight: 500;
}
#cq-popup > div {
    width: 500px;
    font-size: 22px;
    line-height: 36px;
}
#cq-popup-btclose {
    text-decoration: none;
    position: absolute;
    right: -40px;
    top: 0;
    background: url(../controls/btn_delete_inactive.png);
    height: 16px;
    width: 16px;
}
#cq-popup-btclose:hover {
    background: url(../controls/btn_delete_active.png);
}
#cq-popup-bg {
    position: fixed;
    top:0; 
    width: 100%; 
    height: 100%;
    background: rgba(51,51,51,0.8);
    z-index: 22;
}

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

kak-napisat-js-slajder-svoimi-rukami-struktura

И HTML разметку, и CSS стили я вынес в отдельные файлы popupSlider.html и popupSlider.css, которые расположены в директории assets библиотеки слайдера на JavaScript. Я сделал это специально, чтобы пользователи при использовании данного кода могли без проблем корректировать разметку и оформление, не лазя в JS коде, где вынесенное нужно было бы прописать напрямую.

Кроме того, многие ещё любят минимизировать JS для ускорения загрузки сайта. Так что кастомизировать данное решение при указанных условиях было бы очень сложно.

В итоге, я решил просто подключать готовые файлы в главном файле библиотеки popupSlider.js, который для моей постановки задачи принял следующий вид:

function Slider(element) {
    this.loadStatic();
    this.el = document.querySelector(element);
    this.init();
}

Slider.prototype = {
    init: function () {
        this.links = this.el.querySelectorAll("#slider-nav a");
        this.wrapper = this.el.querySelector("#slider-wrapper");
        this.nextBtn = this.el.querySelector("#next");
        this.prevBtn = this.el.querySelector("#prev");
        this.navigate();
    },
    navigate: function () {

        var self = this;

        for (var i = 0; i < this.links.length; ++i) {
            var link = this.links[i];
            link.addEventListener("click", function (e) {
                self.slide(this);
            });
        }

        self.prevBtn.style.display = 'none';

        self.nextBtn.addEventListener('click', function (e) {
            var currentSlideNumber = document.querySelector('#slider-nav a.current').getAttribute("data-slide");
            var nextSlide = document.querySelector('[data-slide="' + (parseInt(currentSlideNumber, 10) + 1) + '"]');

            nextSlide.click();
        }, false);

        self.prevBtn.addEventListener('click', function (e) {
            var currentSlideNumber = document.querySelector('#slider-nav a.current').getAttribute("data-slide");
            var prevSlide = document.querySelector('[data-slide="' + (parseInt(currentSlideNumber, 10) - 1) + '"]');

            prevSlide.click();
        }, false);

        self.close();
    },

    slide: function (element) {
        this.setCurrentLink(element);

        var index = parseInt(element.getAttribute("data-slide"), 10) + 1;
        var currentSlide = this.el.querySelector(".slide:nth-child(" + index + ")");

        this.wrapper.style.left = "-" + currentSlide.offsetLeft + "px";

        if (index < this.links.length)
            this.nextBtn.style.display = 'block';
        else if (index == this.links.length)
            this.nextBtn.style.display = 'none';

        if (index > 1)
            this.prevBtn.style.display = 'block';
        else if (index == 1)
            this.prevBtn.style.display = 'none';
    },

    setCurrentLink: function (link) {
        var parent = link.parentNode;
        var a = parent.querySelectorAll("a");

        link.className = "current";
        this.currentElement = link;

        for (var j = 0; j < a.length; ++j) {
            var cur = a[j];
            if (cur !== link) {
                cur.className = "";
            }
        }
    },

    loadStatic: function () {

        var self = this;

        var link = document.createElement('link');
        link.rel = 'stylesheet';
        link.href = 'assets/popupSlider.css';
        document.head.appendChild(link);

        var sliderHTML = '';

        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'assets/popupSlider.html', false);
        xhr.send();
        if (xhr.status != 200) {
            alert('Can not load the popupSlider.html. Got the error ' + xhr.status + ': ' + xhr.statusText);
        } else {
            sliderHTML = xhr.responseText;
        }

        var div = document.createElement('div');
        div.innerHTML = sliderHTML;
        document.body.appendChild(div);
    },

    close: function () {
        document.getElementById('cq-popup-btclose').onclick = function () {
            document.getElementById('cq-popup-bg').remove();
            document.getElementById('cq-popup').remove();
        }
    }
};

Немного комментариев по поводу приведённого кода. Содержимое файла popupSlider.js является одним JavaScript классом Slider, который, как и в PHP, содержит конструктор и методы класса. Только в JS определение конструктора, в отличие от PHP, является обязательным.

Конструктор определяется с помощью следующей конструкции:

function Slider(element) {
    //код конструктора
}

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

Сами методы класса будут находиться внутри прототипа и будут доступны для всех экземпляров данного JavaScript класса. JS прототип в моём случае описывается следующей конструкцией:

Slider.prototype = {
    //методы
}

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

var slider = new Slider();
slider.class_method();

А внутри самого кода класса доступен следующий способ:

this.class_method();

Главное только не забывать, что в JavaScript значение this зависит от контекста вызова, поэтому в телах некоторых методов, в которых нужно было вызывать методы и свойства класса, присутствует такая конструкция:

var self = this;
self.class_method(); //чтобы обратиться к методу, находящемся на уровень выше кода описываемого метода

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

loadStatic()

Самый первый метод, вызывающийся при создании экземпляра класса в конструкторе. Отвечает за добавление в HTML кода страницы сайта HTML разметки слайдера и файла со стилями.

Сначала в памяти создаётся новый тэг link с помощью JavaScript функции document.createElement() и ему присваиваются значения всех необходимых атрибутов, в том числе и путь к CSS файлу со стилями JS слайдера. И, в конце-концов, он добавляется в HTML страницы с помощью JavaScript метода appendChild() в конец секции head, где и должны подключаться CSS файлы стилей.

Далее мы делаем то же самое для файла с HTML разметкой нашего слайдера на чистом JavaScript. Вот только здесь есть маленький нюанс: просто так HTML файл внутри такого же подключить нельзя, как мы сделали это с CSS файлом. Для этого есть специальные библиотеки, например, для того, чтобы подключить HTML в HTML, отлично подходит либа от w3.org — https://www.w3schools.com/howto/howto_html_include.asp

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

В итоге, я решил получать содержимое HTML файла внутри JavaScript кода и загружать его в новый div элемент, создаваемый в памяти, как я делал это ранее для подключения CSS файла в JavaScript. Сгенерированный элемент подключается в самый конец секции body HTML кода страницы сайта.

Если хотите вставить div с разметкой слайдера не просто в конец body, а в какой-то конкретный контейнер, то можете вместо следующего кода:

var div = document.createElement('div');
div.innerHTML = sliderHTML;
document.body.appendChild(div);

Прописать следующее, указав нужный идентификатор целевого контейнера (в моём случае HTML JS слайдера будет расположен в элементе с id popupSlider):

var target = document.querySelector( "#popupSlider" );
target.innerHTML = sliderHTML;

init()

Метод, который вызывается в конструкторе после loadStatic(), и нужен для инициализации свойств класса, соответствующих основным HTML элементам, к которым мы будем обращаться в следующем коде.

В конце вызывается метод navigate().

navigate()
В данном методе происходит указание действий, происходящих при клике на кнопки переключения слайдов и элементы навигации, расположенные под самим слайдером, в виде кружочков.

Сам JavaScript код смены слайдов для удобства я вынес в отдельный метод slide(), а в данном я только навешиваю его на событие click для каждой круглой кнопки в цикле.

При клике на кнопки «предыдущий слайд»/»следующий слайд» я, как видите, решил всего лишь эмулировать нажатие на соответствующий кружочек, определяя нужный относительно текущего, у которого имеется CSS класс current.

slide(element)

Метод, «отвечающий за магию» самой JavaScript карусели, в котором содержится код, меняющий слайды местами. В самом начале вызывается метод setCurrentLink(), о котором мы поговорим чуточку позже.

В качестве входного параметра в него передаётся объект кнопки навигации JS слайдера в виде кружочка.

Само переключение слайдов работает следующим образом:

  1. Все слайды у нас оформлены в виде блоков одинаковых размеров, идущих друг за другом. Окно слайдера — это лишь видимая часть элемента, содержащего все слайды.
  2. Мы определяем смещение левого края текущего слайда от левого края родительского элемента с помощью свойства offsetLeft.
  3. И сдвигаем родительский элемент на это значение, чтобы в окне слайдера у нас отображался необходимый элемент.

В конце метода описано поведение для кнопок «предыдущий слайд»/»следующий слайд», оформленных в виде стрелок влево/вправо соответственно. Если текущий слайд — первый из всего списка, то кнопка перехода к предыдущему слайду скрывается. Если последний, то убираем кнопку перехода к следующему слайду.

setCurrentLink(link)

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

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

Логика выделения текущего элемента проста:

  1. Получаем объект родительского элемента, которым в нашем случае выступает контейнер с идентификатором slider-nav.
  2. Получаем все навигационные элементы в виде массива ссылок.
  3. Выделяем элемент, полученный на входе, путём добавления ему классу current.
  4. В цикле перебираем все навигационные элементы и у всех, кроме текущего, очищаем значение класса. Это нужно для того, чтобы снять выделение с элемента, которым был текущим до данного вызова функции.

close()

Самый последний метод класса, в котором определяется действие при нажатии на кнопку закрытия слайдера в виде крестика. Здесь, собственно говоря, код самый понятный из всего, содержащегося в классе JS слайдера.

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

Сам метод вызывается внутри описанного ранее navigate(), который содержит в себе все сценарии действий, происходящих на нашем JavaScript слайдере.

Кстати, если вы захотите сделать закрытие слайдера при клике за его пределами, то достаточно в данный метод добавить следующий код:

document.getElementById('cq-popup-bg').onclick = function () {
document.getElementById('cq-popup-bg').remove();
document.getElementById('cq-popup').remove();

JavaScript слайд шоу на базе разработанной библиотеки

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

На самом деле, реализация JavaScript слайд шоу отличается от обычного слайдера совсем незначительно. Разница заключается лишь в том, что в слайд шоу слайды переключаются автоматически с заданным временным интервалом, а в случае обычной JS карусели они меняются вручную с помощь элементов навигации.

Для автоматической прокрутки слайдов я добавил в самый конец своего класса следующий метод:

slideShow: function (timeout) {
    var sliderCount = this.links.length;
    var self = this;

    this.slideCycle = setInterval(function () {
        var currentSlideNumber = document.querySelector('#slider-nav a.current').getAttribute("data-slide");
        var slideId = parseInt(currentSlideNumber, 10) + 1;
        self.slide(document.querySelector('[data-slide="' + (sliderCount == slideId ? 0 : slideId) + '"]'));
    }, timeout);
}

Что здесь происходит — думаю, понятно. Для создания данного метода я скопировал код из события клика на кнопки ручного переключения слайдов и разместил его внутри вызова JavaScript функции setInterval(), которая выполняет указанное действие через заданный промежуток времени.

Сценарий действия передаётся первым аргументом в виде анонимной функции, а временной интервал — вторым, который я решил сделать в виде переменной, значение которой передаётся при вызове slideShow().

Единственная модификация кода внутри setInterval(), которая потребовалась, — это определение количества слайдов и сравнение с ним индекса текущего слайда для зацикленности автоматического переключения.

Ну, и для того, чтобы данный код заработал, сам метод необходимо вызвать. Я решил сделать это всё в том же navigate(), который как раз и является сборником всяких сценариев. Вызов я разместил в самом конце, передав в качестве аргумента значение временного интервала для автоматической смены слайдов в нашем JS слайд шоу (я выбрал 2000 милисекунд или 2 секунды, вы можете по необходимости изменять это число):

self.slideShow(2000);

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

По идее, всё должно работать. Если нет — изучайте ошибки в консоли браузера и делитесь ими в комментариях.

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

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

Для прерывания автоматического показа слайдов JavaScript карусели я решил воспользоваться стандартной JS функцией clearInterval(), которой в качестве аргумента передаю идентификатор временного интервала, возвращаемого функцией setInterval() при его установке.

В итоге, получился следующий код, который я решил не оформлять отдельным методом:

clearInterval(self.slideCycle);

И разместил его в местах описания действий при кликах на различные элементы навигации, т.е. в следующих:

link.addEventListener("click", function (e) {...});

self.prevBtn.addEventListener('click', function (e) {...});

self.nextBtn.addEventListener('click', function (e) {...});

Вызов clearInterval() лучше делать поближе к самому событию клика, главное, чтобы перед ним, а не после.

Интеграция JavaScript слайдера на сайт

Итак, наш слайдер на чистом JS готов. Осталось теперь только подключить его на сайт.

Для этого необходимо выполнить последовательно следующие шаги, которые являются стандартными действиями при интеграции каких-либо сторонних JavaScript библиотек вообще.

Шаг 1. Копируем файлы библиотеки к себе на сайт в отдельный каталог.
Шаг 2. Добавляем следующий код в HTML страниц, на которых необходимо будет отображение слайдера, разместив его перед закрывающимся тэгом body:

<script type="text/javascript" src="/каталог_слайдера/popupSlider.js"></script>

Шаг 3. Размещаем следующий код вызова JS карусели в каком-либо существующем JavaScript файле, который подключается на странице после подключения самого слайдера:

var aSlider = new Slider("#slider");

Как видите, данный код, — это, по сути, создание объекта класса Slider, который содержится в popupSlider.js. Именно поэтому его вызов должен быть только после подключения самого файла класса на страницу.

Добавление новых слайдов в JavaScript карусель

Здесь всё очень просто. Поскольку слайды у нас берутся из отдельной директории библиотеки slides, то при добавлении новых картинок нужно будет просто закинуть в неё нужные файлы, задав им предварительно такой же размер, как и у других.

А затем в коде файла assets/popupSlider.html добавить новый блок в контейнер с id slider-wrapper:

<div class="slide">
    <img src="slides/new_slide.jpg" alt="" />
    <div class="caption">
        <div class="caption-container">
           Text
        </div>
    </div>
</div>

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

Также необходимо будет добавить новый элемент навигации в виде кружочка, т.к. на данный момент автоматическое его добавление пока не реализовано. Для этого нужно будет добавить следующий код в контейнер с id slider-nav, прописав его в самом конце:

<a href="#" data-slide="id"></a>

Значение атрибута data-slide должно быть больше самого большого у остальных элементов. Достаточно всего лишь увеличить максимальное текущее на единицу.

Упаковка JS карусели в единый скрипт

Всё, слайдер на JavaScript готов и подключен. Я лично рекомендую использовать данный вариант на практике, если он вам вообще пригодится :-)

Для ускорения работы его, кстати, можете ещё дополнительно сжать статические компоненты: CSS, HTML и JavaScript файлы. Я не стал этого делать и предлагать вам минифицированный код, потому что систем сборок фронтэнда сейчас очень много: Gulp, Grunt, Webpack и другие. И у каждой из них свои алгоритмы сжатия и подключения файлов.

К тому же, минифицированные результаты на разных ОС могут работать по-разному. В общем, причин много.

Да и сами исходники у меня вышли, я считаю, не такие уж тяжеловесные, что нуждаются в данной процедуре. Но если же вам они будут необходимы, то настройте минификацию самостоятельно с учётом вашей ОС и сборщика.

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

Так вот, в завершение своего сегодняшнего повествования я решил поделиться с вами финальной версией своей JavaScript карусели, которую я использовал на практике. Возможно, кому-то данный способ будет полезен. Он также пригодится тем, кто будет подключать предоставленную мною библиотеку через системы сборки Webpack, Gulp, Grunt и при этом столкнётся с проблемой правильности файловых путей.

Тогда вариант единого скрипта JavaScript карусели вам придётся как нельзя кстати, т.к. весь контент будет содержаться прямо в нём, в том числе и HTML/CSS код, который в случае библиотеки хранится в отдельных файлах.

Скрипт в моём случае состоит из двух частей. В первой части располагалось содержимое файла popupSlider.js, которое я второй раз не буду приводить. Вставьте его самостоятельно, убрав из кода класса описание метода loadStatic() и его вызов, т.к. они нам не понадобятся.

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

Там у нас будет происходить добавление на страницу HTML/CSS кода JS карусели и создание объекта класса Slider, что равносильно активации самого слайдера.

Схематично код выглядит следующим образом:

/* содержимое popupSlider.js без описания метода loadStatic() и его вызова */

document.addEventListener('DOMContentLoaded', function(){
    var str = '\
         <style>\
             /*css код*/
         </style>\
         /* html код */
         ';

    var div = document.createElement('div');
    div.innerHTML = str;
    document.body.appendChild(div);

    var aSlider = new Slider("#slider");

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

Если у вас таких сложностей нет, то можете ничего не менять, но не забыть скопировать каталоги slides и controls библиотеки на сервер и указать правильные пути к ним.

Самописный JS слайдер — перспективы развития

Честно скажу, что заниматься целенаправленной поддержкой и развитием созданного мною решения я заниматься не планирую :-) На данный момент подобных слайдеров существует вагон и маленькая тележка, которые, в отличие от моего имеют свою историю, тщательно оттестированы и поддерживаются обширным комьюнити пользователей и разработчиков.

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

Так что если вам, как и мне, нужна будет кодовая база для экспериментов и вы располагаете хоть каким-то лишним свободным временем — копируйте себе код описанного мною JavaScript слайдера или присоединяйтесь к контрибьюторам на GitHub. Репозиторий открытый, а ссылку на него я предоставил в начале статьи.

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

  1. сделать внешний конфиг, чтобы можно было удобно настраивать слайдер;
  2. сделать возможность встраивания слайдера внутрь страницы (сейчас оформлен только в виде попапа);
  3. асинхронная загрузка HTML кода (сейчас сделана синхронная, которая многими браузерами помечается как устаревший вариант);
  4. оформить библиотеку в виде пакета, NPM, Bower или другого пакета, чтобы его можно было устанавливать и оперировать зависимостями с помощью пакетных менеджеров;
  5. сделать вёрстку адаптивной для использования JS карусели на различных устройствах;
  6. сделать переключение слайдов по событию Swipe для мобильных пользователей.

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

Прошу мой код строго не судить, т.к., я как я уже говорил, Frontend спецом я себя не считаю и не являюсь. Также я открыт для всех ваших замечаний по стилю кодирования и надеюсь, что смогу что-то у вас перенять, а вы — у меня, т.е. выполнить основное предназначение разработки и поддержки OpenSource продукции.

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

У меня всё! Всем добра! :-)

Блокировка ВК в Украине: 3 совета вебмастерам

blokirovka-vk-v-ukraineВсем привет!

С 2014 года, когда начался конфликт между Россией и Украиной, я всячески стараюсь избегать тем политики. Но, тем не менее, как бы мы от политики не ограждались, но сделать это на 100% всё равно никогда не получится, т.к. вся наша жизнь подчинена её законам.

Особенно правоту данного высказывания испытали на себе все украинские пользователи Интернет 16 мая 2017 года, когда президент Украины Пётр Порошенко подписал указ о блокировке сайтов Вконтакте, Одноклассники, Яндекс, Mail.ru и прочих российских ресурсов на территории Украины.

Казалось бы: ничего страшного не произошло, подумаешь — нельзя будет несколькими сайтами пользоваться. Тем более, что у всех них есть разрешённые альтернативы да и VPN клиенты никто не отменял, с помощью которых можно обходить блокировки по IP адресам.

Но сегодня речь пойдёт не о том, как обойти блокировку ВК, Одноклассников, Яндекса и прочих ресурсов пользователям Украины, чтобы продолжать пользоваться их контентом.

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

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

Всему виной всевозможные виджеты Вконтакте: сообществ, комментариев, лайков и т.д., а также используемые вебмастерами скрипты сбора статистики Яндекс.Метрика и Mail.ru. И ладно бы они просто не загружались, а то и контент сайта делают недоступным.

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

Последняя особенность позволяет их косвенно отнести к средствам SEO оптимизации сайтов, т.к. на скорость загрузки ресурса поисковики обращают пристальное внимание при его ранжировании.

Но перед тем, как мы начнём, я хотел бы уделить внимание техническим моментам возникающего явления.

Технические причины проблем сайтов из-за блокировки ВК в Украине

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

  1. Удобство использования ресурса пользователями — достигается с помощью виджетов комментариев и авторизации, благодаря которым ваши посетители, имеющие аккаунты в социальных сетях, могут оставлять отзывы без необходимости заполнения контактной информации и внутренней регистрации на вашем сайте.
  2. Социальная активность — с помощью виджетов сообществ можно делиться с вашими подписчиками самой разнообразной информацией, не публикуемой на сайте, в том числе организовывать в сообществах опросы и обсуждения, делясь их результатами через виджеты.
  3. Увеличение аудитории сайта — благодаря виджетам, позволяющим поделиться страницами Вашего сайта в социальных сетях с другими пользователями.

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

К слову, всё население Украины на данный момент составляет 42 миллиона.

Но, все перечисленные преимущества утратили свою значимость в мае 2017, когда вступил в силу запрет ВК в Украине и ряда других ресурсов. И самое страшное, что помимо утраты функций социальных виджетов сайты стали терять ещё и посетителей, т.к. мало кто будет ждать полной загрузки сайта.pochemu-ne-zagruzhaetsya-sajt-iz-za-vidjetov-soobschestv

Самое обидное, что из-за санкций пострадали не только украинские пользователи Интернет, но и вебмастера, сайты которых эти люди посещали.

Почему — я уже сказал об этом выше. По какой причине ресурсы стали недоступными из-за виджетов Вконтакте — это другой вопрос.

Всему виной адрес API ВК, которое содержит в своём URL доменное имя самого заблокированного ресурса — vk.com/js/api/openapi.js?150. Поэтому виджеты и не могут загрузиться.

А, поскольку, виджеты Вконтакте загружаются по меру загрузки страницы сайта, то всё время, которое браузер ожидает ответа от заблокированного vk.com, содержимое сайта остаётся недоступным.

Так что виноват во всех перечисленных проблемах не кто иной как команда разработчиков Вконтакте, которая при разработке API не учла сложившуюся ситуацию.

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

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

Оптимизация сайтов вследствие запрета ВК в Украине

Сразу скажу, что при перечислении мер оптимизации среди них вы не встретите самую радикальную — отказ от подобных сервисов вообще. Выход есть всегда :-)

Тем более, являясь вебмастером, я сам прекрасно понимаю, что вследствие отказа вы можете потерять своих пользователей, деньги и контроль над ресурсом (при отказе от Яндекс.Метрики, например).

Так что будем обходиться малой кровью. Тем более, что это возможно.

Асинхронная загрузка кода

Причины проблем с загрузкой сайтов, вызванные виджетами группы и комментариев Вконтакте, я уже озвучил. Если с доступностью его API мы, к сожалению, ничего сделать не можем, то с загрузкой контента сайта, которую прерывают попытки браузера загрузить недоступный виджет, справиться вполне реально.

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

Синхронная загрузка, для тех, кто не в курсе — это выполнение JavaScript сценария по мере загрузки всего сайта. Если синхронный скрипт расположен в шапке сайта между тэгами head, то остальной код не обработается браузером до тех пор, пока он не выполнится.

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

Это на некоторое время позволяет пользователям задержаться на сайте и не уйти с него, посчитав, что они попали на «битую» страницу. Но всё же весь контент они всё равно не увидят, что не есть хорошо.

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

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

Данный метод хорошо работает в случаях подключения на страницу готовых элементов (например, у Facebook при размещении виджета в виде iframe), однако, в случае с виджетами Вконтакте этот номер не проходит, т.к. на момент загрузки виджета браузером он ещё не загрузился по API ВК, которое недоступно.

alternativy-vidjeta-gruppy-vkontakte-na-sajtПоэтому нужно программно определить момент, когда придёт ответ от API VK, и только тогда уже загружать его в элемент виджета. Для этих целей существует масса готовых скриптов, поэтому я не посчитал нужным писать его заново.

Для асинхронной загрузки виджетов Вконтакте на данном сайте лично я пользовался следующим кодом — http://xpro.su/php/async_widgets-1. Скрипт рабочий, поэтому рекомендую :-)

Автор, как я понял, за основу взял код асинхронной загрузки VK OpenAPI, с которым вы можете познакомиться по данной ссылке — https://vk.com/dev/openapi

Ну, и ещё автор дописал код для работы в Internet Explorer старых версий, которым я решил пренебречь ввиду древности данной технологии.

В итоге, мой слегка дополненный вариант асинхронного виджета Вконтакте выглядел так:

<div id="vk_groups"></div>
<script type="text/javascript">
    var VK_loader = function () {
        var oHead = document.getElementsByTagName("head")[0];
        var oScript = document.createElement("script");
        oScript.type = "text/javascript";
        oScript.async = true;
        oScript.src = "http://vk.com/js/api/openapi.js?150";
        oHead.appendChild(oScript);
        oScript.onload = function () {
            VK.Widgets.Group(
                    "vk_groups",
                    {
                        mode: 0,
                        width: "286",
                        height: "320",
                        color1: 'FFFFFF',
                        color2: '444444',
                        color3: '00a1e0'
                    },
                    номер_группы
                    );
        }
    };
    if (document.addEventListener) {
        document.addEventListener("DOMContentLoaded", function () {
            document.removeEventListener("DOMContentLoaded", arguments.callee, false);
            VK_loader();
        }, false);
    }
</script>

При реализации кода из приведённой статьи на своём сайте я ещё заметил, что он прекрасно работает без указанного в оригинале кода:

oScript.onload = function() {
         VK.init({apiId: ID_сайта_ВКонтакте, onlyWidgets: true});//лишний код
         VK.Widgets.Group("vk_groups", {mode: 0, width: 200, height: 250}, номер_группы);
       }

Поначалу я никак не мог понять, что это за ID_сайта_Вконтакте, т.к. автор не указал, где его брать. В итоге я отыскал, где взять данный ключ. Им оказался ID приложения Вконтакте, которое создаётся для доступа к сайтам через OpenAPI.

Создать приложение ВК для получения необходимого ключа можно здесь — https://vk.com/editapp?act=create
А получить ключ существующего приложения Вконтакте можно вот здесь — https://vk.com/apps?act=manage

Но, как выяснилось, код работал при указании вместо ID_сайта_ВКонтакте любого числа. В итоге я вообще решил убрать данную строку во избежания недоразумений.

Кстати, итоговый код загрузки виджета группы Вконтакте для сайта можете использовать для асинхронной загрузки любых виджетов и компонентов, использующих JavaScript код. Для этого прочитайте комментарии под статьёй, из которой я его изначально позаимствовал, где автор рассказывает, как добавить в данный блок Яндекс.Метрику и другие скрипты.

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

Но у асинхронной загрузки есть и минус — несмотря на то, что сайт загрузится без проблем, вместо виджета ВК в конечном итоге будет пустое место, т.к. его API в принципе недоступно.

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

Поиск альтернатив заблокированным ресурсам

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

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

Вместо того же ВК можно пользоваться разрешённым в Украине и не менее крупным Facebook, у которого есть аналогичные виджеты сообществ и комментариев. Или даже Одноклассниками, которые, несмотря на аналогичный с ВК запрет, смогли организовать своё АПИ так, что виджеты грузятся без проблем благодаря URL API, отличному от основного сайта — https://connect.ok.ru/connect.js

Ещё и сам код виджета у одноклассников загружается асинхронно, за что честь и хвала их администрации и разработчикам. Не знаю, когда именно были добавлены эти новшества — то ли как средство обхода блокировки вконтакте в Украине, то ли существовали с самого начала, но на выходе мы имеет одно — Одноклассники здесь обошли ВК, и это факт :-)

Жаль только, что аудитория Одноклассников несколько иная, чем у ВК, да и не такая многочисленная — накануне запрета посещаемость украинских пользователей была 5 миллионов в день.

Или ещё можно воспользоваться новым детищем Павла Дурова Telegram, который, кстати, неплохо набрал обороты после майских событий.

Ну, а Яндекс.Метрику и счётчики Mail.ru можно заменить на Google Analytics, LiveInternet и Рамблер ТОП100.

Хотя, правды ради, нужно сказать, что данные компании переработали свои инструменты с вводом запрета ВК в Украине и если поначалу продукты Mail.ru тормозили загрузку сайта, то, буквально вчера я рискнул снова установить себе счётчик и проверить состояние сайта при этом — никаких проблем с загрузкой не произошло.

С Яндекс.Метрикой у меня же изначально никаких проблем не наблюдалось, несмотря на жалобы других вебмастеров. Ну, и сейчас они также не возникли. Правда, показатели посещаемости по Яндекс.Метрике примерно на 30 посетителей в день меньше, чем у LiveInternet. Не знаю, с чем это связано — то ли из-за санкций трафик стал учитываться по-другому, то ли так было всегда, просто я этого не замечал :-)

Но, в любом случае, какими бы ни были привлекательными альтернативы, но они всё же неспособны затмить оригинал. Ярким доказательством данной идеи стало прекращение работы инновационной украинской социальной сети Ukrainians, ставящей своей задачей стать заменителем ОК и ВК для жителей Украины.

В итоге, она просуществовала около 3 месяцев, и её организаторы заявили, что вынуждены признать тот факт, что «Facebook, Instagram, VK и Однокласники (доступ через специальные каналы) не оставляют на рынке ниши для ещё одной социальной сети».

Да, что бы кто не говорил, но люди не способны так быстро отказаться от своих привычек…

У большинства вебмастеров до ввода блокировки Вконтакте в Украине паблик ВК был основным инструментом социальной активности и имел множество подписчиков.

И теперь вдруг он стал недоступен для половины подписчиков. Что же теперь — отказываться от него насовсем и начинать развивать сообщества в Facebook или Telegram? Некоторые так и сделали, но их не большинство.

Лично я не был готов распрощаться со своим пабликом ВК и его аудиторией, формировавшейся не один год, поэтому нашёл ещё одно средство решения проблемы, вызванной запретом Контакта, Одноклассников и прочих российских ресурсов в Украине.

Загрузка необходимого виджета

Конечным средством оптимизации данного сайта в связи с суровыми политическими реалиями стало внедрение стратегии «И нашим, и вашим» :-)

Согласно ей я решил показывать украинским пользователям виджет сообщества в Facebook, а всем остальным, у кого ВК не заблокирован — виджет Вконтакте. Как определить, откуда к вам зашёл пользователь? Просто — по его сетевому IP адресу.

Алгоритм простой — получаем IP клиента, определяем страну, и на основании результата отображаем нужный виджет.

Необходимый код на языке PHP я уже публиковал в предыдущей статье, где рассказывал как получить город по IP. Осталось только слегка его дополнить для добавления виджетов социальных сетей на сайт.

Поскольку сайт у меня разработан на WordPress, то код из статьи по ссылке я оформил отдельной функцией, которую вынес в functions.php моей темы:

function checkCountryByIp()
{
    $client  = @$_SERVER['HTTP_CLIENT_IP'];
    $forward = @$_SERVER['HTTP_X_FORWARDED_FOR'];
    $remote  = @$_SERVER['REMOTE_ADDR'];
    $result  = array('country'=>'', 'city'=>'');

    if(filter_var($client, FILTER_VALIDATE_IP)) $ip = $client;
    elseif(filter_var($forward, FILTER_VALIDATE_IP)) $ip = $forward;
    else $ip = $remote;

    $ip_data = @json_decode(file_get_contents("http://www.geoplugin.net/json.gp?ip=".$ip));
    if($ip_data && $ip_data->geoplugin_countryName != null)
    {
        $result = $ip_data->geoplugin_countryCode;
    }

    return $result;
}

Как вы видите, я получаю код страны по IP адресу пользователя. Теперь мне нужно, используя его, загружать на страницу нужный виджет.

Для этого я в сайдбаре, где у меня располагается виджет сообществ для внешних сайтов, прописал следующую конструкцию:

<div class="vk-widget" <?php if(checkCountryByIp() == 'UA'){ ?> style="height: 178px;" <?php } ?>>
    <?php if(checkCountryByIp() != 'UA'){ ?>
        <script type="text/javascript" src="//vk.com/js/api/openapi.js?146"></script>
        <!-- VK Widget -->
        <div id="vk_groups"></div>
        <script type="text/javascript">
            VK.Widgets.Group("vk_groups", {
                    mode: 0,
                    width: "286",
                    height: "320",
                    color1: 'FFFFFF',
                    color2: '444444',
                    color3: '00a1e0'
                }, 105617374);
        </script>
    <? }else{ ?>
        <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fcccpblog
                &tabs&width=286&height=170&small_header=true&adapt_container_width=true&hide_cover=false
                &show_facepile=true&appId" width="286" height="170"
                style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" async>
        </iframe>
    <?php } ?>
</div>

Как видите, я проверяю код страны, возвращённый функцией checkCountryByIp(). Если он не равен ‘UA’, то добавляю виджет группы ВК. В противном случае отображается виджет Facebook.

Обратите внимание, что я указал атрибут async, чтобы он загружался асинхронно, т.к. в данном случае элемент у нас есть уже на момент загрузки страницы — и это сработает. Но разницы я, если честно, не заметил по сравнению с вариантом, когда async не был прописан. Возможно, асинхронная загрузка кода у Facebook базовая.

Не забудьте только вместо моих виджетов сообществ для внешних сайтов установить свои. Если вы вдруг не знаете, где взять код, чтобы добавить виджет группы на сайт, то перейдите по этой ссылке и создайте его, указав id своей группы — https://vk.com/dev/Community

Виджет группы Facebook (который теперь стал называться виджетом страницы) можно взять здесь — https://developers.facebook.com/docs/plugins/page-plugin/

Я уже думал, что с установкой приведённого кода мои искания поисков обхода блокировки ВК в Украине подошли к концу, но, поскольку у меня на сайте установлен плагин серверного кэширования, из-за которого вместо виджета Facebook иногда всё-таки пытался загрузиться ВК и контент сайта снова не догружался, мне пришлось слегка подкорректировать скрипт.

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

<div class="vk-widget" <?php if(checkCountryByIp() == 'UA'){ ?> style="height: 178px;" <?php } ?>>
    <?php if(checkCountryByIp() != 'UA'){ ?>
        <div id="vk_groups"></div>
    <? }else{ ?>
        <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fcccpblog
                &tabs&width=286&height=170&small_header=true&adapt_container_width=true&hide_cover=false
                &show_facepile=true&appId" width="286" height="170"
                style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" async>
        </iframe>
    <?php } ?>
</div>

Таким «куцым» он вышел потому, что весь JavaScript код асинхронной загрузки виджета ВК на сайт я решил вынести в отдельный скрипт, который подключал на сайт в футере:

if (document.getElementById("vk_groups")) {
    var VK_loader = function () {
        var oHead = document.getElementsByTagName("head")[0];
        var oScript = document.createElement("script");
        oScript.type = "text/javascript";
        oScript.async = true;
        oScript.src = "http://vk.com/js/api/openapi.js?150";
        oHead.appendChild(oScript);
        oScript.onload = function () {
            VK.Widgets.Group(
                    "vk_groups",
                    {
                        mode: 0,
                        width: "286",
                        height: "320",
                        color1: 'FFFFFF',
                        color2: '444444',
                        color3: '00a1e0'
                    },
                    105617374
                    );
        }
    };
    if (document.addEventListener) {
        document.addEventListener("DOMContentLoaded", function () {
            document.removeEventListener("DOMContentLoaded", arguments.callee, false);
            VK_loader();
        }, false);
    }
}

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

Несмотря на то, что приведённый выше скрипт я использовал для установки виджетов соцсетей на своём WordPress сайте, он подойдёт для любого ресурса, разработанного на языке PHP, т.к. никаких специальных конструкций WordPress API я при его разработке не использовал.kak-dobavit-vidjet-vkontakte-i-fejsbuk-na-sajt-po-ip

Если же вы не хотите морочиться установкой кода на сайт, то можете воспользоваться готовыми решениями в виде плагинов для CMS. Например для определения страны и города по IP на WordPress можете воспользоваться WT GeoTargeting — https://ru.wordpress.org/plugins/wt-geotargeting/

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

Думаю, что по ходу чтения материала вы догадались, почему в теме статьи делается акцент именно на блокировку ВК в Украине, хотя под санкции попал и ряд других популярных ресурсов? Всё просто: в отличие от своих собратьев по санкциям на данный момент (а это уже спустя полгода) только Вконтакте палец о палец не ударил, чтобы сделать свои виджеты доступными для заблокированных пользователей.

А сложного здесь абсолютно ничего нет — изменить url API и сделать редиректы со старых ссылок на новые, чтобы пользователи, использующие старый url, смогли получить доступ к АПИшке по новому адресу.

Но разработчики ВК почему-то до сих пор ничего этого не сделали, несмотря на то, что, регулярно выпускают новые версии API.

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

На этом у меня всё. Пишите свои отзывы о статье в комментариях и делитесь ей со своими друзьями в социальных сетях с помощью кнопочек под публикацией. Надеюсь, что материал был вам полезен :-)

До новых встреч!

Определение города по IP в PHP: 3 способа

opredelenie-goroda-po-ip-v-phpВсем привет!

Не скажу, что часто, но время от времени у разработчиков появляется необходимость определения города по IP в PHP скрипте.

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

Ну, а чаще всего определение города по IP в PHP с помощью GeoIP, наверное, нужно разработчикам различных рекламных сетей, чтобы предлагать пользователям таргетированную рекламу в зависимости от географического местоположения.

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

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

PHP GeoIP — стандартный функционал стороннего производства

Я специально так озаглавил описание первого способа. Дело в том, что в самом PHP определить город и страну по IP адресу нельзя — язык не обладает для этого необходимыми инструментами.
Зато в официальной документации есть подсказка, как это сделать.

PHP GeoIP — это сторонняя библиотека, которую необходимо подключать дополнительно, несмотря на то, что описание функций, входящих в неё, является частью официальной документации PHP — http://php.net/manual/ru/ref.geoip.php

В принципе, мотивы разработчиков PHP вполне понятны.

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

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

Ну, и в-третьих, определение города по IP в PHP — возможность достаточно редко используемая на практике.

В итоге, из-за этих факторов PHP GeoIP является сторонним расширением, поддержкой которого и созданием API для интеграции на существующих сайтах занимается компания MaxMind, ссылка на которую присутствует в описании данной библиотеки.

Я не буду заниматься описанием процесса её установки на сервер, т.к. я сам на практике этим не занимался, и в Интернете на данный момент полно мануалов по установке PHP GeoIP как на Linux, так и на Windows сервера.

Могу только сказать, что у данного способа определения города, страны и прочей гео информации по IP в PHP есть два существенных минуса:

  1. Доступ к базе полной информации по IP адресам, предоставляемой компанией MaxMind, платный. Причём, сумма в долларах, как ни странно :-) Бесплатно доступны лишь существенно урезанные варианты — http://dev.maxmind.com/geoip/geoip2/geolite2/
  2. Учитывая, что PHP GeoIP — стороннее расширение, его необходимо будет отдельно устанавливать на сервер, что при условии использования shared хостинга может стать затруднительным мероприятием. Можно конечно, обратиться в техподдержку, но не факт, что вам помогут. Мне, например, при просьбе установить Sphinx отказали.

Определение города по IP в PHP с помощью альтернативных библиотек

Ещё один способ узнать город по IP в PHP скрипте — это использование альтернативных серверных библиотек и баз информации для IP адресов, отличных от MaxMind.

Но они обладают теми же минусами, что и предыдущий вариант, т.к. являются всего лишь конкурентами MaxMind. Доступы к базам и возможность использования их API также платная. Бесплатно можно получить только список стран и городов по IP, в то время как при платном тарифе можно получать более широкий перечень данных.

Единственное преимущество над PHP GeoIP заключается в том, что данные библиотеки интегрируются в PHP коде, а не на уровне сервера, т.е. их можно использовать даже на shared хостингах.

Примером такой библиотеки является предоставляемая сервисом db-ip.com.

Есть ещё и другие, конечно, но я не занимался их целенаправленным поиском. Если вы знаете ещё какие-то, то можете поделиться ними в комментариях.

Кстати, указанный мною сервис предоставляет не только свою PHP библиотеку для получения гео данных по IP клиентов, но и доступ к базам информации по адресам. Так что, в принципе, никто вам не мешает использовать их в PHP GeoIP, чтобы использовать его API, но информацию брать из других источников.

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

Как определить город по IP в PHP online

Ну, и вот я подошёл к финальному способу как узнать страну по IP в PHP и прочую гео информацию, который использовал сам на практике.

Он заключается в использовании API онлайн сервисов, которые позволяют получать данные по IP адресу в режиме онлайн.

Определять город по IP в PHP я решил именно данным способом, т.к. он лишён главного недостатка предыдущих. А именно, он самый простой в реализации — не нужно ничего устанавливать и настраивать на сервере, а, тем более, просить об этом техподдержку shared хостингов.

Для того, чтобы получить необходимую информацию по IP, достаточно всего лишь отправить запрос на определённый URL и обработать ответ.

Что касается стоимости их использования — в большинстве своём они так же платные, т.к. работают, как правило, на основе существующих коммерческих баз IP. Но есть и бесплатные сервисы, которые предоставляют, возможно, на такую полную информацию, как коммерческие, но зато её можно получать в неограниченном объёме.

Правда, они очень быстро прекращают своё существование, как ни странно, т.к. выжить предоставлением подобных услуг очень сложно. Это показал мой анализ бесплатных online сервисов определения городов и стран по IP, который я проводил в личных целях. Они мелькали на многих сайтах, но при попытке воспользоваться ими было понятно, что они прекратили своё существование.

В итоге, я отыскал то, что мне было необходимо, чем и хочу с вами определиться — http://www.geoplugin.com/

Данный сервис позволяет как определять город и другую информацию по IP на сайте сервиса, так и производить это из кода. Далее я приведу пример определения страны по IP в PHP скрипте с помощью geoplugin.com. Определение IP в PHP коде осуществляется с помощью кода, описанного в статье по ссылке.

<?php

$client  = @$_SERVER['HTTP_CLIENT_IP'];
$forward = @$_SERVER['HTTP_X_FORWARDED_FOR'];
$remote  = @$_SERVER['REMOTE_ADDR'];
$result  = array('country'=>'', 'city'=>'');

if(filter_var($client, FILTER_VALIDATE_IP)) $ip = $client;
elseif(filter_var($forward, FILTER_VALIDATE_IP)) $ip = $forward;
else $ip = $remote;

$ip_data = @json_decode(file_get_contents("http://www.geoplugin.net/json.gp?ip=".$ip));    
if($ip_data && $ip_data->geoplugin_countryName != null)
{
    $result = $ip_data->geoplugin_countryCode;
}

echo $result;

?>

Как видите, суть приведённого кода заключается в определении IP адреса клиента, причём учитывается возможность его подключения через прокси, и отправке запроса по API GeoPlugin с дальнейшим декодированием и анализом результатов.

В моём примере, как я уже и говорил, результатом работы данного скрипта будет являться код страны клиента сайта. Вообще, полный список возвращаемых параметров выглядит так (для примера решил взять IP Новосибирской области РФ):

{
  "geoplugin_request":"195.208.128.3",
  "geoplugin_status":200,
  "geoplugin_credit":"Some of the returned data includes GeoLite data created by MaxMind, available from <a href='http:\/\/www.maxmind.com'>http:\/\/www.maxmind.com<\/a>.",
  "geoplugin_city":"Novosibirsk",
  "geoplugin_region":"Novosibirsk",
  "geoplugin_areaCode":"0",
  "geoplugin_dmaCode":"0",
  "geoplugin_countryCode":"RU",
  "geoplugin_countryName":"Russian Federation",
  "geoplugin_continentCode":"EU",
  "geoplugin_latitude":"55.09",
  "geoplugin_longitude":"82.6519",
  "geoplugin_regionCode":"53",
  "geoplugin_regionName":"Novosibirsk",
  "geoplugin_currencyCode":"RUB",
  "geoplugin_currencySymbol":"&#1088;&#1091;&#1073;",
  "geoplugin_currencySymbol_UTF8":"\u0440\u0443\u0431",
  "geoplugin_currencyConverter":58.9289
}

Как видите, данный сервис использует упоминаемый ранее MaxMind (параметр geoplugin_credit), но платную информацию или нет — сложно предположить. С одной стороны, ссылка на источник говорит о том, что используется бесплатный доступ к БД IP, но, с другой, мы видим не только страну и город, но и ещё много всякой информации, включая город, географические координаты координаты (langitude, latitude), текущую валюту и даже её курс.

Так что данный сервис можно назвать PHP GeoIP онлайн. Единственное его отличие от серверного аналога — то, что он получает информацию по IP немного медленнее за счёт отсутствия серверного кэширования. Но это ещё не значит, что его нет на самом сервере GeoPlugin 😉 Так что недостаток этот, скорее, символический.

В любом случае, разработчики GeoPlugin заслуживают на аплодисменты, а, в особенности, ещё и за то, что они даже не захламили своё сайт контекстной рекламой. Т.е. как они вообще выживают — непонятно. Единственный способ сказать им «спасибо» — это пожертвования на PayPal счёт.

Кстати, приведённый мною PHP код для определения города по IP является универсальным. Можете его использовать для получения гео данных и с помощью других сервисов. Единственное, что вам нужно будет в нём изменить — это URL API сервиса и имя необходимых параметров, которые вам нужно будет получить.

На этом у меня всё. Пишите ваши отзывы о статье в комментариях ниже и не забывайте делиться записью со своими друзьями в социальных сетях.

Если у вас есть какие-то замечания или вы хотите поделиться другими способами определения города по IP в PHP, то оставляйте их также в комментариях.

Пока :-)

the_posts_pagination(array( 'mid_size' => 3, 'prev_text' => __('« Предыдущая'), 'next_text' => __('Следующая »') ));