No video

Уменьшение размера изображений на лету.

00:00 - длинное нудное вступление
01:15 - установка NGINX под Ubuntu и запуск сервера
06:32 - настройка кэширования статических файлов
09:28 - установка модуля Image Filter под Ubuntu
11:01 - настройка location для изменения размера изображения на лету
13:41 - настройка прокси-сервера
18:37 - музыкальный привет компании Рамблер
// ---------------- Ссылки на материалы -------------- //
➣ Исходники и инструкции от #Blondiecode - github.com/droganaida/nginx-i...
➣ Установка NGINX - nginx.org/ru/linux_packages.html
➣ Документация NGINX - nginx.org/ru/docs/
➣ Документация Image Filter - nginx.org/ru/docs/http/ngx_htt...
➣ Кэширование с NGINX - www.nginx.com/blog/nginx-cach...
➣ Еще про кэширование (на русском) - ruhighload.com/%D0%9A%D1%8D%D...
➣ Директива Nginx - location с примерами - itzx.ru/linux/derektiva-nginx...
// ------------------------------------------------------------------------ //
// -------- Присоединиться к комьюнити -------- //
// ------------------------------------------------------------------------ //
➣ Telegram --- t.me/joinchat/HOEP30yXRyBQp4e...
➣ GitHub --- github.com/droganaida
➣ Facebook --- / blondiecode
➣ Coub --- coub.com/aida-drogan
// ------------------------------------------------------------------------ //
//------------ Поблагодарить за видео ----------------- //
// ------------------------------------------------------------------------ //
➣ Кинуть монетку на корм коту --- www.paypal.com/cgi-bin/webscr...
➣ Купить прикольную футболку с принтом из видосиков --- www.teepublic.com/user/drogan...
//-----------------------------------------------//
Больше видео на тему IT можно найти по тегу #ityoutubersru

Пікірлер: 94

  • @AidaDrogan
    @AidaDrogan4 жыл бұрын

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

  • @yairrodriguez3690

    @yairrodriguez3690

    4 жыл бұрын

    Не очень хорошо владеете английским?! А как же английский канал?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    @@yairrodriguez3690 хм... На английском канале эта шутка не прокатит =D Придётся искать хорошую песенку на русском: про змею и черепаху, например. Там ещё кто-то куда-то ехал, кажется...

  • @dmitriyart2989

    @dmitriyart2989

    4 жыл бұрын

    Аида добрый день могли бы вы рассказать еще про модуль в ngnix под названием njs scripting language не до конца понял для чего он нужен и с чем его едят заранее спасибо

  • @alexey9337
    @alexey93374 жыл бұрын

    Божечки, это лучший материал по nginx, что я видел...

  • @adrtalladi2404

    @adrtalladi2404

    4 жыл бұрын

    Согласен

  • @yairrodriguez3690
    @yairrodriguez36904 жыл бұрын

    С возвращением Ася, спасибо за видео!

  • @Murrengan
    @Murrengan4 жыл бұрын

    это золотой контент! Благодарю за твои труды и посылаю лучи любви ❤️

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Спасибо, коллега! У тебя тоже классный контент ;) -- Лучи любви приняты, обработаны, умножены и высланы отправителю ^___^ --

  • @user-sx3nn7uy1s
    @user-sx3nn7uy1s3 жыл бұрын

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

  • @user-md5mw1tp3e
    @user-md5mw1tp3e4 жыл бұрын

    Интересный материал, отличная подача! Тащусь от зарисовок)

  • @user-ml5dv2zm8r
    @user-ml5dv2zm8r4 жыл бұрын

    Бозе мой, ну какая же ты милаха! ))

  • @mooncorizer290
    @mooncorizer2902 жыл бұрын

    Классный контент, спасибо автору, обнял

  • @MorgunovVitaly
    @MorgunovVitaly4 жыл бұрын

    Супер! Спасибо за материал!

  • @user-kn6vr7el8y
    @user-kn6vr7el8y4 жыл бұрын

    Обожаю конфигурить nginx и всем советую ;D Спасибо за видео, как всегда круто!)

  • @andreydmitriyev4582
    @andreydmitriyev45824 жыл бұрын

    Спасибо за неожиданный лайфхак!

  • @jamesdavis4071
    @jamesdavis40714 жыл бұрын

    Здорово, не знал о такой возможности nginx. Спасибо! И да, больше комментариев! ^.^

  • @chingizmamiyev7973
    @chingizmamiyev79734 жыл бұрын

    Как всегда супер

  • @clickabelno
    @clickabelno4 жыл бұрын

    Лайк за полезный контент, ща чувство юмора и за голос)

  • @nurlybekademov2609
    @nurlybekademov26093 жыл бұрын

    Спасибо за видео.

  • @tsydykhpokhodiev751
    @tsydykhpokhodiev7512 жыл бұрын

    Just what i needed :-)

  • @yanmandev
    @yanmandev4 жыл бұрын

    Спасибо, полезное видео

  • @Bob-ip4ws
    @Bob-ip4ws4 жыл бұрын

    Нужно больше комментариев!)

  • @serusok
    @serusok4 жыл бұрын

    Наконец-то звук хороший

  • @serious_psychologist
    @serious_psychologist4 жыл бұрын

    видео огонь! спасибо.

  • @MichaelPeteichuk
    @MichaelPeteichuk4 жыл бұрын

    Спасибо за скринкаст!

  • @antonmandrychenko4578
    @antonmandrychenko45783 жыл бұрын

    Super)))

  • @hakooplayplay3212
    @hakooplayplay32124 жыл бұрын

    Отлично!

  • @excelente9842
    @excelente98424 жыл бұрын

    Умничка)

  • @Sergey-jq5kz
    @Sergey-jq5kz3 жыл бұрын

    Ты прекрасный котик

  • @thepawday
    @thepawday4 жыл бұрын

    Ого. Рад видеть

  • @o0ExTazzY0o
    @o0ExTazzY0o4 жыл бұрын

    пожалуй оставлю комментарий для продвижения видео)

  • @handleftman
    @handleftman4 жыл бұрын

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

  • @e-benz
    @e-benz4 жыл бұрын

    жирок!! нужно больше видео

  • @yakut54
    @yakut544 жыл бұрын

    лайк!!!!

  • @wizardoflightnings6841
    @wizardoflightnings68414 жыл бұрын

    👍

  • @neocortexlab
    @neocortexlab4 жыл бұрын

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

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

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

  • @dmitriyart2989
    @dmitriyart29894 жыл бұрын

    09:00 пишу - на станционарнике стоит винда 7, на ноутбуке дебиан 10 под граф оболочкой 3dark kde

  • @user-zx5sv3hb2u
    @user-zx5sv3hb2u4 жыл бұрын

    Годнота то какая! А я заметил в sources.list репозиторий elasticsearch! А будут ли видео по эластику? ))

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    С эластиком мы так и не подружились =) проблема медленного поиска по огромной базе решилась её переработкой, индексацией и изменением алгоритма поиска. Но, может, я когда-нибудь вернусь к идее попробовать elasticsearch.

  • @SnitchRUS66
    @SnitchRUS664 жыл бұрын

    Клево! Мне скоро предстоит переезд с Windows Server 2008 на Debian, видос очень кстати. Было бы здорово посмотреть про настройку Nginx как revers proxy через https с авто установкой и авто продлением сертификата. И про image filter - ограничение на операции с картинкой, я так понимаю, делать через регулярки или есть какие-то еще способы? Можно через этот модуль или подобный добавить ватермарку на картинку?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    С сертификатами отлично справляется эта софтинка - certbot.eff.org/instructions. А вот ватермарки я не пробовала. Вроде есть такая директива - image_filter watermark. Надо потестить. Я до 2019-го все операции с картинками доверяла ImageMagick, а потом узнала про Image Filter =)

  • @user-ms1xt9ui7e
    @user-ms1xt9ui7e4 жыл бұрын

    Материал огонь, тема интересная. Меня тревожит один момент, такое вот условие для создания кеша (размер в урл) не имеющее лимитов - не является ли дырой, позволяющей если не уронить, то как следует подвесить сервер? +- 300 картинок * [1px, ... 10000px]. Думаю хорошо было бы показать как такую дыру закрыть (если это действительно дыра), а то не редкий случай когда учебный материал уходит в продакшн )).

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    А вы попробуйте задать роут на 10000px ;) Спойлер: картинка будет отдаваться в оригинальном размере. Image Filter помогает похудеть, а не набрать массу. Так что перекормленных котиков можно не бояться.

  • @user-ms1xt9ui7e

    @user-ms1xt9ui7e

    4 жыл бұрын

    @@AidaDrogan 10000 - согласен, перегнул. А как себя буде вести выводок [1px, ... оригинальный размер]? не удастся ли им заиграть выделенное пространство? Вопрос не про image Filter, а про кладовку где эти котики бузят. Кеш ведь не резиновый. Каюсь, мне лень развернуть и применить метод научного тыка.... зато комментариев больше ))

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    У кладовки параметр есть max_size=10g (10 гб например). Как только закончится выделенное место, NGINX будет удалять самые старые файлы. А вот если max_size не указан, тогда на их сайте говорят, что будет использовано всё доступное место. А что это за место надо бы протестировать =) Лично я бы без лимитов кэш не описывала. Как-то был неприятный момент на одном сервере, когда бэкапы завалили все доступное пространство, и база легла, потому как ей места не хватило...

  • @kerya2858
    @kerya28584 жыл бұрын

    Интересно, какой у вас дистрибутив Linux и тема оформления? Понравился внешний вид.

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Xubuntu 19.10

  • @jsboy5235
    @jsboy52359 ай бұрын

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

  • @sasha_g4
    @sasha_g44 жыл бұрын

    Интересно что на счёт перформанса. Есть какие-то цифры ? Тоже думаю о подобном решении.

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    У меня такая схема реализована на сервере, где около 5000 картинок. Так что сложно сказать что-то про производительность при такой маленькой нагрузке. Там, где изображений много, я предпочитаю CDN + отложенная загрузка.

  • @kr0tyara
    @kr0tyara2 жыл бұрын

    Жалко, что у гифок обрезается только первый кадр :(

  • @adrtalladi2404
    @adrtalladi24044 жыл бұрын

    Расскажите своё отношение о Upwork ?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Я работала на Upwork несколько лет, но в те времена он звался oDesk. Мне нравилось =) Потом надоел фриланс, и я ушла в бизнес. Если надоест бизнес, вернусь на Upwork.

  • @iGotton
    @iGotton4 жыл бұрын

    +

  • @user-gr3gh7ml1w
    @user-gr3gh7ml1w4 жыл бұрын

    вопросик: умеет ли nginx делать так как ngrok - делать локальный веб-сервер доступным в сети, по урл как на любой обычный сайт?

  • @coconut_punker
    @coconut_punker4 жыл бұрын

    А хостинги его(nginx) норм поддерживают? Точнее сказать, часто ли встречаются хостинги кто его поддерживает?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

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

  • @chingizmamiyev7973

    @chingizmamiyev7973

    4 жыл бұрын

    В основном apache бывает

  • @user-bf1yv8fx3t

    @user-bf1yv8fx3t

    4 жыл бұрын

    Часто, не на виртуалках, стоит связка apache+nginx

  • @andreydmitriyev4582
    @andreydmitriyev45824 жыл бұрын

    Спасибо, Аидочка! Есть пара вопросов: 1. Подскажи пожалуйста, 8:05 ( кэширование ) - другая ерунда в папке images - тут речь об одном уровне вложенности или подразумевается заведомо бесконеченый уровень ? Или чтобы он стал бесконечным, нужно изменить на что-то вроде нижеследующего? location /images.* 2. Я правильно понял, что следующая запись - ~ ^/img/(?\d+)/(?.+/*)$ Позволит брать в переменную image - каритнку с неограниченной вложенностью (количеством слэшей в адресе)? По концепции рег. выражений вроде правильно - от нуля до бесконечности слэшей. А вот будет ли это правильно в контексте nginx?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Всё верно, будет работать с вложенными папками и в 1 и в 2. Насчёт бесконечности не знаю =) Подозреваю, что уровень вложенности таки конечен. Или NGINX сдастся первым, или браузер.

  • @andreydmitriyev4582

    @andreydmitriyev4582

    4 жыл бұрын

    @@AidaDrogan спасибо!

  • @andreydmitriyev4582

    @andreydmitriyev4582

    4 жыл бұрын

    @@AidaDrogan Еще такой нескромный вопрос: С уменьшением получилось отлично. А С кешированием затупил. У меня папка с проектом в /var/www Пути к картинкам в браузере такого вида по умолчанию: /storage/uploads/images/adverts/72/e904663392f18b6f83a1a02a7792a999.jpeg Попробовал закешировать таким образом location /storage/uploads/images { root /var/www/public/storage/uploads/images; .... В root нужно /var/www указывать, при условии, что нужно кешировать только картинки из /var/www/public/storage/uploads/images ? Сейчас после введения этого локейшена на картинку пало клеймо 404 ( Т.О. заработало, но насколько оно правильно?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Чисто случайно заметила сообщение. KZread часто не шлёт уведомлений об ответах на ответы, лучше вопросы в корень писать или в телегу =) root - это физическое расположение файлов, т.е. как в файловом менеджере /path/to/my_image.jpg, а location - это url, на который надо откликаться в браузере - mysite.com + (location) - /link/to/my_image.jpg. Если кэшируются картинки из одной папки - она и есть root для location к её содержимому. А для тех, которые не кэшируются location свой. Я придерживаюсь мнения, что если что-то работает, так как задумано, значит оно сделано правильно.

  • @andreydmitriyev4582

    @andreydmitriyev4582

    4 жыл бұрын

    @@AidaDrogan 🙏💕 спасибо!

  • @user-vx9ug1nb2t
    @user-vx9ug1nb2t4 жыл бұрын

    Как интересно!!! Но я не совсем понял кто такой Обратный Прокси((( Это гном какой-то???

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Обратный Прокси Васильевич - заслуженный работник веб-сферы, дважды кавалер Ордена Маскировки Серверов =) Это такой гном, который берёт запрос пользователя и передаёт его на другой сервер (но тихонько, так, чтобы пользователь ничего не понял). Потом Прокси Васильевич получает ответ от проксируемого сервера и отдаёт пользователю обратно. В этом видео картинка с котиком пришла с сервера на порту 8888, который был запроксирован на порту 80. В случае с Node.js мы поднимаем сервер на порту 3000 и передаём на него запросы с основного сервера NGINX. Бэкэнд крутится на Node.js, а статические ресурсы отдаёт NGINX. А выглядит это как единый сайт.

  • @user-vx9ug1nb2t

    @user-vx9ug1nb2t

    4 жыл бұрын

    @@AidaDrogan спасибо))) оказывается, это вполне законопослушный гражданин) попробую с ним познакомиться.

  • @zp00v0518
    @zp00v05184 жыл бұрын

    не понял, зачем нужен был 2-й сервер, какая от него польза?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Второй сервер занимается проксированием и кэшированием. Если закэшировать запросы на работу с картинками, можно здорово повысить производительность и не обрабатывать каждый раз изображение. Если у прокси-вервера нашёлся кэш, он его отдаст и не будет беспокоить Image Filter. Кроме того, можно назначить целую группу серверов для обработки изображений (и это, конечно, будут физически другие машины), тогда их нужно описать группой в proxy_pass. А это видео - демка, в которую хотелось впихнуть побольше =)

  • @somedayQ
    @somedayQ4 жыл бұрын

    снега нет(

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Главное, чтобы зима не решила наверстать упущенное в мае =D

  • @user-vx9ug1nb2t
    @user-vx9ug1nb2t4 жыл бұрын

    И как его совместить с nodejs

  • @wizardoflightnings6841
    @wizardoflightnings68414 жыл бұрын

    БОЛЬШОЙ ТЯЖЁЛЫЙ ЦЕННЫЙ КОММЕНТАРИЙ заменяет тысячу обычных маленьких комментариев

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    =D нам нужно БОЛЬШЕ комментариев

  • @LuckyStilet1
    @LuckyStilet13 жыл бұрын

    Консоль в хроме еще окрывается contrl + shift + i

  • @Vimble
    @Vimble4 жыл бұрын

    Почему я раньше тебя нк нашёл?

  • @AidaDrogan

    @AidaDrogan

    4 жыл бұрын

    Вспомнилась бессмертная цитата «Меня трудно найти, легко потерять и невозможно забыть» ;) Добро пожаловать на канал. Рада быть полезной!

  • @Vimble

    @Vimble

    4 жыл бұрын

    @@AidaDrogan)

  • @eugenex8892
    @eugenex88923 жыл бұрын

    Вижу бессмысленным это видео в связи с тем что смена размера картинки свободно реализуется почти на любом языке программирования. И даже не смотря на это, можно спокойно реализовать схожий функционал на ngnix-lua или openresty. После не изучая баги типо /img/MAXINT/котик.png

  • @adrtalladi2404
    @adrtalladi24044 жыл бұрын

    Приглашаем в Дискорд-чат сообщества "АйТиБорода". Тут тебя ждёт ламповое общение в кругу единомышленников: Начинающих программистов и опытных разработчиков с участием русскогоязычных IT-блогеров :) KZread Полезные ссылки нашего сообщества: Стена на KZread - kzread.infocommunity KZread - kzread.info Discord - discord.gg/tWbt4sS Телеграм : t.me/itbeard_chat

Келесі