Как сделать чтобы код не выполнялся

Добавил пользователь Евгений Кузнецов
Обновлено: 19.09.2024

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

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

Зачем понимать исходный код

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

Зная, как устроен исходный код, вы сможете:

Больше понимать в SEO-продвижении.

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

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

Анализировать сайты конкурентов на более глубоком уровне.

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

Составлять грамотные ТЗ для разработчика самостоятельно.

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

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

Экономить, самостоятельно внося изменения в сайт.

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

Что такое исходный код сайта

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

Именно код скрывается за внешней стороной любой интернет-страницы. Он выглядит как список пронумерованных строк с информацией о том или ином элементе страницы.

Как посмотреть код любого сайта

Расскажем, как посмотреть исходный код страницы в браузере Google Chrome. В остальных браузерах этот процесс примерно такой же.

Код вызывается одной из комбинаций:

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

Дальше в статье мы будем пользоваться именно этим инструментом — он нагляднее.

Чтобы не утонуть в огромном количестве новых символов, нужно разобраться, что такое HTML, CSS и JavaScript.

Что такое HTML

HTML — язык гипертекстовой разметки. На нём написано большинство сайтов в интернете.

Что можно узнать о сайте из исходного кода

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

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

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

Чтобы лучше понять теорию, разберёмся в коде страниц блога RU-CENTER: найдём теги, картинки и другую информацию.

Для начала открываем страницу и вызываем интерактивный код (Ctrl + Shift + I). Откроется интерактивная панель с кодом, поделённая на две области. Слева — HTML-код (вкладка Elements), справа — CSS (вкладка Styles). Нам пока нужна левая часть с HTML.

Основные теги

Выполнение PHP-кода в виджетах WordPress без плагина

Я постарался проявить сдержанность и посоветовал горе-вебмастеру установить плагин PHP Code Widget.

Но потом я понял, что сам виноват. Ведь действительно, я ни словом не обмолвился от том, как вставлять PHP в виджет.

Многие веб-мастера, для выполнения PHP-кодов в виджетах WordPress, используют плагины. Один из-них я уже назвал выше, но стоит отметить еще один плагин, который называется Exec-PHP.

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

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

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

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

Вывод PHP-кода через виджеты WordPress без плагина

Давайте заставим WordPress выполнять PHP коды в виджетах. Сложного в этом ну вообще ничего нет.

Открываем для редактирования файл functions.php , ищем знак ?>, в некоторых темах ob_end_clean(); и перед ним вставляем следующий код:

Теперь любой PHP-код будет выполняться в виджетах. Все просто! О плагинах не может быть и речи.

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

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

Например, для простейшего фрагмента кода

редактор на хостинге пишет:

Syntax error, unexpected T_STRING, expecting '

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

В тексте кода есть что-то невидимое? Это не убивается, если вставить в блокнот Windows и ничего особенного не видно в текстовом редакторе WordPress. Неприятно то, что Notepad2 проблему не решает: подсвечивает ключевое слово function, но сохраненный код на хостинге не работает.

Как защитить код: веб-сокеты, крипторы и обфускация

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

Итак, есть несколько вариантов защиты кода:

Использовать веб-сокеты.
Использовать крипторы.
Сделать обфускацию кода.

Обфускаторы же изменяют сам код, вставляя между операторами нечитаемые символы, меняя имена переменных и функций на набор визуально непонятных символов. При этом объём кода также сильно увеличивается из-за вставки дополнительного псевдокода, а также замены символов на hex, когда любые символы переводятся в их hex-значения (например, латинская буква ‘e’ может быть записана как ‘\x65’, причём это прекрасно интерпретируется любым браузером). Можете посмотреть, как работает перевод в hex через любой сервис Text To Hex, например на Crypt Online.

Применение обфускаторов сильно усложняет дальнейшую отладку кода, поскольку это необратимый процесс. К тому же в некоторых случаях они могут повлиять на функциональность кода. Попробовать обфускаторы можно на любом сервисе обфускации, к примеру этом или этом. Также в Сети можно найти платные крипторы-обфускаторы, в настройках которых вы сможете указывать степень защиты, время жизни скрипта и прочее, при этом скрипт будет намертво привязан к вашему домену, т.е. для дешифровки будет использоваться уникальное для вашего хоста значение. Стоимость таких крипторов начинается от 45 $. Кроме этого, перед обфускацией вы можете предварительно минимизировать код, заменив все имена переменных и функций на их односимвольные синонимы. Отличный и очень популярный инструмент на Node.js — UglifyJS, который работает как в автоматическом режиме (скажем, через Gulp), так и в режиме командной строки.

Web-студия Runway (Риалвеб) , Удалённо , От 150 000 ₽

Также есть всем известный Closure Compiler от Google, который кроме минимизации анализирует JavaScript-код, удаляет мёртвый код, переписывает и сводит к минимуму то, что осталось. Он также проверяет синтаксис, ссылки на переменные и типы и предупреждает об общих ошибках JavaScript. Имеет хорошо документированный API.

Кроме предложенных методов можно сделать следующее:

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

Зашифровка кода на примере JavaScript-калькулятора

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

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

По итогам работ в браузере вы увидите нечто такое:

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

При этом никто ведь не знает, что здесь зашифрован именно скрипт. Это может оказаться какой-то параметр, текст или изображение. Через base64 можно зашифровать всё что угодно.

Поищем в коде функцию glob() , которой передаётся шифрованная строка. Вот она: glob=function(s)

Видим ещё несколько функций sfd() и rty() . Ищем эти функции. Вот они:

На этом месте многие закончат попытки расшифровки и оставят ваш сайт в покое.

Рассмотрим алгоритм подробнее.

Как защитить JavaScript от копирования на своём сайте

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

В строке выше мы говорим интерпретатору PHP взять файл script.js, далее закодировать его через base64, прибавить строку ‘K’ и всё это записать в переменную $filebase64 .

Добавление строки ‘K’ (это может быть любая латинская буква или комбинация букв или цифр) защищает нас от того, что желающий скопировать ваш скрипт расшифрует его с помощью alert() или онлайн-дешифратора. Ведь с дополнительными символами скрипт не будет работоспособен.

Затем где-то дальше в коде вызываем скрипт:

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

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

Разбираем подробно что здесь происходит.

Пример замены цифр через побитовый оператор ~ :

-1 можно заменить на ~[]
1 можно заменить на -~[]
0 можно заменить на ~~[]

Далее полученный результат принимает функция rty() . Эта функция представляет собой набор символов, в частности: this["\x61\x74\x6F\x62"] ;

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

Т.е. набор символов — это зашифрованная функция atob() , которая, согласно описанию на MDN, декодирует строку, закодированную с использованием base64.

Результат декодирования получает функция sfd() . Она также представляет собой набор символов: this["\x65\x76\x61\x6C"]; .

Вы уже догадались, что нужно сделать? 🙂 Выполните в консоли браузера и вы увидите:

Наверное, вы задались вопросом, а каким же образом функции зашифрованы в наборе символов? Очень просто: набор символов — это текст, преобразованный в шестнадцатеричную систему счисления. Т.е. это текст в формате hex (hexadecimal), в котором можно зашифровать любые символы.

Таким образом, наша расшифрованная функция выглядит так (специально разбил по строчкам, чтобы было наглядно):

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

Вы можете пойти и дальше. Если каким-то образом кто-то всё же расшифрует ваш скрипт, немного усложните его, чтобы людям было сложнее модифицировать его. Например, можно поговорить о побитовом операторе ^ , c помощью которого можно творить чудеса. Например, a^b^b будет равно a . В качестве b может быть использован ключ, который мы зашифруем где-то выше…

Всё будет работать как и раньше, но собьёт с толку нехороших копипастеров.

Читайте также: