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

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

  • автор:

Как сделать сайт надёжным в Google Chrome

Рассказываем, что делать, если на сайте появилась пометка «Ненадёжный»

С 2017 года Google Chrome стал различать, есть ли на сайте SSL-сертификат. Если есть, в адресной строке появится пометка «Надёжный». Если нет или сертификат установлен неправильно — «Ненадёжный». В Google считают, что это побудит пользователей оставлять личные данные только на защищённых сайтах.

Разберёмся, какой сайт Google Chrome посчитает ненадёжным, и как это исправить.

Браузер подскажет, если на сайте небезопасно вводить пароль или номер карты

Как до 2017 года отличали надёжные сайты от ненадёжных

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

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

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

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

Первым браузером, который изменил подход к предупреждениям, стал Google Chrome

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

Хотите сделать свой сайт защищенным?

Как изменились отметки безопасности в 2017 году

В 2016 году сотрудники Google провели социологическое исследование: узнали у 1329 человек, как часто они обращают внимание на значки в адресной строке браузера. Больше половины участников признались, что замечают значки, но не всегда понимают их значение.

В 2017 году дополнительные знаки безопасности появились в Google Chrome и Firefox. В других браузерах ничего не изменилось. Рассмотрим изменения подробнее.

SSL в Google Chrome

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

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

На сайте с SSL-сертификатом в адресной строке Google Chrome появляется зелёный замок и надпись «Надёжный».

На сайте с неправильно установленным SSL-сертификатом возле адреса страницы появляется красный треугольник и надпись «Ненадёжный».

Есть четыре причины, по которым браузер может показать такое сообщение:

1. Сайт использует протокол HTTPS, но на сервере нет SSL-сертификата.

2. Сертификат установили неправильно. При этом на странице отобразится название ошибки. В базе знаний Google есть страница с описанием ошибок.

3. Установлен самоподписанный сертификат. Браузеры распознают не все сертификаты. Если вы установили бесплатный SSL-сертификат от неизвестного производителя, в Google Chrome отобразится ошибка.

4. Сертификат устарел. У сертификатов бывают разные алгоритмы шифрования. Стандартным считается алгоритм SHA-2. Если сертификат использует предыдущий алгоритм — SHA-1, в браузере появится предупреждение.

На сайте без SSL-сертификата появляется серый кружок и надпись «Ненадёжный».

О каждом нововведении Google заранее рассказывает в блоге. Следите за обновлениями, чтобы быть в курсе.

SSL в Firefox

В январе 2017 разработчики Mozilla выпустили обновление, в котором появился новый значок для сайтов без SSL-сертификата.

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

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

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

Что делать, если сайт помечен как ненадёжный

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

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

Настройте SSL-сертификат

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

Как сделать свой сайт надежным: переход на https и виды ssl-сертификатов

Обложка для статьи: Как сделать свой сайт надежным: переход на https и виды ssl-сертификатов

pic_work_ssl.jpg

С ростом кибер-преступлений владельцам веб-сайтов крайне важно знать, как предоставить своим клиентам безопасное соединение. Кроме того, Google обещает к июлю 2018 года помечать все сайты, которые работают по протоколу HTTP, как “Незащищенные”. Чтобы пополнить ряды “Надежных” веб-сайтов, необходимо установить SSL-сертификат на свой сайт или интернет-магазин. Но прежде нужно разобраться в том, что такое SSL-сертификат, какие бывают виды сертификатов безопасности, в чем их отличие и как перевести свой сайт на HTTPS.
В этой статье мы расскажем о том, что такое SSL-сертификат, какие бывают сертификаты безопасности, и какие у них отличия и особенности. Что такое SSL-сертификат? Мы уже рассказывали о SSL-сертификатах и том, что переход на https сегодня скорее необходимость. SSL-сертификаты позволяют предоставить безопасное соединение между сайтом и пользователем. Соединение по протоколу https защищает конфиденциальные данные, такие как данные о транзакциях, номера пластиковых карт или данные для авторизации, которыми пользователи обмениваются в ходе каждой сессии. Таким образом, SSL-сертификат позволяет использовать протокол https, который гарантирует, что информация останется конфиденциальной, а онлайн-транзакции — под защитой. Как работает SSL-сертификат?
SSL-сертификат использует криптографию с открытым и закрытым ключом. Ключи представляют из себя длинные последовательностями случайных чисел. Открытый ключ известен вашему серверу и используется для шифрования любого сообщения. Закрытый же ключ используется для дешифровки сообщения. Сказано — показано. Если Маша отправит сообщение Тане, она зашифрует его открытым ключом Тани, а единственным способом прочитать сообщение является дешифровка сообщения с помощью закрытого ключа Тани. Таким образом, Таня — единственная, у кого есть закрытый ключ, поэтому она сможет расшифровать сообщение Маши. Вывод: Если третье лицо перехватывает сообщение до того, как Таня его расшифрует, все, что получит злоумышленник, — абракадабру, которую нельзя будет взломать даже с помощью специальных программ. Если перевести пример на веб-сайт, то передача сообщений от Маши к Тане — взаимодействие веб-сайта и веб-сервера. Зачем нужен SSL-сертификат? SSL-сертификат защищает вашу конфиденциальную информацию, такую ​​как данные кредитной карты, имена пользователей и пароли. А также:

  • Изменяется статус ресурса в строке браузера, что повышает доверие пользователей
  • Увеличивается вероятность конверсии, так как пользователи уверены, что данные их карт не будут переданы третьим лицам
  • Google увеличивает позиции сайта или интернет-магазина в поисковой выдаче

Сертификат безопасности позволит вашему сайту или интернет-магазину предоставить вашим посетителям защищенное соединение, а также уверенность в том, что данные их кредитных карт и другие персональные данные не будут скомпрометированы. Кроме того, в блоге Google Chrome появилась новость о том, что к июлю 2018 года, с выходом Google Chrome версии 68, все сайты, которые работают по протоколу HTTP будут отмечаться как ненадежные (“Не защищено” в российском варианте)

chrome.png

pic_protection.jpg

Существует множество различных типов SSL-сертификатов, основанных на количестве принадлежащих им доменов и поддоменов, таких как:

Стандартный SSL-сертификат (Single Domain) — сертификат, который создается для защиты одного уникального домена или поддомена. При условии, что на сайте есть поддомены, которые тоже необходимо защитить шифрованием — такой SSL-сертификат не подойдет. Во всех остальных случаях, для защиты одного уникального доменного имени прекрасно справляется обычный SSL-сертификат.

Пример корректной работы Стандартного SSL-сертификата:

Пример, при котором возникает ошибка и Стандартный SSL-сертификат не работает:

Вайлкард SSL-сертификат (Wildcard SSL)

WildCard SSL — сертификат безопасности, который сохранит вам деньги и время, так как он предоставляет защищенное соединение для основного домена и неограниченного количества поддоменов сайта. И нужно учитывать, что это все — один сертификат. Wildcard SSL работает по такому же принципу, что и обычный SSL-сертификат, позволяя вам предоставлять пользователям защищенное соединение между вашим сайтом и браузером вашего клиента. Отличие лишь в том, что один вайлдкард SSL покрывает все поддомены основного домена сайта. Для примера рассмотрим внедрение wildcard SSL на поддомены сайта *.example.ru:

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

Сертификат на несколько доменов (Multi-Domain SSL) — такой сертификат защищает несколько доменных имен. Один мультидоменный SSL-сертификат может предоставить защищенное соединение для 100 уникальных доменных имен, в том числе поддомены.

Google стимулирует сайты и интернет-магазины делать интернет безопаснее для рядовых пользователей. Чтобы пополнить ряды “Надежных” сайтов, перейти на HTTPS, повысить позиции вашего ресурса в поисковых системах, необходимо купить SSL-сертификат с установкой на вашем сайте.

Рассказать друзьям

«Возникла проблема с сертификатом безопасности этого веб-сайта» при попытке посетить защищенный веб-сайт в Internet Explorer

Internet Explorer 11 был окончательно отключен с помощью обновления Microsoft Edge в некоторых версиях Windows 10. Если для любого сайта, который вы посещаете, требуется Internet Explorer 11, его можно перезагрузить в режиме Internet Explorer в Microsoft Edge. Рекомендуется перейти на Microsoft Edge , чтобы начать пользоваться более быстрым, безопасным и современным браузером.

Проблемы

Пользователь, который пытается подключиться к защищенному веб-сайту с помощью Windows Internet Explorer, может получить следующее предупреждение:

Возникла проблема с сертификатом безопасности этого веб-сайта. Сертификат безопасности, представленный этим веб-сайтом, не был выдан доверенным центром сертификации.

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

Решение

Чтобы устранить эту проблему, организация, на которой размещен защищенный веб-сайт, может приобрести сертификат для каждого веб-сервера у стороннего поставщика. Кроме того, организация может установить центр сертификации Microsoft Enterprise в лесу Active Directory. Затем организация может использовать этот центр сертификации для создания сертификата для каждого веб-сервера.

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

Обходное решение

Чтобы обойти эту проблему, установите самозаверяющий сертификат Microsoft Windows Small Business Server 2003 (Windows SBS) на клиентском компьютере. Для этого выполните следующие действия:

    В Windows Internet Explorer щелкните «Продолжить на этот веб-сайт» (не рекомендуется).

  • В Windows Vista та же проблема возникает и с самозаверяющие сертификаты. Однако возможность установки сертификатов недоступна, если вы не запустите Windows Internet Explorer с правами администратора. Для этого щелкните правой кнопкой мыши значок Internet Explorer и выберите команду «Запуск от имени администратора».
  • Когда клиентский компьютер подключается к веб-серверу, на котором выполняется Windows Server 2003, клиентский компьютер повторно использует сертификат центра сертификации. Клиентский компьютер не использует другой сертификат, подписанный центром сертификации.

Дополнительная информация

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

Дополнительные сведения о проблеме с сертификатом безопасности веб-сайта см. на следующих веб-сайтах Майкрософт:

Как использовать HTTPS для локальной разработки

Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.

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

Мод Налпас

Внимание: в большинстве случаев http://localhost делает то, что вам нужно: в браузерах он в основном ведет себя как HTTPS ��. Вот почему некоторые API, которые не будут работать на развернутом HTTP-сайте, будут работать на http://localhost . Это означает, что вам нужно использовать HTTPS локально только в особых случаях (см. Когда использовать HTTPS для локальной разработки ), например, для пользовательских имен хостов или защиты файлов cookie в браузерах. Продолжайте читать, если это вы!

В этом посте утверждения о localhost также действительны для 127.0.0.1 и [::1] , поскольку они оба описывают адрес локального компьютера, также называемый «обратным адресом». Кроме того, для простоты номер порта не указывается. Поэтому, когда вы видите http://localhost , прочитайте его как http://localhost: или http://127.0.0.1: .

Если ваш рабочий веб-сайт использует HTTPS, вы хотите, чтобы ваш локальный сайт разработки вел себя как сайт HTTPS (если ваш рабочий веб-сайт не использует HTTPS, сделайте приоритетным переключение на HTTPS ). В большинстве случаев вы можете быть уверены http://localhost будет вести себя как сайт HTTPS . Но в некоторых случаях вам необходимо запустить сайт локально с использованием HTTPS. Давайте посмотрим, как это сделать.

⏩ Вам нужны быстрые инструкции или вы бывали здесь раньше? Перейдите к шпаргалке .

Локальный запуск вашего сайта по протоколу HTTPS с использованием mkcert (рекомендуется)

Чтобы использовать HTTPS на локальном сайте разработки и получить доступ к https://localhost или https://mysite.example (настраиваемое имя хоста), вам понадобится сертификат TLS . Но браузеры не будут считать действительным любой сертификат: ваш сертификат должен быть подписан лицом, которому доверяет ваш браузер, называемым доверенным центром сертификации (CA) .

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

Схема работы mkcert.

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

mkcert (и подобные инструменты) предоставляют несколько преимуществ:

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

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

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

В этом посте нас интересует именно этот mkcert, а не этот .

Осторожность

Внимание: — Никогда не экспортируйте и не делитесь файлом rootCA-key.pem который mkcert создает автоматически при запуске mkcert -install . Злоумышленник, получивший этот файл, может организовать атаку на любой сайт, который вы посещаете . Они могут перехватывать защищенные запросы с вашего компьютера на любой сайт — ваш банк, поставщик медицинских услуг или социальные сети. Если вам нужно знать, где находится rootCA-key.pem , чтобы убедиться в его безопасности, запустите mkcert -CAROOT . — Используйте mkcert только в целях разработки и, соответственно, никогда не просите конечных пользователей запускать команды mkcert. — Команды разработчиков: все члены вашей команды должны устанавливать и запускать mkcert отдельно (не хранить и совместно использовать центр сертификации и сертификат).

Настраивать

  1. Установите mkcert (только один раз). Следуйте инструкциям по установке mkcert в вашей операционной системе. Например, в macOS:
brew install mkcert brew install nss # if you use Firefox 
mkcert -install 
mkcert localhost 

Если вы используете собственное имя хоста, например mysite.example , запустите:

mkcert mysite.example 
  • Создает сертификат для указанного вами имени хоста.
  • Позволяет mkcert (который вы добавили в качестве локального центра сертификации на шаге 2) подписать этот сертификат.

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

const https = require('https'); const fs = require('fs'); const options = < key: fs.readFileSync('.pem'), cert: fs.readFileSync('.pem'), >; https .createServer(options, function (req, res) < // server code >) .listen(); 

����‍�� С http-сервером : Запустите свой сервер следующим образом (замените ):

http-server -S -C .pem -K .pem 

-S запускает ваш сервер с использованием HTTPS, -C устанавливает сертификат, а -K устанавливает ключ. ����‍�� С сервером разработки React: Отредактируйте свой package.json следующим образом и замените :

"scripts": < "start": "HTTPS=true SSL_CRT_FILE=.pem SSL_KEY_FILE=.pem react-scripts start" 

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

|-- my-react-app |-- package.json |-- localhost.pem |-- localhost-key.pem |--. 

Тогда ваш start скрипт должен выглядеть так:

"scripts": < "start": "HTTPS=true SSL_CRT_FILE=localhost.pem SSL_KEY_FILE=localhost-key.pem react-scripts start" 
  • Сервер разработки Angular
  • Питон

Использование mkcert: шпаргалка

короче говоря, mkcert

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

    Настройте мксерт. Если вы еще этого не сделали, установите mkcert, например, в macOS:

brew install mkcert

Проверьте инструкции по установке mkcert для Windows и Linux. Затем создайте локальный центр сертификации:

mkcert -install

mkcert

Локальный запуск вашего сайта по протоколу HTTPS: другие варианты

Самоподписанный сертификат

Вы также можете решить не использовать локальный центр сертификации, например mkcert, и вместо этого подписать сертификат самостоятельно .

При таком подходе остерегайтесь нескольких подводных камней:

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

  • Браузеры не доверяют вам как центру сертификации и будут показывать предупреждения, которые вам придется обходить вручную. В Chrome вы можете использовать флаг #allow-insecure-localhost для автоматического обхода этого предупреждения на localhost . Это кажется немного хакерским, потому что это так.
  • Это небезопасно, если вы работаете в незащищенной сети.
  • Самозаверяющие сертификаты не будут вести себя так же, как доверенные сертификаты.
  • Это не обязательно проще и быстрее, чем использование локального центра сертификации, такого как mkcert.
  • Если вы не используете этот метод в контексте браузера, вам может потребоваться отключить проверку сертификата для вашего сервера. Отказ от повторного включения его в производство был бы опасен.

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

Почему браузеры не доверяют самозаверяющим сертификатам?

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

Почему браузеры не доверяют самозаверяющим сертификатам: диаграмма.

Сертификат, подписанный обычным центром сертификации

Вы также можете найти методы, основанные на том, что ваш сертификат подписывает реальный центр сертификации, а не локальный.

Если вы планируете использовать эти методы, следует иметь в виду несколько вещей:

  • Вам придется выполнить больше работы по настройке, чем при использовании локального метода CA, такого как mkcert.
  • Вам необходимо использовать доменное имя, которое вы контролируете и которое является действительным. Это означает, что вы не можете использовать настоящие центры сертификации для:
    • localhost и другие зарезервированные доменные имена, например example или test .
    • Любое доменное имя, которое вы не контролируете.
    • Недействительные домены верхнего уровня. См. список действующих доменов верхнего уровня .

    Обратный прокси

    Другой вариант доступа к локально работающему сайту по протоколу HTTPS — использовать обратный прокси-сервер , например ngrok .

    Несколько моментов, которые следует учитывать:

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

    Флаг (не рекомендуется)

    Если вы используете собственное имя хоста, например mysite.example , вы можете использовать флаг в Chrome, чтобы принудительно считать mysite.example безопасным. Избегайте этого , потому что:

    • Вы должны быть на 100 % уверены, что mysite.example всегда разрешается по локальному адресу, иначе вы можете получить утечку производственных учетных данных.
    • С помощью этого трюка вы не сможете выполнять отладку в разных браузерах ��.

    Выражаем огромную благодарность за вклад и отзывы всем рецензентам и участникам, особенно Райану Сливи, Филиппо Вальсорде, Милице Михайлии и Роуэну Меревуду. ��

    Фон изображения героя от @anandu на Unsplash , отредактирован.

    Если не указано иное, контент на этой странице предоставляется по лицензии Creative Commons "С указанием авторства 4.0", а примеры кода – по лицензии Apache 2.0. Подробнее об этом написано в правилах сайта. Java – это зарегистрированный товарный знак корпорации Oracle и ее аффилированных лиц.

    Последнее обновление: 2021-01-25 UTC.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *